Technologia wspomagająca osoby z niepełnosprawnością ukryła treści poza ekranem

Upewnij się, że tylko istotne części strony są dostępne dla czytników ekranu i innych technologii wspomagających osoby z niepełnosprawnością. Na przykład treści, które są poza ekranem lub mają charakter prezentacji, powinny być ukryte przed technologiami wspomagającymi.

Testowanie ręczne

Aby sprawdzić, czy treści poza ekranem są ukryte, musisz je ręcznie przetestować za pomocą czytnika ekranu. – Jeśli jesteś użytkownikiem Maca, obejrzyj ten film o używaniu VoiceOver. – Jeśli jesteś użytkownikiem PC, obejrzyj ten film o korzystaniu z NVDA. – Użytkownicy Chromebooków powinni zapoznać się z ChromeVox – wbudowanym czytnikiem ekranu.

Naciskaj klawisz TAB, aby przechodzić między stroną. Czytnik ekranu nie powinien informować o ukrytej treści.

Rozwiązanie

Aby ukryć treści poza ekranem, usuń z kolejności kart element zawierający te treści, ustawiając go na display: none lub visibility: hidden.

Na przykład:

.remove-me {
  visibility: hidden;
}
<button class="remove-me">Can't reach me with the TAB key!</button>

Zobacz też Prawidłowo ustaw widoczność treści poza ekranem.

Zasoby

Kod źródłowy treści niewidocznych na ekranie jest ukryty przed technologią wspomagającą osoby z niepełnosprawnością