Зрячим пользователям будет удобно сфокусироваться на первом элементе, требующем действия, таком как поле поиска на amazon.com (хотя они этого не делают). Но зрячие пользователи могут окинуть взглядом всю страницу. Они могут видеть, где находится фокус (при условии, что у вас есть индикатор фокуса, 2.4.7) по отношению к остальной части страницы и сразу узнает, что есть элементы навигации до местоположения фокуса и другие элементы для взаимодействия после местоположения фокуса.
Для пользователей с плохим зрением, которые используют лупу, их область просмотра будет смещена, чтобы включить элемент, находящийся в фокусе. Обычно при загрузке страницы фокус переходит к первому элементу в DOM, который может получить фокус. Обычно это домашний логотип в левом верхнем углу (для языков LTR). ). Поскольку область просмотра находится в верхнем левом углу, пользователь с плохим зрением будет знать, что он может перетащить область просмотра вправо или вниз, чтобы изучить больше страницы. Но если первоначальный фокус находится где-то в середине страницы, это может дезориентировать. Пользователь может не знать, где на странице он находится. Насколько далеко от верхнего левого угла сместилось окно просмотра? Как далеко они могут исследовать вверх или вниз, влево или вправо?
Для пользователей с очень слабым зрением, слабовидящих или слепых пользователей, использующих программы для чтения с экрана, дезориентация еще более драматична. Программное обеспечение для чтения с экрана имеет отличные инструменты навигации, поэтому легко просматривать различные элементы страницы при условии, что используются семантические элементы html, такие как ‹h2> или ‹table> или ‹ul>. Вы можете переходить к заголовкам с помощью клавиши «H», к таблицам — с помощью клавиши «T», а к спискам — с помощью клавиши «L». Но опять же, пользователи программ чтения с экрана будут ожидать, что первоначальный фокус будет в левом верхнем углу. Они, конечно, могут сориентироваться и понять, где они находятся на странице, но это требует некоторых когнитивных усилий, как и у пользователя экранной лупы.
Так как же сделать так, чтобы все эти типы пользователей (а также многие другие типы пользователей) были приятными?
Как отмечается в одном ответе, «пропускать ссылки" очень удобно. С точки зрения доступности это называется "блокировки обхода" (2.4.1). Они позволяют фокусу по умолчанию находиться в левом верхнем углу (или там, где фокус по умолчанию), а когда вы tab, фокус перемещается на «ссылку пропуска», которая представляет собой ссылку на странице, которая позволяет вы переходите к основной части страницы. Это отлично подходит для пользователей, использующих только клавиатуру (которые могут быть зрячими или слабовидящими пользователями), пользователей экранной лупы и пользователей программ чтения с экрана.
Однако, если вы действительно хотите, чтобы фокус был на определенном элементе, если этот элемент является элементом ‹input> или ‹button>, вы можете использовать autofocus. Для других изначально фокусируемых элементов, таких как ‹a>, вы можете иметь javascript, который запускается при загрузке для вызова focus() на элементе.
Это не нарушение WCAG, если первоначальный фокус находится где-то на странице, кроме первого элемента, поэтому вы можете поместить его в свою форму, просто сделайте это таким образом, чтобы уменьшить путаницу для пользователей, у которых ограничено зрение или которые не могут использовать мышь.
Для получения дополнительной информации о tabindex см. «5.5 Навигация с помощью клавиатуры между компонентами (последовательность вкладок) ". Обратите внимание, что для значений tabindex больше 0 он говорит:
«Авторам настоятельно рекомендуется НЕ использовать эти значения».
person
slugolicious
schedule
10.12.2018
tabindex=0только для 1-го тоже не работает. Ссылка, которую вы разместили, гласит:Setting tabindex="0" will take an element and make it focusable. It doesn’t set the element’s position in the tab order, it just allows a user to focus the element in the order determined by its location with the DOM.Я попробовал это, и я все еще сначала нажимаю верхние полосы. - person gene b. schedule 10.12.2018