Atrybut alt (tekst alternatywny) to krótki opis obrazka zapisany w kodzie HTML. Użytkownik zwykle go nie widzi, ale korzystają z niego czytniki ekranu, którymi posługują się osoby niewidome, oraz wyszukiwarki, które dzięki niemu lepiej rozumieją, co przedstawia obraz. Wyświetla się też w miejscu obrazka, jeśli ten się nie załaduje.
Jak wygląda atrybut alt w kodzie
<img src="czerwony-rower-miejski.jpg" alt="Czerwony rower miejski z wiklinowym koszykiem przed kamienicą">W WordPressie nie trzeba edytować kodu: tekst alternatywny wpisuje się w bibliotece mediów lub w ustawieniach bloku obrazka, w polu „Tekst alternatywny”.
Znaczenie atrybutu alt dla SEO
- pomaga wyszukiwarce zrozumieć zawartość obrazka i jego związek z tekstem,
- zwiększa szansę na pojawienie się obrazka w Grafice Google,
- w przypadku obrazków będących linkami pełni rolę tekstu linku.
Atrybut alt to jeden z wielu sygnałów – Google bierze też pod uwagę nazwę pliku, podpis i tekst wokół obrazka. Nie jest „magicznym” czynnikiem rankingowym, ale jego brak to stracona okazja. Ogólnie o czynnikach rankingowych piszę w tekście o kluczowych czynnikach SEO wpływających na pozycjonowanie.
Atrybut alt a dostępność
Dla osób korzystających z czytników ekranu tekst alternatywny jest jedynym sposobem, by dowiedzieć się, co jest na obrazku. Wytyczne dostępności WCAG wymagają tekstu alternatywnego dla wszystkich obrazów przekazujących informację.
Jak pisać skuteczne opisy alt
- **opisz, co jest na obrazku**, w kontekście strony – tak, jakbyś opowiadał komuś przez telefon,
- **bądź konkretny i zwięzły** – zwykle wystarczy jedno zdanie, do ok. 125 znaków,
- **nie zaczynaj od „obrazek przedstawia”** – czytnik ekranu i tak informuje, że to obraz,
- **frazę kluczową wpleć tylko wtedy, gdy naturalnie opisuje obraz**,
- **tekst na grafice przepisz** w opisie alt, jeśli niesie informację,
- **obrazy dekoracyjne** (tła, ozdobniki) oznacz pustym atrybutem alt=”” – czytnik je pominie.
Przykłady dobrze użytych atrybutów alt
- źle: „rower” → dobrze: „Czerwony rower miejski z wiklinowym koszykiem”,
- źle: „buty sportowe tanie buty do biegania najlepsze buty” → dobrze: „Damskie buty do biegania w terenie, model z bieżnikiem”,
- źle: „wykres” → dobrze: „Wykres: ruch organiczny wzrósł z 2 do 5 tysięcy wizyt miesięcznie po aktualizacji treści”,
- logo będące linkiem do strony głównej: „Andrzej Rus – strona główna”.
Najczęstsze błędy
- brak opisu przy obrazkach z treścią (zrzuty ekranu, wykresy, zdjęcia produktów),
- upychanie słów kluczowych,
- ten sam opis dla wszystkich zdjęć w galerii,
- nazwa pliku jako opis („IMG_4583”),
- opis niezgodny z tym, co rzeczywiście jest na obrazku – np. skopiowany z innego wpisu.
Atrybut alt a title
Atrybut title wyświetla dymek po najechaniu myszą i nie ma znaczenia dla pozycji w Google. Nie zastępuje tekstu alternatywnego – czytniki ekranu i wyszukiwarki opierają się na atrybucie alt.
Optymalizacja obrazów w szerszym kontekście
Tekst alternatywny to tylko jeden element. Równie ważne są: opisowa nazwa pliku, odpowiedni format i rozmiar, kompresja oraz umieszczenie obrazka przy powiązanym tekście. Szczegóły w poradniku o tym, na czym polega optymalizacja obrazów dla SEO.
Jak sprawdzić atrybuty alt na stronie
- ręcznie: prawy przycisk myszy na obrazku → „Zbadaj”,
- Lighthouse w Chrome – w raporcie dostępności wskazuje obrazy bez tekstu alternatywnego,
- crawler, np. Screaming Frog – lista wszystkich obrazów bez opisu na całej stronie.
Więcej zasad dotyczących treści znajdziesz w tekstach o optymalizacji treści na stronie internetowej i o tym, jak pisać teksty SEO, a podstawy – w poradniku o najlepszych praktykach SEO dla twórców stron.
