Как заставить программу чтения с экрана начать читать веб-контент после прокрутки

Question

Я делаю доступное веб-приложение.Одной из функций является кнопка, которая позволяет пользователям переходить к определенному разделу страницы.Я использую window.scrollTo (x, y) для этой функции.

Сейчас тестирую свое приложение, используя встроенный Mac VoicerOver, я обнаружил, что хотя я могу без проблем нажимать на кнопку и прокручивать,после прокрутки VoiceOver ничего не читает.Вместо этого я должен щелкнуть мышью или использовать эквиваленты клавиатуры, чтобы она прочитала содержимое, отображаемое на экране после прокрутки.

Боюсь, что некоторые пользователи могут не осознавать, что им нужен еще один щелчок посленажав на кнопку.У меня есть два возможных решения:

1. Когда программа чтения с экрана читает кнопку, она также сообщает пользователю, что, если они хотят перейти в livechat, они должны нажать еще раз после нажатия на кнопкукнопка.Я знаю, как реализовать это, но это выглядит многословно и глупо.

2. Измените мой код, чтобы VoiceOver читал содержимое после прокрутки.Я не знаю, как реализовать это.

Содержимое, которое я хотел бы, чтобы программа чтения с экрана читала, обернуто в тег.

Answer 1

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

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

Звучит так, будто вы пытаетесь сделать последнее:

позволяет пользователям прокручивать до определенного раздела страницы

В этом случаеВам также необходимо поместить фокус клавиатуры на этот элемент с помощью вызова focus() javascript.Перемещение фокуса заставит VoiceOver прочитать этот контент.Но чтобы переместить фокус на изначально не фокусируемый элемент (такой как <h2> или <section> или <p>), принимающему элементу потребуется tabindex="-1".

<h2 tabindex="-1" id="myh2">some heading</h2>

, а затемгде-то у вас был бы этот javascript:

var element = document.getElementById("myh2");
element.focus();