WCAG 1.1.1 Treść nietekstowa (A) · aktualizacja 2026-09-25

Brak tekstu alternatywnego obrazka: jak napisać dobry alt (WCAG 1.1.1)

Każdy obrazek, który niesie informację, potrzebuje atrybutu alt z krótkim opisem tego, co ważne na zdjęciu. Obrazek czysto ozdobny dostaje pusty alt (alt=""), żeby czytnik ekranu go pominął. Brak atrybutu to błąd, bo wtedy czytnik często odczytuje nazwę pliku, na przykład „IMG_4821 kropka jpg".

Jak często się zdarza

Według raportu WebAIM Million 2026 obrazki bez tekstu alternatywnego były na 53,1% stron głównych. Szczególnie szkodzą obrazki będące linkami, bo wtedy nie wiadomo, dokąd prowadzi link.

Komu to przeszkadza

Osoby niewidome i słabowidzące, które słuchają strony przez czytnik ekranu. W sklepie brak altu przy zdjęciu produktu oznacza, że klient nie wie, jaki kolor ma kubek, który właśnie ogląda.

Skąd się bierze

Zdjęcia produktów wgrane przez panel sklepu bez uzupełnienia pola „tekst alternatywny".
Logo w nagłówku, które jest linkiem do strony głównej, ale nie ma opisu.
Ikony koszyka, lupy albo serca (ulubione) dodane jako obrazki bez opisu.
Alt wypełniony słowami kluczowymi zamiast opisem. To też błąd, tylko mniej oczywisty.

Poprawka w kodzie

Przed

<a href="/koszyk"><img src="ikona-koszyk.svg"></a>
<img src="kubek-01.jpg">

Po

<a href="/koszyk"><img src="ikona-koszyk.svg" alt="Koszyk"></a>
<img src="kubek-01.jpg" alt="Czerwony kubek ceramiczny 300 ml z uchem">

Dla ikony w linku opisz cel („Koszyk"), a nie wygląd („ikona wózka"). Dla zdjęcia produktu opisz to, czego klient nie przeczyta w nazwie obok.

Jak sprawdzić to samodzielnie

Wyłącz obrazki w przeglądarce albo użyj rozszerzenia, które pokazuje alt zamiast obrazka.
Przejdź przez stronę główną i kartę produktu. Czy nadal wiesz, co gdzie jest i dokąd prowadzą linki?
Sprawdź, czy alty nie powtarzają się (sześć zdjęć z altem „kubek" to mało pomocna galeria).
Sprawdź obrazki ozdobne: tła, separatory, ornamenty. One powinny mieć alt="".

Co wykryje skaner, a czego nie

Skaner wykryje

Skaner znajdzie każdy obrazek bez atrybutu alt, obrazkowe przyciski i linki bez nazwy oraz grafiki SVG z rolą obrazka bez opisu.

Wymaga sprawdzenia przez człowieka

Automat nie oceni, czy alt ma sens. „Zdjęcie", „obrazek1" albo lista słów kluczowych przejdą test techniczny, a nadal nic nie mówią. To trzeba przeczytać samemu.

Najczęstsze pytania

Jak długi powinien być tekst alternatywny?

Tak krótki, jak się da, i tak długi, jak trzeba. Zwykle wystarcza jedno zdanie do około 125 znaków. Nie zaczynaj od „zdjęcie przedstawia", bo czytnik i tak informuje, że to obrazek.

Kiedy użyć pustego alt=""?

Gdy obrazek jest czysto ozdobny albo jego treść jest już w tekście obok. Pusty alt to informacja „pomiń", a brak altu to błąd. To dwie różne rzeczy.

Czy tekst alternatywny pomaga w SEO?

Tak, wyszukiwarki używają altu, żeby zrozumieć obrazek. Pisz go jednak dla człowieka. Alt napchany słowami kluczowymi szkodzi osobom z czytnikiem ekranu i nie daje przewagi w wynikach.

Źródła

[1] Understanding Success Criterion 1.1.1W3C Web Accessibility Initiative (WAI)
[2] Web Content Accessibility Guidelines (WCAG) 2.2W3C (World Wide Web Consortium)
[3] The WebAIM Million: raport 2026 o dostępności miliona stron głównychWebAIM, Institute for Disability Research, Policy, and Practice, Utah State University