Предпочтительная техника для использования элементов HTML5 / ролей ARIA
Так что это небольшая проблема, о которой я постоянно думаю. Около года или двух меня интересовало, как лучше всего использовать элементы HTML5.
Наиболее частая техника, которую я вижу - используйте такие элементы, как header, footer, section, помимо классов и ролей ARIA на них. Используйте html5shiv.js для старых браузеров.
Это больше соответствует постепенному ухудшению, а не прогрессивному улучшению. Если JS не включен / не доступен вообще в старых браузерах для мобильных устройств и настольных компьютеров, мы теряем возможность стилизовать макет, созданный исключительно с элементами HTML5.
Другой подход, который я видел, больше соответствует прогрессивному усовершенствованию и не полагается на то, что JS был включен в старых браузерах для правильной работы макета. Я только что говорил об этом с Джошем Кларком [Global Moxie]. Они использовали этот подход в м. версия журнала People. http://www.people.com/people/mobile/home/ Они использовали элементы HTML5, чтобы помочь обрисовать семантику документа и элементы div с классом стилей. Ни один из стилей не зависел от таких элементов HTML5, как header, footer, aside, section.
Один из моих вопросов: если роли ARIA уже заданы на элементах div, полезно ли размещать элементы HTML5 вокруг элементов div /span, чтобы лучше разметить разметку документа? Чем это полезно, кроме "семантики"?
Если добавить элементы HTML5 вокруг элементов div, которые используются для стилизации, было бы полезно перенести роли ARIA из элементов div в элементы HTML5? Я предполагаю, что будет, но хотел бы получить больше отзывов об этой технике.
1 ответ
Спецификация HTML5 значительно улучшила автоматизацию алгоритма выделения контуров, и такие браузеры и программы чтения с экрана определенно выиграют, если вы включите теги html5 и роли ARIA.
Mozilla подготовила отличный документ на эту тему, в котором рассматривается включение элементов html5 в документ html4. Это должно послужить отличным примером того, где вы можете поменять некоторые элементы div для более семантических элементов. Найдено здесь: https://developer.mozilla.org/en-US/docs/HTML/Sections_and_Outlines_of_an_HTML5_document
С учетом вышесказанного, новые семантические элементы HTML5 действительно захватывают большую часть территории div, но div все равно следует использовать, когда нет другого семантически подходящего элемента, подходящего для вашей цели. Это также было значительно расширено доктором html5. Найдено здесь: http://html5doctor.com/you-can-still-use-div/