heading
Маркира елемент като заглавие. Първо се използват <h1>–<h6> — те носят правилната семантика и правилното ниво безплатно. Към role="heading" се прибягва само когато трябва да се повиши елемент, който не може да бъде <h*>.
Кога да се използва
Винаги се избира <h1> до <h6> на първо място. Нативният елемент за заглавие предоставя ролята, нивото и вградения стил на потребителския агент.
role="heading" е подходящо само когато не може да се използва нативно заглавие — обикновено в ограничена CMS система, която рендира целия текст като <p> или <div>. В такъв случай ТРЯБВА да се зададе aria-level с число от 1 до 6 (или по-голямо, но помощните технологии на практика игнорират нива над 6).
Нивата на заглавията не трябва да се прескачат: след <h2> не трябва да следва <h4> без <h3> между тях. Потребителите на екранни четци, навигиращи по заглавия, разчитат на последователна структура.
Чести грешки
role="heading"безaria-level. Ролята задължително трябва да носи нивото.- Визуално оформени „заглавия” (едър получер текст), обвити в
<div>или<span>без роля на заглавие. Потребителите на екранни четци ги пропускат напълно. - Множество елементи
<h1>на една страница, когато се предвижда само едно основно заглавие. Добрата практика е един<h1>на страница, който назовава основното съдържание. - Прескачане на нива — от
h2директно наh4— нарушава структурата на документа. - Декоративен текст, оформен като заглавие, но без да е предвиден за такова, маркиран като заглавие. Обърква навигацията с екранен четец.
Пример
<!-- Предпочитан вариант -->
<h2>How to file a complaint</h2>
<!-- Само когато <h2> е невъзможно -->
<div role="heading" aria-level="2">How to file a complaint</div>