Grafiki i zdjęcia z opisami alternatywnymi: podstawa dostępności online

Opis alternatywny obrazu powinien mówić, co użytkownik traci, jeśli nie widzi grafiki. Nie chodzi o wrzucenie do atrybutu alt wszystkich słów kluczowych, tylko o przekazanie sensu obrazu w kontekście konkretnej strony.

Dla osoby korzystającej z czytnika ekranowego zdjęcie bez opisu jest często pustym miejscem. Dla użytkownika na słabym połączeniu internetowym grafika może się nie załadować. Dla Google poprawny opis pomaga zrozumieć, czy obraz wspiera treść, ale nie zastępuje dobrego tekstu na stronie.

Kiedy obraz potrzebuje opisu?

Typ grafiki	Co zrobić?	Przykład
Zdjęcie produktu	Opisz produkt i istotną cechę.	alt="Czarna lampa biurkowa z regulowanym ramieniem"
Wykres lub infografika	Opisz wniosek, a dane pokaż też w tekście.	alt="Wykres pokazuje wzrost konwersji po skróceniu formularza"
Ikona przy funkcji	Jeśli obok jest tekst, ikona może być dekoracyjna.	alt="" dla ikony obok podpisu „Dostawa 24h”.
Zdjęcie dekoracyjne	Nie czytaj go użytkownikowi, jeśli nic nie wnosi.	Pusty alt i rola czysto wizualna.
Zrzut ekranu	Opisz cel zrzutu, nie każdy piksel.	alt="Panel zamówienia z aktywną metodą płatności BLIK"

Dobry alt zależy od kontekstu

Ten sam obraz może mieć różny opis w zależności od miejsca. Zdjęcie laptopa w artykule o pracy zdalnej może być dekoracyjne. To samo zdjęcie w sklepie z komputerami musi opisywać model, kolor i cechy produktu. Dlatego nie warto generować altów automatycznie bez kontroli redakcyjnej.

Najprostszy test brzmi: gdybym czytał tę stronę komuś przez telefon i grafika byłaby ważna, jak opisałbym ją jednym zdaniem?

Najczęstsze błędy w opisach alternatywnych

• Upychanie SEO: „strony internetowe UK projektowanie stron www tanio” zamiast opisu obrazu.
• Powtarzanie podpisu: czytnik ekranowy czyta dwa razy to samo.
• Opis typu „obrazek przedstawia”: zwykle niepotrzebny, bo użytkownik już wie, że to obraz.
• Brak opisu dla przycisku graficznego: użytkownik słyszy nazwę pliku zamiast akcji.
• Tekst zamknięty w grafice: ważna informacja powinna być dostępna również jako HTML.

Proces dla większej strony

1. Zrób listę obrazów z najważniejszych podstron, artykułów i kart produktów.
2. Oznacz obrazy jako: informacyjne, funkcjonalne, dekoracyjne albo złożone.
3. Dla informacyjnych napisz krótki opis sensu obrazu.
4. Dla funkcjonalnych opisz akcję, np. „Pobierz PDF”, a nie wygląd ikony.
5. Dla złożonych grafik dodaj opis w treści obok obrazu.
6. Sprawdź stronę czytnikiem albo przynajmniej audytem dostępności i ręcznym przejściem po obrazach.

FAQ

Czy każdy obraz musi mieć alt?

Każdy obraz powinien mieć atrybut alt, ale nie każdy musi mieć opis. Obrazy dekoracyjne powinny mieć pusty alt, żeby czytnik ekranowy je pominął.

Czy alt pomaga w SEO?

Pomaga, ale tylko wtedy, gdy opis jest naturalny i zgodny z obrazem. Przesadzone frazy w altach wyglądają spamowo i nie poprawiają jakości strony.

Jak długi powinien być opis?

Zwykle wystarczy jedno krótkie zdanie. Jeżeli obraz wymaga dłuższego wyjaśnienia, lepiej dodać opis w treści strony, a alt potraktować jako streszczenie.