Tekst alternatywny: definicja i kontrola

Co to jest tekst alternatywny?

Tekst alternatywny (alt) to atrybut tekstowy w elemencie obrazu (np. <img src="..." alt="opis">). Jego podstawowe zadania to: udostępnienie opisu obrazu użytkownikom czytników ekranu, dostarczenie zastępczej informacji gdy obraz nie załaduje się oraz uzupełnienie sygnałów kontekstowych dla wyszukiwarek i systemów analizujących obrazy.

Dlaczego tekst alternatywny ma znaczenie dla SEO

Tekst alternatywny pomaga wyszukiwarkom zrozumieć, co przedstawia obraz, co wpływa na indeksację obrazów i kontekst strony. To sygnał pomocniczy obok analizy samego obrazu, metadanych strony i otaczającego tekstu. Ważne: alt wpływa na etapy crawlingu i indeksowania (pomaga w zrozumieniu treści), ale nie jest jedynym ani deterministycznym czynnikiem ustalającym pozycję w wynikach wyszukiwania — ranking jest rezultatem wielu sygnałów.

Jak tekst alternatywny działa technicznie

Na poziomie HTML tekst alternatywny to zawartość atrybutu alt. Czytniki ekranu odczytują ten tekst zamiast obrazu, a crawlery i modele obrazowe używają go razem z innymi sygnałami (np. tytułem strony, caption, surrounding text). W praktyce obrazy są też analizowane wizualnie przez systemy wyszukiwarkowe; alt wzmacnia przekaz i pomaga w sytuacjach, gdy analiza obrazu nie wystarcza.

Przykłady HTML: krótki opis: <img src="/img/jablko.jpg" alt="czerwone jabłko na drewnianym stole">; obraz dekoracyjny bez wpływu semantycznego: <img src="/ornament.svg" alt=""> (pusty alt oznacza, że czytniki go pomijają).

Rodzaje tekstu alternatywnego

Descriptive (opisowy) — krótki, konkretny opis zawartości obrazu; Functional (funkcjonalny) — gdy obraz pełni rolę przycisku lub linku, alt opisuje funkcję (np. "zamknij okno"); Decorative (dekoracyjny) — pusty alt, gdy obraz nie niesie znaczenia; Long description — gdy obraz jest skomplikowany (wykresy, infografiki) i wymaga dłuższego opisu poza atrybutem alt.

Jak zacząć stosować tekst alternatywny

Zacznij od prostych zasad: opisuj obraz tak, jakiego opisu potrzebuje osoba niewidoma; unikaj podawania tekstu typu "obraz1.jpg"; nie upychaj słów kluczowych. Dla elementów interaktywnych alt powinien opisywać funkcję, nie wygląd. Gdy obraz wymaga rozbudowanego wyjaśnienia (wykresy, diagramy), dodaj pełny opis w pobliżu obrazu lub link do dłuższego opisu.

Przykładowe dobre praktyki: krótkie, jednozdaniowe opisy; uwzględnienie kontekstu (np. artykułu); spójność między wersjami mobilną i desktopową, ponieważ Google używa Googlebot Smartphone jako domyślnego crawlera.

Tekst alternatywny — kontrola: techniczna lista kontrolna

**Obecność alt** — gdzie sprawdzić: view-source / DevTools — przejdź do HTML — przechodzi gdy każdy <img> ma atrybut alt (choć może być pusty dla dekoracji).

**Widoczność dla czytników** — gdzie sprawdzić: NVDA lub VoiceOver lokalnie — przechodzi gdy czytnik odczytuje sensowny tekst zamiast nazwy pliku lub pustego ciągu dla istotnych obrazów.

**Spójność mobil/desktop** — gdzie sprawdzić: Chrome DevTools » Toggle device toolbar / fetch as Googlebot Smartphone — przechodzi gdy wersja mobilna zawiera te same, równoważne opisy dla kluczowych obrazów.

**Unikanie stuffingów** — gdzie sprawdzić: manualna inspekcja HTML / skan automatyczny — przechodzi gdy atrybut alt nie zawiera listy słów kluczowych ani powtarzających się fraz.

Jak weryfikować i rozwiązywać problemy — narzędzia

Google Search Console URL Inspection — użyj dla swoich stron: sprawdź, co Google widzi i czy mobilna wersja zawiera alt. Rich Results Test — przydatne, gdy obraz związany jest ze strukturą treści (np. produkty). Chrome DevTools (Elements) — sprawdź surowe HTML i renderowaną DOM; Network/Response pokazuje, czy obraz się ładuje. curl — jeśli chcesz pobrać kod źródłowy serwera: użyj curl -A "Mozilla/5.0 (X11; Linux x86_64)" https://example.com/page aby sprawdzić, co serwer zwraca dla typowego user-agenta; curl -I zwróci jedynie nagłówki.

Narzędzia dostępności: Lighthouse, axe-core oraz screen-readery (NVDA, VoiceOver) pomagają przetestować, czy alt spełnia potrzeby użytkowników. Przy sprawdzaniu zewnętrznych stron pamiętaj, że operator site: daje tylko publiczny sygnał o indeksacji i nie jest definitive—dla własnych stron użyj URL Inspection w GSC.

Typowe błędy tekstu alternatywnego

Brak alt dla obrazów niosących informację; używanie nazwy pliku zamiast opisu; upychanie słów kluczowych; zbyt długie, nieczytelne opisy w atrybucie alt; stosowanie alt tam, gdzie potrzebny jest rozbudowany opis (dla wykresu lepszy jest akapit opisowy).

Po wykryciu problemu: popraw HTML, wprowadź krótkie opisowe alt, dodaj dłuższe opisy w tekstach towarzyszących gdy potrzeba, i przetestuj z czytnikami.

Przeczytaj przewodnik po Technical SEO

Najczęściej zadawane pytania

Czy alt poprawi moje pozycje w wyszukiwarce?

Alt pomaga wyszukiwarkom zrozumieć obrazy i może zwiększyć szanse na pojawienie się w wynikach obrazów oraz poprawić semantykę strony, co pośrednio może wpłynąć na widoczność. Nie jest jednak samodzielnym czynnikiem gwarantującym wyższą pozycję — ranking zależy od wielu sygnałów.

Jak krótki powinien być opis w alt?

Zazwyczaj jedno zdanie lub krótkie wyrażenie wystarcza (kilkanaście słów). Cel to jasność i użyteczność dla osoby korzystającej z czytnika ekranu; jeśli treść jest złożona, dodaj dłuższy opis w tekście artykułu.

Czy obraz pobrany przez JavaScript powinien mieć alt w HTML?

Tak — jeśli obraz jest istotny, upewnij się, że atrybut alt jest obecny w renderowanym DOM. Przy dynamicznym ładowaniu sprawdź finalny DOM w DevTools lub renderowany HTML (curl nie pokaże zmian z JavaScript bez dodatkowego narzędzia).

Techniczny SEO to element wzrostu organicznego; równolegle buduje się autorytet tematyczny poprzez linki z zaufanych źródeł. Zbuduj autorytet dzięki jakościowym backlinkom