Тег h6 размечает заголовок шестого уровня - последнего, который есть в HTML. Тег парный, закрывающий обязателен, собственных атрибутов нет, только глобальные. По умолчанию это самый мелкий заголовок: он меньше h5 и заметно меньше обычного текста, так что выделяется только жирным начертанием.
<h5>Параметры запроса</h5>
<h6>Обязательные</h6>
<h6>Необязательные</h6>Почему шестой уровень последний
Уровней заголовков в HTML ровно шесть: от h1 до h6. Седьмого нет, и это не упущение, которое когда-нибудь исправят, - шести уровней хватает любому разумно устроенному документу с запасом.
Написать <h7> вам, разумеется, никто не помешает: браузер не выдаст ошибку и покажет текст. Но заголовком считать его не станет. Для браузера это просто неизвестный элемент - такой же, как выдуманный <qwerty>: ни роли заголовка, ни места в структуре документа, ни строки в списке заголовков, по которому перемещается читатель программы чтения с экрана. Визуально текст на месте, а структурно его нет.
Пример: все шесть уровней подряд
Весь ряд без единой строчки CSS. С четвёртого уровня заголовки перестают быть крупнее текста, а шестой - самый мелкий из всех.
Любопытно, что несуществующие уровни в вебе всё-таки попадаются: проект Web Almanac, считающий теги на миллионах страниц, отдельно отмечает встречающиеся h7 и h8 и прямо рекомендует их не применять. Обычно они появляются не от хорошей жизни, а когда структура документа разрослась и автору не хватило уровней.
Что будет, если задать седьмой уровень
Обходной путь всё-таки существует. Уровень заголовка можно объявить не тегом, а ролью: элементу задают role="heading" и указывают номер через aria-level. Формально это позволяет выйти за шестой уровень, и вокруг этого приёма ходит изрядная путаница - одни источники пишут, что браузер всё равно сбросит такой заголовок ко второму уровню, другие говорят об уровнях вплоть до девятого.
Проверить это несложно, что мы и сделали: вот что Chromium реально сообщает в структуру доступности.
| Разметка | Уровень в структуре доступности |
|---|---|
<h6> | 6 |
role="heading" aria-level="6" | 6 |
role="heading" aria-level="7" | 7 |
role="heading" aria-level="9" | 9 |
role="heading" aria-level="12" | 2 |
role="heading" без уровня | 2 |
<h7> | заголовком не считается |
Итог проверки: уровни с седьмого по девятый браузер передаёт как есть, а всё, что выше девятого, сбрасывается до двойки - и двойка же достаётся заголовку, у которого уровень не указан вовсе. Так что правы оказываются обе стороны спора, просто про разные случаи.
Вот только для читателя это ничего не меняет. Программы чтения с экрана уровнями выше шестого не пользуются: перехода по клавишам к заголовкам седьмого, восьмого и девятого уровня у них нет, а JAWS такие заголовки и вовсе понижает до второго уровня. Браузер число передаёт, а воспользоваться им некому - подробный разбор с примерами есть в статье «Дополнительные уровни заголовков» на Веб-стандартах.
Та же оговорка касается и атрибутов headingoffset и headingreset, которые сдвигают вычисленный уровень заголовков внутри блока: даже они не поднимают уровень выше девятого. Зачем эти атрибуты вообще понадобились, разобрано на странице тега h5.
Практический вывод простой: потолок - шестой уровень, сколько бы браузер ни умел передавать. Если структура упёрлась в него, это разговор не про нехватку тегов, а про то, что документ пора делить на страницы.
Частые ошибки
Шестой уровень попадает в разметку двумя путями, и оба обычно ошибочны: либо от нехватки уровней в переусложнённом документе, либо просто ради мелкого жирного текста.
| Ошибка | Что происходит | Как исправить |
|---|---|---|
Применён тег <h7> | Браузер не считает элемент заголовком, в структуре его нет | Пересмотреть структуру: шести уровней хватает |
role="heading" с уровнем выше шестого | Браузер уровень передаёт, но программы чтения с экрана им не пользуются | Остаться в пределах h1-h6 |
h6 применён как мелкая подпись | Обычный текст объявляется заголовком раздела | Оставить абзац и задать размер через font-size |
До h6 дошли в обычной статье | Структура вшестеро подробнее содержания | Разделить материал на несколько страниц |
