Какие минусы у данного решения?

Question

[leeroyjenkins176]

Нашел интересное решение по созданию кнопок-инпутов. Имеет ли оно неочевидные минусы/проблемы с доступностью, по сравнению с обычным способом, когда скрывают input и стилизируют label?

Comments

[Ankhena]

Имеет ли оно неочевидные минусы/проблемы с доступностью, по сравнению с обычным способом, когда скрывают input и стилизируют label?

Оно имеет очевидные плюсы по сравнению с описанным старым (который вы называете обычным) способом. Особенно, если раньше скрывали не доступно, а через display none.
Только нужно вернуть label'ы.

И для доступности предпочтение нативным технологиям. Т.е. label лучше, чем aria-label, если нет каких-то значимых аргументов не использовать тег.

Сейчас вы показываете три радио, но убрали от них подписи. Ладно, aria-label будут озвучены скринридерами, но зрячие-то как догадаются на что нажимать?

Answer 1

[Виктор Кожухарь]

А не надо гадать. Находите какой-то автоматический инструмент, который проверяет все эти параметры, и радуетесь. Есть куча подобных расширений для браузеров.
Например:

https://silktide.com/toolbar/screen-reader-simulator/

https://chromewebstore.google.com/detail/web-disab...

Ваша цель:
- сделать так, чтобы устройства для слепых "screen reader" адекватно сообщали пользователю, что от него требуется.
- чтобы контраст был адекватным, чтобы и слабовидящие могли пользоваться

Comments

[ImagineTables]

А если сравнить, скажем, с тяжеловесным JAWS (видел упоминания его в статьях по аксесабилити на Хабре), что удобнее?

[Виктор Кожухарь]

ImagineTables, А это вы сами для себя найдите, что вам удобно, и что покрывает все основные параметры доступности

Answer 2

[Everything_is_bad]

Очевидный минус - нестандартный контрол, теперь еще нужно думать как донести до юзера, что тут поведение radio button

Comments

[Ankhena]

Это же не зависит от того каким способом сверстано, выглядеть будет одинаково.