Obrazy muszą mieć tekst alternatywny.

Po co jest to sprawdzenie

Czytnik ekranu potrafi odczytać wyłącznie tekst. Obraz bez opisu to cisza; przycisk z samą ikoną bez nazwy to słowo „przycisk” i nic więcej.

Co zwykle je wywołuje

• błądZdjęcie produktu z `alt=""`, choć to zdjęcie jest jedyną rzeczą nazywającą produkt.
• błądPrzycisk z samą ikoną bez `aria-label`, odczytywany jako „przycisk”.
• błądWykres wrzucony jako PNG z `alt="wykres"` i bez tabeli danych gdziekolwiek.
• błądCzysto ozdobne elementy z opisowym tekstem alternatywnym, przez co odbiorca słyszy szum.

Jak to naprawić

• róbNapisz tekst alternatywny tak, jak przeczytałbyś stronę komuś przez telefon.
• róbCzysto ozdobnym obrazom daj `alt=""` — puste, nie brakujące — żeby technologie asystujące je pominęły.
• róbPrzy przyciskach z ikoną `aria-label` nazywające czynność, nie ikonę: „Usuń szkic”, nie „kosz”.
• róbPrzy wykresach udostępnij gdzieś liczby, na których się opierają — tabelę, zdanie podsumowania, plik do pobrania.

Jak to jest raportowane

A11ySignal zgłasza to z wagą krytyczny. Każdy błędny element ma swój selektor CSS i kod, który zawiódł, więc trafisz prosto do właściwej linii, zamiast jej szukać. Deque publikuje szczegóły na poziomie silnika:

https://dequeuniversity.com/rules/axe/4.13/image-alt ↗

Sprawdzenie zaimplementowane w axe-core 4.13.0, © Deque Systems, MPL-2.0.

Inne sprawdzenia dla 1.1.1