Tekst alternatywny (alt) obrazów — po co Google i jak go uzupełnić hurtowo
Atrybut alt to krótki tekst w kodzie obrazka, który mówi, co na nim jest. Google czyta go razem z treścią strony i własną analizą obrazu, żeby zrozumieć zdjęcie i pokazać je w Google Grafice. Bez altu zdjęcia produktów i realizacji są dla wyszukiwarki mniej czytelne — to nie blokuje strony, ale marnuje ruch, który mógłby przyjść z wyszukiwania obrazów.
Co dokładnie wykrył audyt
Audyt przegląda obrazy (<img>) na sprawdzanej stronie i podaje, ile z nich nie ma opisu, np. „5 z 12 obrazów nie ma opisu alt — Google wie o nich mniej”. To problem z kategorii do poprawy — nie bloker, ale warto go usunąć, zwłaszcza w sklepie.
- Pusty alt liczymy tak samo jak brak altu. Zapis
alt=""nie daje Google żadnej informacji o zdjęciu, więc z punktu widzenia SEO niczym się nie różni od obrazka bez atrybutu. - Pomijamy szum: piksele śledzące (Facebook, Google Analytics, DoubleClick) i maleńkie ikony z podanym rozmiarem do 24×24 px. Ich nie musisz opisywać.
- Obrazy ładowane leniwie (lazy load,
data-src,srcset) też są liczone — liczy się to, czy znacznik obrazka ma opis. - Alt, który wygląda na nazwę pliku, to osobny komunikat (kosmetyka). Jeśli wszystkie obrazy mają alt, ale co najmniej dwa z nich to nazwy plików, a nie opisy — np. „IMG_1234.jpg”, „DSC0042” albo alt powtarzający nazwę pliku z myślnikami (
stol-debowy-rozkladanyprzy plikustol-debowy-rozkladany.jpg) — audyt pokaże „Obrazy mają alt, ale X z Y to nazwy plików”. Tak często wpisują je automatycznie platformy i wtyczki. Gdy na stronie brakuje altów, audyt najpierw zgłasza braki. - Audyt sprawdza jedną stronę, którą mu podałeś. Jeśli brakuje altów na stronie głównej, najpewniej brakuje ich też na kartach produktów i we wpisach.
Jeśli treść strony pojawia się dopiero po wykonaniu JavaScriptu, audyt nie oceni obrazów i pokaże informację „nie do oceny” — o tym w artykule Treść i JavaScript.
Co mówi Google
W dokumentacji o optymalizacji obrazów Google nazywa alt najważniejszym atrybutem, jeśli chodzi o dodatkowe informacje o obrazie. Wyjaśnia, że łączy tekst alternatywny z algorytmami rozpoznawania obrazu i treścią strony, żeby zrozumieć, co przedstawia zdjęcie. Alt obrazka, który jest linkiem, działa też jak tekst linku (anchor).
Google pokazuje też wprost przykłady. W wolnym tłumaczeniu:
- Źle: brak altu —
<img src="puppy.jpg"> - Źle: upychanie fraz —
alt="szczeniak pies szczeniaki psy labrador retriever szczeniaczki…" - Lepiej:
alt="szczeniak" - Najlepiej:
alt="szczeniak dalmatyńczyka aportujący piłkę"
Upychanie słów kluczowych w altach Google uznaje za złe doświadczenie użytkownika i ostrzega, że strona może zostać potraktowana jako spam.
Jak pisać dobry alt
- Opisz, co widać na zdjęciu, jakbyś mówił komuś przez telefon: „Drewniany stół rozkładany z dębu w jasnej jadalni”, a nie „stół”.
- W sklepie podaj nazwę produktu i cechę widoczną na zdjęciu: kolor, wariant, ujęcie. Przy kilku zdjęciach tego samego produktu każde opisz trochę inaczej: „Sneakersy Model X białe — widok z boku”, „Sneakersy Model X białe — podeszwa”.
- Bez upychania fraz i bez powtarzania tej samej frazy w każdym zdjęciu na stronie.
- Bez „zdjęcie przedstawia…”, „obrazek z…” — to oczywiste, marnuje miejsce.
- Nazwa pliku to nie opis. „IMG_4521.jpg” czy „DSC00023” w alcie nic Google nie mówi — audyt wyłapuje takie alty i zgłasza je jako kosmetykę, gdy są co najmniej dwa (i żadnemu obrazkowi nie brakuje altu). Przy okazji warto nadawać plikom opisowe nazwy przed wgraniem (np.
stol-debowy-rozkladany.jpg) — Google traktuje nazwę pliku jako lekką wskazówkę. - Długość: zwykle jedno zdanie, kilka–kilkanaście słów. Nie ma oficjalnego limitu Google; Shopify zaleca do ok. 125 znaków.
- Logo i grafiki z tekstem: wpisz nazwę firmy albo tekst, który jest na grafice (np. baner z promocją).
Jak sprawdzić samemu
- Pojedynczy obraz: kliknij zdjęcie prawym przyciskiem → Zbadaj (Inspect). W podświetlonym znaczniku
<img>szukajalt="…". Brak atrybutu alboalt=""oznacza brak opisu. - Cała strona: naciśnij Ctrl+U (na Macu Cmd+Option+U), potem Ctrl+F i wpisz
alt=""— znajdziesz puste alty. Obrazków zupełnie bez atrybutu tak nie znajdziesz, ale wtedy wystarczy porównać liczbę wyników dla<imgialt=. - Szybko w konsoli: F12 → zakładka Console → wklej i naciśnij Enter:
[...document.images].filter(i => !i.alt.trim()).map(i => i.currentSrc || i.src)Dostaniesz listę adresów obrazów bez opisu.
Jak naprawić
WordPress — biblioteka mediów a blok obrazka
To najczęstsze źródło nieporozumień, więc najpierw zasada: w WordPressie alt jest zapisany w dwóch miejscach.
- Biblioteka mediów (Media → Biblioteka → kliknij obraz → pole Tekst alternatywny) — to alt „domyślny” obrazu. Zapisuje się automatycznie.
- Blok Obraz we wpisie lub na stronie — w chwili wstawienia obrazka WordPress kopiuje alt z biblioteki do treści wpisu. Od tego momentu blok ma własną kopię. W dokumentacji WordPressa jest to opisane wprost: alt wpisany w ustawieniach bloku dotyczy tylko tego jednego użycia, a alt w bibliotece mediów jest domyślnym tekstem przy wstawianiu obrazu w nowych miejscach.
Praktyczny skutek: jeśli uzupełnisz alt w bibliotece, obrazy już wstawione do wpisów się nie zmienią. Trzeba wejść do wpisu, zaznaczyć obraz i w panelu bocznym (zakładka ustawień bloku) wpisać Tekst alternatywny, potem zaktualizować wpis. Inaczej działają obrazy wyświetlane przez motyw — obrazek wyróżniający, galerie budowane przez szablon, zdjęcia produktów WooCommerce. One zwykle pobierają aktualny alt z biblioteki, więc tam wystarczy poprawka w jednym miejscu.
Kolejność pracy: najpierw biblioteka (naprawia obrazy z motywu i wszystkie przyszłe wstawienia), potem najważniejsze wpisy i strony (naprawia obrazy w treści). W edytorze bloków jest też pole „oznacz jako dekoracyjny” — z perspektywy SEO nie używaj go dla zdjęć, które mają coś pokazać, bo usuwa opis.
WooCommerce
Zdjęcia produktów (główne i galeria) to zwykłe obrazy z biblioteki mediów. Alt uzupełniasz w Media → Biblioteka albo w edycji produktu: kliknij zdjęcie produktu lub zdjęcie w galerii i w oknie biblioteki uzupełnij Tekst alternatywny. Motywy WooCommerce pobierają go przy wyświetlaniu, więc zmiana działa od razu na karcie produktu i na listach.
Uwaga przy hurtowej pracy: wbudowany importer CSV WooCommerce nie dodaje ani nie zmienia altów zdjęć produktów — tak mówi wprost dokumentacja WooCommerce. Do tego potrzebna jest osobna wtyczka (niżej).
Shopify
- W panelu wejdź w Produkty i otwórz produkt.
- Kliknij zdjęcie, żeby otworzyć podgląd multimediów.
- Kliknij Dodaj tekst alternatywny, wpisz opis i zapisz.
W edytorze multimediów Shopify potrafi też podpowiedzieć alt dla zdjęć, które go nie mają — podpowiedź przeczytaj przed zatwierdzeniem. Alt obrazów w sekcjach motywu (banery, slajdery) ustawiasz w Sklep online → Motywy → Dostosuj, przy danym bloku z obrazem — o ile motyw ma takie pole.
PrestaShop
W PrestaShopie alt zdjęcia produktu bierze się z pola Legenda (ang. Caption) przypisanego do zdjęcia.
- Katalog → Produkty → otwórz produkt.
- W sekcji zdjęć kliknij miniaturę zdjęcia — pojawią się jego ustawienia.
- Uzupełnij Legendę dla każdego języka sklepu i zapisz ustawienia zdjęcia.
- Wyczyść cache sklepu (Zaawansowane → Wydajność → Wyczyść pamięć podręczną), jeśli zmiana nie pojawia się od razu.
W sklepie wielojęzycznym legenda jest osobna dla każdego języka — pusty język to brak altu w tej wersji sklepu. To, jak legenda trafia do altu, zależy od motywu: w części motywów przy pustej legendzie alt dostaje nazwę produktu, w innych zostaje pusty.
Shoper
- Produkty → Wszystkie (w starszym panelu: Obsługa sklepu → Produkty) → otwórz produkt.
- Przejdź do zakładki Galeria.
- Kliknij ikonę ołówka przy zdjęciu, wpisz opis w polu ALT i kliknij Zapisz.
Ważne: Shoper domyślnie zostawia jako opis zdjęcia nazwę wgranego pliku. Audyt wyłapie takie alty, jeśli wyglądają na nazwę pliku (np. „IMG_1234”, „DSC0042”, nazwa z rozszerzeniem) i jest ich co najmniej dwa, ale nie rozpozna każdej nazwy pliku — warto przejrzeć alty ręcznie. W nowej galerii zdjęć alty da się edytować szybko, bezpośrednio z listy zdjęć produktu.
Hurtowe uzupełnianie altów
Przy kilkuset produktach klikanie po jednym zdjęciu nie ma sensu. Najrozsądniejszy schemat wszędzie jest ten sam: eksport → uzupełnienie w arkuszu → import. W arkuszu łatwo zbudować alt z nazwy produktu i wariantu, a potem poprawić ręcznie najważniejsze pozycje.
- Shopify: eksport produktów do CSV (Produkty → Eksportuj), uzupełnienie kolumny
Image alt text(każde zdjęcie to osobny wiersz), import z opcją nadpisania istniejących produktów. Najpierw przetestuj na kilku produktach i zrób kopię eksportu. - PrestaShop: import produktów (Zaawansowane → Import) ma pole Image alt texts (x,y,z…) — opisy kolejnych zdjęć oddzielone przecinkami, w tej samej kolejności co adresy zdjęć. Import zdjęć przy aktualizacji może je zdublować, więc testuj na kopii sklepu.
- Shoper: w katalogu aplikacji Shopera są płatne aplikacje do masowej edycji altów, np. eksport/import ALT-ów przez CSV albo automatyczne tworzenie altów z nazwy produktu.
- WordPress / WooCommerce: import CSV WooCommerce altów nie obsługuje, więc potrzebna jest wtyczka: edycja biblioteki mediów w formie arkusza, import altów z CSV po ID załącznika albo importer typu WP All Import. Jeśli masz dostęp do WP-CLI, alt obrazu w bibliotece to pole
_wp_attachment_image_alt:wp post meta update 123 _wp_attachment_image_alt "Stół dębowy rozkładany, 160 cm"Pamiętaj, że to zmienia bibliotekę, a nie obrazy już wstawione do treści wpisów.
- Rank Math: po włączeniu modułu Image SEO (Rank Math SEO → Kokpit → Moduły) w Rank Math SEO → Ustawienia ogólne → Obrazy można włączyć automatyczne dodawanie brakujących altów. Działa tylko dla obrazów w treści wpisów i stron, nie zapisuje niczego w bibliotece, a domyślnie wstawia nazwę pliku. Traktuj to jako łatkę — ustaw format na coś sensowniejszego niż
%filename%albo opisz obrazy porządnie.
Wtyczki i aplikacje generujące alty przez AI oszczędzają czas, ale przejrzyj wynik przynajmniej dla zdjęć produktów — AI potrafi pomylić model, kolor albo dopisać coś, czego na zdjęciu nie ma. Alt z samej nazwy produktu jest lepszy niż nic, ale przy kilku zdjęciach jednego produktu warto je zróżnicować.
Jak sprawdzić, że naprawione
- Odśwież stronę z wyczyszczonym cache (wtyczka cache, LiteSpeed, Cloudflare) i powtórz test z konsoli — lista ma być pusta.
- Uruchom audyt jeszcze raz — powinien pokazać, że wszystkie obrazy mają opis, i nie zgłaszać altów wyglądających na nazwy plików.
- W Google Search Console wpisz adres w Sprawdzenie adresu URL → Testuj URL na żywo → „Wyświetl przetestowaną stronę” → HTML. Zobaczysz alty dokładnie tak, jak widzi je Google.
Google zobaczy zmianę, kiedy ponownie odwiedzi stronę i obraz — przy często odwiedzanych stronach to dni, przy rzadziej odwiedzanych tygodnie. Dla ważnych podstron możesz kliknąć Poproś o zindeksowanie. Sam alt nie gwarantuje pozycji w Google Grafice — to jeden z sygnałów, obok jakości zdjęcia, treści wokół niego i szybkości strony.
Kiedy warto poprosić o pomoc
Jeśli sklep ma tysiące zdjęć, kilka wersji językowych albo import produktów z hurtowni, który nadpisuje alty przy każdej synchronizacji, ręczne poprawki nie wystarczą — trzeba ustawić proces po stronie importu albo motywu. W IF.PL zajmujemy się SEO i stronami WWW, więc możemy przygotować taki import albo regułę w motywie i przy okazji sprawdzić pozostałe elementy, np. nagłówki czy dane strukturalne produktów.
Źródła
- Google Search Central — Sprawdzone metody SEO dotyczące obrazów
- WordPress — Image block (tekst alternatywny w bloku a w bibliotece mediów)
- WordPress — Media Library screen
- WooCommerce — Product CSV Importer and Exporter
- Shopify — Dodawanie tekstu alternatywnego do multimediów produktu
- Shopify — Plik CSV produktów (kolumna Image alt text)
- PrestaShop — Import (pole Image alt texts)
- Shoper Learn — Jak dodać zdjęcie do produktu
- Shoper Learn — Nowa galeria zdjęć produktowych
- Rank Math — Image SEO Options