2.5.3 Etykieta w nazwie - poziom A

Jeżeli komponent interfejsu użytkownika ma etykietę widoczną na ekranie, to jego nazwa programowa ma zawierać tę etykietę. Dzięki temu osoba korzystająca z rozpoznawania mowy może powiedzieć dokładnie to, co widzi, a technologia wspomagająca trafi w ten sam element.

O co chodzi w kryterium 2.5.3 Etykieta w nazwie?

Użytkownik widzi na przycisku napis „Szukaj”, a czytnik/technologia rozpoznająca element powinna „widzieć” w nazwie właśnie „Szukaj”, a nie np. „Lupa”, „Przycisk 1” albo „Wyszukaj w serwisie”. To szczególnie ważne przy sterowaniu głosem: użytkownik mówi „kliknij Szukaj” i oczekuje, że to zadziała.

Jeśli na ekranie jest tekst etykiety, a w nazwie programowej jest coś innego, pojawia się rozjazd: użytkownik widzi jedno, a system ma nazwany element inaczej. To jest dokładnie sytuacja, której 2.5.3 ma zapobiegać.

Najczęstsze powody niespełnienia kryterium sukcesu 2.5.3

1. Widoczna etykieta i nazwa programowa nie są zgodne: na ekranie „Zapisz”, a w nazwie „Wyślij formularz” albo samo „Button”.
2. W przyciskach z ikoną i tekstem nazwa programowa bierze się z ikony lub atrybutu, a nie zawiera widocznej etykiety (np. przycisk ma tekst „Pobierz”, ale nazwa jest „Download”).
3. Widoczny tekst jest skracany lub zmieniany w nazwie programowej (np. na ekranie „Zarejestruj się”, a w nazwie „Rejestracja”), przez co sterowanie głosem bywa niepewne.

Rekomendacje jak spełnić kryterium 2.5.3

Ta sama nazwa na ekranie i w systemie

Trzymaj zasadę: to, co użytkownik widzi jako etykietę, powinno wystąpić w nazwie programowej. Ponadto:

• Jeśli na przycisku jest tekst, najbezpieczniej, gdy nazwa programowa wynika właśnie z tego tekstu . Jeśli dodajesz dodatkowe doprecyzowanie, niech ono będzie dodatkiem, ale niech nie usuwa widocznej etykiety.
• Jeśli przycisk jest ikoną z tekstem, dopilnuj, żeby nazwa nie była oparta tylko na ikonie. Widoczna etykieta ma być częścią nazwy.
• Jeśli musisz użyć innego sformułowania technicznie, dopilnuj, żeby widoczne słowo nadal było w nazwie (np. „Szukaj – wyszukiwarka serwisu”, a nie samo „Wyszukiwarka serwisu”).

Pełny tekst kryterium 2.5.3 Etykieta w nazwie

W przypadku komponentów interfejsu użytkownika z etykietami zawierającymi tekst lub obrazy tekstu, nazwa zawiera tekst, który jest prezentowany wizualnie.

Źródło: https://www.w3.org/Translations/WCAG21-pl/#etykieta-w-nazwie

Chcesz wiedzieć więcej?

• 2.1.1 Klawiatura - poziom A
• 2.1.2 Brak pułapki na klawiaturę - poziom A
• 2.1.3 Klawiatura (bez wyjątków) - poziom AAA
• 2.1.4 Jednoznakowe skróty klawiaturowe - poziom A
• 2.2.1 Dostosowanie czasu - poziom A
• 2.2.2 Pauza, zatrzymanie, ukrycie - poziom A
• 2.2.3 Brak czasu - poziom AAA
• 2.2.4 Przerywanie - poziom AAA
• 2.2.6 Ostrzeżenie o limicie czasu - poziom AAA
• 2.3.1 Trzy błyski lub wartości poniżej progu - poziom A
• 2.3.2 Trzy błyski - poziom AAA
• 2.3.3 Animacja po interakcji (Poziom AAA)
• 2.4.1 Możliwość pominięcia bloków - poziom A
• 2.4.2 Tytuł strony - poziom A
• 2.4.3 Kolejność fokusu - poziom A
• 2.4.4 Cel łącza (w kontekście) - poziom A
• 2.4.5 Wiele dróg - poziom AA
• 2.4.6 Nagłówki i etykiety - poziom AA
• 2.4.7 Widoczny fokus - poziom AA
• 2.4.8 Lokalizacja - poziom AAA
• 2.4.9 Cel łącza (z samego łącza) - poziom AAA
• 2.4.10 Nagłówki sekcji - poziom AAA
• 2.5.1 Gesty wskazujące - poziom A
• 2.5.2 Rezygnacja ze wskazania - poziom A
• 2.5.3 Etykieta w nazwie - poziom A
• 2.5.4 Aktywowanie ruchem - poziom A
• 2.5.5 Rozmiar celu - poziom AAA
• 2.5.6 Równoległy mechanizm wprowadzania danych - poziom AAA