Семейства элементов HTML5

Веб-программирование --- HTML5 --- Семейства элементов

Ранее мы рассматривали изменения в синтаксисе HTML5. Но более важными являются добавления, удаления и изменения поддерживаемых в HTML элементов. В последующих разделах мы вкратце рассмотрим эти аспекты.

Добавленные элементы в HTML5

Новые элементы, с кратким описанием перечислены в таблице:

Удаленные элементы из HTML5

В HTML5 были не только добавлены новые элементы, но и несколько элементов были лишены официального родства с ним. Эти элементы будут работать в браузерах, но любой уважающий себя валидатор HTML5 обнаружит их и закатит по этому поводу скандал.

Самыми заметными шагами при удалении были те, что поддерживают продолжаемую в HTML5 философию (впервые введенную в XHTML): элементам оформления не место в языке. К таким элементам относятся элементы, используемые для форматирования веб-страниц, и даже самый "зеленый" веб-разработчик знает, что это работа для таблиц стилей. Удалены, среди прочих, были элементы оформления, которые не использовались профессиональными веб-разработчиками годами, такие как <big>, <center>, <font>, <tt> и <strike>. Атрибуты оформления HTML постигла та же судьба, поэтому нет надобности рассматривать их здесь.

Кроме этого, HTML5 вбил осиновый кол в погребенный веб-разработчиками инструмент фреймов. Когда инструмент фреймов HTML впервые увидел свет, он казался отличным способом для отображения нескольких веб-страниц в одном окне браузера. Но в настоящее время фреймы воспринимаются больше как кошмар доступности к веб-страницам, создающим проблемы для поисковых движков, вспомогательных приложений и мобильных устройств.

Но, что довольно интересно, элемент <iframe>, который позволяет вставлять одну страницу в другую, проскользнул в новый стандарт. Это ему удалось по той причине, что он используется в веб-страницах для выполнения ряда интеграционных задач, таких как вставка в страницы окон YouTube, рекламных блоков и поисковых полей Google.

Еще несколько элементов были удалены из-за того, что они просто предоставляли уже существующие возможности другим способом и были источником частых ошибок. Например, функцию элемента <acronym> лучше предоставляет элемент <abbr>, а элементу <applet> предпочтителен элемент <object>. Но подавляющее большинство элементов HTML было сохранено в HTML5.

Для любителей цифр, семейство HTML5 состоит немногим из более 100 элементов. Из них почти 30 новых и около 10 существенно измененных. Просмотреть список элементов (и узнать, какие из них новые или измененные) можно на веб-сайте w3.org/TR/html-markup/.

Адаптированные элементы HTML5

У HTML5 есть еще один интересный трюк — некоторые старые методы применяются с новой целью. Возьмем, например, элемент <small>, предназначенный для уменьшения размера шрифта в блоке текста. Будучи не самым оптимальным способом решения этой задачи, для которой лучше подходят таблицы стилей, этот элемент впал в немилость веб-разработчиков. Но в отличие от выброшенного элемента <big>, элемент <small> остался в HTML5, однако функция его несколько иная.

Теперь элемент <small> используется для обозначения так называемого "мелкого текста" — информации, которую не горят желанием предоставить, но которую нужно разместить согласно каким-либо требованиям. Например, предупреждение об отказе от ответственности, помещенное в самом низу сайта, наподобие следующего:

<small>Файлы для обмена предоставлены пользователями сайта. Администрация не несёт ответственности за их содержание. 
 На сервере хранятся только торрент-файлы. Это значит, что мы не храним никаких нелегальных материалов, 
 а так же материалов охраняемых авторским правом.</small>

Как и ранее, текст внутри элемента <small> отображается мелким шрифтом, если только эти настройки не отменены посредством таблицы стилей.

Другим элементом, чей эффект остался прежним, но концептуальное значение было модифицировано, является элемент <hr>, который рисует разделяющую линию между блоками текста. В HTML5 элемент <hr> рисует ту же самую линию, но теперь она представляет тематическое прерывание, например переход к другому вопросу. Таким образом, результат форматирования остался прежним, но имеет новое логическое значение.

Подобным образом зачеркивание шрифта элементом <s> теперь несет концептуальную нагрузку — зачеркнутый этим элементом текст считается больше неверными или утратившим значимость, вследствие чего он и был "вычеркнут" из документа. Смещение значения действия этих двух последних элементов более утонченное, чем элемента <small>, т.к. в данных изменениях перенимается способ использования этих элементов в традиционном HTML.

Подкорректированные элементы

В HTML5 также изменены правила для нескольких элементов. Обычно эти изменения затрагивают только незначительные аспекты, которые заметят лишь фанаты HTML, но иногда они имеют более глубокий эффект. В качестве примера, среди прочих, можно взять редко используемый элемент <address>, который, несмотря на свое название, не подходит для работы с почтовыми адресами. Его назначение более узкое — предоставление контактной информации о создателе документа HTML, обычно адреса электронной почты или ссылки на веб-сайт:

<address>
      <a href="mailto:alexerohinzzz@gmail.com">Administrator</a>
</address>

Также несколько изменилось назначение элемента <cite>. Его можно продолжать использовать для указания названия какой-либо интеллектуальной работы, например рассказа, статьи, телевизионной программы и т.п., но элемент <cite> больше неприемлемо использовать, чтобы помечать имена людей.

Более серьезной корректировке подвергся элемент <a>, используемый для создания ссылок. В более ранних версиях HTML элементу <a> разрешалось содержать текст или изображение со ссылкой. А в HTML5 он может содержать все и вся, что означает, что теперь ссылки можно делать из целых абзацев текста, вместе со списками, изображениями и т.п. Текст со ссылкой подчеркивается, а шрифт окрашивается в синий цвет, как и границы изображения. Веб-браузеры поддерживали эти свойства годами, но только в HTML5 они приобрели официальный статус стандарта, что, впрочем, не делает их более или особенно полезными.

Некоторые корректировки еще не работают ни в одном браузере. Например, элемент <ol> (упорядоченный список) теперь имеет атрибут reversed (реверс), который позволяет вести счет в обратном направлении (или к единице, или к любому другому значению, указанному в атрибуте start). Но эта возможность еще не распознается ни одним браузером.

Стандартизированные элементы

В HTML5 также добавлена официальная поддержка нескольких элементов, которые поддерживались в языках HTML и XHTML, но на неофициальном уровне. Одним из лучших примеров таких элементов будет элемент <embed>, который используется везде и повсюду в интернете как универсальный метод для добавления в страницу подключаемого модуля.

Более экзотичным является элемент <wbr>, который указывает необязательный разрыв слова, т.е. место, в котором браузер может сделать перенос текста на новую строку, если слово не помещается в контейнер:

<p>Название нашей компании 
 ВордСистемБиоФитнес<wbr>СтронгХелсДабл<wbr>ИнтертейментВорлВайд<wbr>сВитаминомС</p>

Элемент <wbr> полезен, когда нужно вставить длинные названия (которые иногда встречаются) в ограниченное пространство, например в ячейку таблицы или текстовое поле. Но даже если браузер поддерживает элемент <wbr>, он разорвет слово только в том случае, если оно не помещается в доступное пространство. Таким образом, слово в предыдущем примере браузер может отобразить одним из следующих образов:

Элемент <wbr> является естественным дополнением к стандартному элементу <nobr>, который используется для предотвращения разрыва слова, когда для него имеется достаточно места. Но вплоть до HTML5 он не поддерживался никаким стандартом и распознавался только некоторыми браузерами.