Семантическая разметка

Эта статья — пример использования семантического HTML. Семантическая разметка —
это "радикальная" система обозначений, в которой мы применяем для любого контента
соответствующий ему HTML-элемент.
Например, для обозначения абзаца используется простой тег р в начале и в конце
текста абзаца.
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonuirany nibh
euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
<b>Избегайте мешанины из тегов</b>
Семантический HTML не слишком широко распространен в Web-пространстве.
Поскольку различные HTML-элементы выглядят по-разному при отображении в
обозревателе, Web-дизайнеры для получения нужного визуального представления
приготовляют зачастую странные смеси из HTML-элементов, которые обычно называют
теговой мешаниной или солянкой из тегов.
Для повышения контроля над внешним видом дизайнеры могут добавить
презентационные или оформительские HTML-теги, противоречащие семантически размеченному
контенту, как, например, такие:
<pxfont face="Georgia, Times, serif" size="+2">Lorem ipsum dolor</font> <font
face="Arial, Helvetica, san-serif" size="l">sit amet, consectetuer adipiscing
elit, sed diam <b>nonummy</b> nibh euismod tincidunt ut laoreet dolore magna
aliquam erat volutpat .</fontx/p>
Эти дополнительные HTML-теги присутствуют здесь для управления внешним видом
лишь одного абзаца.
Если вы применяете традиционное HTML-кодирование, каждому единичному
элементу HTML-страницы сайта может потребоваться кодирование с помощью
дополнительных элементов, задающих конкретные цвета, шрифты, выравнивание и расположение,
задуманные дизайнером. Этот процесс крайне утомителен и приводит к ошибкам.
Представьте себе, что вы проектируете Web-сайт из 20 страниц и хотели бы вставить в
него конкретные элементы дизайна, такие как цвета, шрифты, размеры и
выравнивание. Теперь представьте себе сопровождение Web-сайта из 1 000 страниц. А что вы
скажете о Web-сайте, содержащем 1 000 000 страниц?
HTML-документы сайтов быстро обрастают дополнительным кодом, что делает и
контент, и код почти неуправляемыми.
<b>HTML — это структура документа</b>
Итак, очень важно средствами HTML добиться максимально возможной корректности
структуры документа. Благодаря применению семантического экономного
кодирования Web-разработчики сокращают время, необходимое для технической поддержки, и
формируют исходную структуру, к которой могут применяться таблицы стилей.