Новая версия сайта находится по адресу

wa.artel.by

Статья написана FireFalcon'ом с сохранением всех авторских прав.

Давайте учиться писать правильный код. Нет, я вовсе не утверждаю, что вы ничего не смыслите в HTML, читайте дальше.

Итак, многие из вас используют тэги <CITE> или <ADRESS>? Можете не отвечать, я и сам их не использую, однако вот прямо сейчас и начну. Зачем? А затем, что они очень помогают правильно организовать логическую структуру страницы, а правильная сильно упрощает использование CSS. А это, согласитесь, уже предпосылка. Итак мы сегодня будем говорить о так называемых логических тэгах. Для начала просто перечислим их:

<H#> - заголовки
<EM> - выразительность
<STRONG> - ударение
<CITE> - цитата
<ADDRESS> - адрес
<SAMP> - пример
<CODE> - код
<VAR> - переменная

Вот они все. А сейчас займемся каждым в отдельности.

<H#> - обозначает заголовки в теле документа. Бывает шести видов H1, H2, H3, H4, H5, EM, которые отличаются степенью значимости (попросту говоря, размером) заголовков. Самый большой и самый главный - H1. Самый маленький - H6.

Пример:
Код:
<H1>СSS - вот чему надо учиться!</H1>
<H2>HTML надо чувствовать</H2>
<H3>JavaScript любить</H3>
<H4>HomeSite 4.5 знать в лицо</H4>
Итог:

СSS - вот чему надо учиться!

HTML надо чувствовать

JavaScript любить

HomeSite 4.5 знать в лицо

<EM> - обозначает выразительность какого-либо слова в тексте. Частенько вместо этого тэга используется тэг <I>, однако это неправильно с точки зрения логики.

Пример:
Код: Кросс-браузерный код - <EM>главная</EM> цель вебмастера.
Итог: Кросс-браузерный код - главная цель вебмастера.

<STRONG> - обозначает сильный акцент в тексте. Разница между <EM> только в степени выразительности.

Пример:
Код: СSS <STRONG>совершенно необходимы</STRONG> всем.
Итог: CSS совершенно необходимы всем


<CITE> - обозначает ссылку на книгу или веб-сайт. Часто используют внизу страницы для обозначения владельца.

Пример:
Код:
<CITE>Самоучитель сайтостроителя>/CITE>, Минск, 1989
<CITE>Сайт кривыми руками</CITE>, Москва, 1999
Итог:
Самоучитель сайтостроителя, Минск, 1989
Сайт кривыми руками, Москва, 1999

<ADDRESS> - обозначает контактную информацию автора сайта или организации, которой принадлежит сайт.

Пример:
Код:
Наш адрес: <P>
<ADDRESS>
г. Минск, ул. Кропоткина 44, офис 1104
</ADDRESS>
Итог:
Наш адрес:

Г. Минск, ул. Кропоткина 44, офис 1104

<SAMP> - пример. Обычно применяется для обозначения терминов или ключевых слов. В браузере отображается моноширинным шрифтом, например, Courier New. В общем-то похож на тэг <CODE>.

Пример:
Код:
Что такое <SAMP>CSS</SAMP> знает все большее число людей
Итог:
Что такое CSS знает все большее число людей

<CODE> - обозначает программный код. В браузере отображается моноширинным шрифтом. Часто используется вместе с тэгом <PRE>, который лучше передает отступы и сруктуру.

Пример:
Код:
<CODE>
function Opn(){<BR>
newWindow=window.open(' ','NW','width','toolbar=0');<BR>
}<BR>
</CODE>
Итог:
function Opn(){
newWindow=window.open(' ','NW','width','toolbar=0');
}
<VAR> - обозначает переменную из компьютерной программы.

Пример:
Код: Переменная <VAR>width</VAR> содержит ширину нового окна
Итог: Переменная width содержит ширину нового окна

Как вы заметили, большинство из этих тэгов делают текст или наклонным, или жирным, или моноширинным. Почему бы вместо этого не использовать просто тэги <B> или <I>? Ведь это гораздо проще. Так и делает подавляющее большинство вебмастеров, однако есть причины поступать по-другому, и это не только упрощение использования CSS. Логические тэги позволяют браузерам обрабатывать страницу в манере, наиболее свойственной данному браузеру. Допустим текст в тэге <EM> браузеры под Windows заменяют текстом , а браузеры под Unix - жирным. Кроме того, спустя полгода вы легко сможете определить, что вот <ADDRESS> в коде вашей странички обозначает адрес, тогда как, скажем, <SPAN class="adr"> далеко не так интуитивно, да и в CSS проще запутаться.

Так что осваивайте логические тэги. Чем прозрачнее код, тем легче жизнь вебмастера.