Является ли [h6 aria-level = "7"] надежным способом создания элемента [h7]? - PullRequest
0 голосов
/ 28 апреля 2019

Как правило, заголовки HTML могут доходить только до <h6>, прежде чем они становятся недействительными. Насколько я могу судить, следующий способ создания <h7> элемента в HTML - вполне допустимый:

<h6 aria-level="7">This is a heading level 7 element</h6>

Я проверил это в NVDA в Chrome, Firefox и Internet Explorer, и оно работает как положено.

У меня нет доступа к другим программам чтения с экрана. Может ли кто-то, имеющий доступ к множеству комбинаций программ чтения с экрана / браузера, подтвердить, что все вышеперечисленное последовательно передается пользователю как элемент <h7>?

Если вам известна комбинация программ чтения с экрана и браузера, в которой эта техника определенно не работает, пожалуйста, дайте мне знать.

Ответы [ 2 ]

2 голосов
/ 09 мая 2019

Хотя <div role="heading" aria-level="7"> кажется правильным способом определения элемента H7, программы чтения с экрана не всегда рассматривают его как H1-H6. Я могу хотя бы подтвердить, что это не работает с челюстями. С челюстями еще хуже, его принимают за H2!

Протестировано с челюстями на Firefox, Chrome и IE11. Также протестировано с уровнями 8, 9, 10, 11 и 12. Указание aria-level="X" с X>6 неизменно превращает его в H2.

Так что, не используйте этот трюк для создания своего рода элемента H7. Это не универсально поддерживается.

Тебе лучше подумать еще раз о структуре своей страницы. Вам действительно нужно 7 уровней заголовков? Часто говорят, что хороший документ не должен иметь более 3 уровней, может быть 4 для очень длинного или тяжелого технического документа, исключительно 5. Учитывая особый статус H1, давайте добавим один. Итак, 6 уровней должно быть более чем достаточно.

Разве вы не пропустили некоторые уровни? Пропуск уровней заголовков семантически некорректен, и вам не следует делать это только из-за внешнего вида.

Фактически, в спецификации ARIA никогда явно не указывается, что указание уровня выше 6 разрешено. Значение по умолчанию для уровня арии - 2. Это объясняет законное поведение челюстей при обнаружении недопустимого значения для уровня арии.

2 голосов
/ 28 апреля 2019

Является ли [h6 aria-level = «7»] надежным способом создания элемента [h7]?

Нет.

Это идет вразрез с вторым правилом ARIA :

Не меняйте собственную семантику, если только вам это не нужно.

Если вы хотитеДля определения нового уровня заголовка вы должны использовать

<div role="heading" aria-level="7">

См. пример WAI ARIA:

В этом примере показано, как реализовать заголовок уровня 7 с использованием роли= "заголовок" и атрибут уровня арии.Поскольку HTML поддерживает заголовки только до уровня 6, нет собственного элемента, обеспечивающего эту семантику.

РЕДАКТИРОВАТЬ: еще один пример в спецификации WCAG ARIA12: Использование role = heading для идентификации заголовков (спасибо @ Daniel-tonon за указание на это)

Обратите внимание, что JAWS имеет плохую поддержку на aria-level выше 6, независимо от того, используете ли вы h6 или div (см. ответ @QuentinC)

...