Вероятно, вы слышали заявления типа «HTML и так по умолчанию обладает accessibility» или «Не нужно изобретать заново этот абсолютно идеальный элемент управления HTML». Я считаю, что это общие заявления, а не универсальные истины. Веб-разработчикам крайне важно осознавать недостатки платформы, поэтому я решил собрать несколько примеров того, когда у HTML возникают трудности, с точки зрения как accessibility, так и usability.
Это неполный список и он не включает в себя недостатки ARIA. Мне хотелось найти баланс между широко известными проблемами и чаще встречаемыми (но менее известными), а также добавить в список то, что мы воспринимаем, как должное. В каждом из разделов я укажу степень серьёзности проблемы, альтернативные решения и ссылки, по которым можно найти более подробную информацию.
<select multiple>
Давайте начнём с простого. Атрибут multiple элемента <select> не стоит использовать практически никогда. Он похож на полную противоположность одиночного <select>. Единственное, что его оправдывает, так это то, что я пока не встречал этот атрибут ни в одной кодовой базе.
Цитата пользователя программы для чтения экрана (из превосходной статьи Сары Хигли, ссылка на которую приведена ниже):
Это поломанный listbox. Он совершенно поломан, я не вижу, как это можно исправить.
Серьёзность: высокая. Есть большая вероятность того, что большинство ваших пользователей не умеет работать с этим чудовищным элементом управления.
Что использовать вместо: вполне подходящая альтернатива — список чекбоксов; или можно создать собственный listbox с множественным выбором.
Дополнительное чтение: <select> your poison part 2: test all the things (статья Сары Хигли).
<i> (для значков)
Ещё один простой пример для разогрева. Элемент <i> семантически несущественен, поэтому необязательно «плох», если используется для обычного текстового содержимого. Однако чаще он применяется для шрифтов значков.
В обычной ситуации я бы даже не стал включать его в список, ведь это больше ошибка разработчиков, чем проблема платформы. Однако уже 2024 год, а я по-прежнему встречаю элемент <i>, используемый с чем-то наподобие FontAwesome. Это проблемно в основном потому, что веб-шрифт используется для замены текстовых символов (которые могут иметь одно значение) на значки (которые никак не связаны с текстовыми символами).В результате этого текстовые символы, даже если они сгенерированы в CSS, становятся частью контента страницы и по умолчанию будут включены в accessibility-дерево. Кроме того, они плохо выглядят, часто (и непредсказуемо
Интересные статьи
Интересные статьи
