Топ-3 HTML-элемента, которые мы забыли
Привет, Хабр! Представляю вашему вниманию перевод статьи «Top 3 HTML elements that we forgot» автора Stas Melnikov.
Недавно я прочитал спецификации и понял, что мы используем ограниченный набор HTML-элементов. Поэтому хотел бы рассказать о трёх элементах, которые мы забыли, но которые есть в каждом проекте.
Элемент address
Часто нужно разметить блок социальных сетей или другую контактную информацию в наших проектах. Обычно разработчики используют следующий код:
Но спецификация WHATWG содержит специальный элемент address для этой задачи.
Элемент address представляет контактную информацию для ближайшего элемента-предка article или body. Если это элемент body, то контактная информация применяется ко всему документу целиком.
Таким образом, следующий код является более верным:
Элемент ol
Мы должны использовать списки для разметки таких элементов навигации, как breadcrumb, pagination и т.д. Это необходимо, чтобы помочь экранным считывающим устройствам озвучивать количество элементов в навигации.
Обычно мы используем элемент ul. Но спецификация содержит более подходящий тег — ol. В спецификации WHATWG говорится:
Элемент ol представляет список пунктов, где пункты намеренно упорядочены так, что изменение порядка изменит смысл документа.
Если изменим порядок элементов в навигации breadcrumb, изменим значение веб-сайта. Таким образом, следующий код является более верным:
Элемент time
Мы используем элемент span для разметки дат различных публикаций.
October 5
two days ago
a Saturday
Но мы можем использовать для этого тег time, который содержится в спецификации WHATWG. Вот что говорится в спецификации WHATWG:
Элемент time представляет его содержимое наряду с машинно-читаемой формой этого содержимого в атрибуте datetime. Род содержимого ограничен различными датами, временем, часовыми поясами и продолжительностями.
Поэтому мы должны использовать элемент time для разметки дат.