Czym jest tekst alternatywny i dlaczego ma znaczenie?
Tekst alternatywny, czyli alt text, to krótki opis obrazu zapisany w kodzie Twojego sklepu internetowego. Odwiedzający zwykle go nie widzą, ale czytnik ekranu odczytuje go osobie słabowidzącej lub niewidomej. Jeśli obraz się nie załaduje, tekst alternatywny pojawia się w jego miejscu.
Wyszukiwarki używają też tekstu alternatywnego, aby zrozumieć, co znajduje się na zdjęciu. Google wskazuje tekst alternatywny, obok tekstu wokół obrazu i nazwy pliku, jako ważne źródło dla Grafiki Google. W modzie, gdzie wiele osób szuka po obrazach, jest to kanał widoczności, który często pozostaje niewykorzystany.
W praktyce w wielu sklepach internetowych nie ma tam nic, jest nazwa pliku albo numer artykułu, np. 4073AS252-BLK-M. To nic nie mówi klientowi korzystającemu z czytnika ekranu i niewiele mówi Google. Opisowe zdanie dla każdego zdjęcia rozwiązuje oba problemy.
Tak wygląda dobry tekst alt dla zdjęcia produktowego
Opisz, co zobaczyłaby osoba, która nie może zobaczyć zdjęcia, oraz co musi wiedzieć, aby dokonać wyboru. Przy zdjęciu produktu są to marka, typ produktu, kolor i ewentualnie materiał albo wyróżniający się detal. Przy kilku zdjęciach tego samego produktu różnicujesz je ujęciem: przód, tył, detal albo na modelu.
Pisz krótko. Czytniki ekranu odczytują cały tekst, a powszechna zalecana długość to maksymalnie około 125 znaków. Nie zaczynaj od „obraz przedstawiający” ani „zdjęcie przedstawiające”, bo czytnik ekranu i tak informuje, że to obraz. Unikaj list słów kluczowych: Google traktuje je jak spam, a użytkownik czytnika ekranu szybko się zniechęci.
Obrazy czysto dekoracyjne, takie jak linia ozdobna czy wzór tła, otrzymują pusty tekst alt, aby czytnik ekranu je pominął. Zdjęcia produktowe nigdy nie są dekoracyjne: zawsze powinny mieć opis.
- Marka i nazwa produktu w formie widocznej dla klienta w sklepie internetowym
- Typ produktu i grupa docelowa, np. kurtka damska albo chinosy męskie
- Kolor opisany zwykłymi słowami, nie kodem koloru dostawcy
- Ujęcie: przód, tył, bok, detal lub na modelu
- Ewentualnie jeden wyróżniający się detal, na przykład guziki z motywem kotwicy albo pasek
Przykłady dla mody: dobrze i źle
Różnica często tkwi w kilku słowach. Poniżej znajdziesz częste błędy obok lepszych wersji dla tego samego typu zdjęć produktowych co na tej stronie. Zwróć uwagę, że dobre wersje nie powtarzają słów kluczowych, a mimo to zawierają wszystko, czego ktoś szuka.
| Zdjęcie | Błąd | Lepiej |
|---|---|---|
| Packshot płaszcza | IMG_4021.jpg | Ciemnogranatowy dwurzędowy wełniany peacoat ze złotymi guzikami, przód |
| Zdjęcie z modelem | Ładna kobieta w płaszczu | Długi kremowy wełniany płaszcz z paskiem na modelu, noszony z brązowymi spodniami |
| Tył | Płaszcz kremowy płaszcz wełniany płaszcz damski płaszcz zimowy wyprzedaż | Długi kremowy wełniany płaszcz z paskiem, tył na modelu |
| Detal | Zdjęcie detalu | Zbliżenie na złote guziki z kotwicą na ciemnogranatowym płaszczu typu peacoat |
| Zdjęcie od dostawcy | 4073AS252-NVY-M | Nazwa marki damski peacoat w kolorze navy, przód |
| Zdjęcie aranżacyjne | Puste | Kobieta w płaszczu w kolorze camel jedzie rowerem wzdłuż kanału |
SEO: tekst alt, nazwa pliku i dane strukturalne
Tekst alternatywny działa najlepiej razem z jasną nazwą pliku. Google zaleca używanie opisowych nazw plików zamiast nazw z aparatu, takich jak IMG_4021.jpg. Nazwa taka jak peacoat-dames-navy-voorkant.jpg albo Twój stały schemat z numerem artykułu, kolorem i numerem kolejnym pomaga wyszukiwarkom i Twojemu zespołowi. Używaj dywizów i małych liter, bez spacji.
Do tego dochodzą structured data, nazywane też znacznikami schema.org. Za pomocą typu Product przekazujesz wyszukiwarkom w ustandaryzowanej formie nazwę produktu, cenę, dostępność i zdjęcia produktu. Większość platform sklepów internetowych i motywów tworzy te znaczniki automatycznie na podstawie zdjęć i danych produktu. Sprawdź w teście wyników z elementami rozszerzonymi Google, czy Twoje zdjęcia są w nich uwzględnione.
Na koniec liczy się kontekst. Tekst alt zgodny z tytułem produktu, opisem i nagłówkami na stronie wzmacnia całość. Tekst alt, który mówi coś innego niż tytuł, na przykład podaje inną nazwę koloru, powoduje natomiast zamieszanie u klienta i w wyszukiwarce.
Dostępność i European Accessibility Act
Od 28 czerwca 2025 w UE obowiązuje European Accessibility Act. W Holandii ACM od tego czasu nadzoruje dostępność cyfrową sklepów internetowych: stron i aplikacji, w których kupujesz produkty lub usługi. Według ACM przepisy dotyczą firm zatrudniających 10 lub więcej pracowników i/lub mających roczny obrót powyżej 2 milionów euro.
W praktyce jako techniczny punkt odniesienia stosuje się europejską normę EN 301 549, która jest zgodna z międzynarodowymi wytycznymi WCAG 2.1 na poziomie AA. Jednym z podstawowych wymagań jest to, aby każda informacyjna grafika miała tekst alternatywny. Zdjęcia produktowe bez alt-tekstu nie są więc drobiazgiem, lecz jedną z najczęściej wykrywanych barier.
Alt-teksty to tylko jeden z elementów. Ważne są też proces zakupu obsługiwany z klawiatury, odpowiedni kontrast kolorów i czytelne formularze. Jeśli nie masz pewności, czy przepisy dotyczą Twojego sklepu internetowego albo co dokładnie musisz zrobić, sprawdź stronę ACM lub zapytaj specjalistę ds. dostępności; ten artykuł nie jest poradą prawną.
Nawet jeśli prawo Cię nie obejmuje: sklep internetowy obsługiwany czytnikiem ekranu sprzedaje większej liczbie klientów.
Kiedy automatyczne teksty alternatywne nie wystarczają
Alt-teksty tworzone na podstawie danych artykułu są wiarygodne i spójne, ale opisują to, co znajduje się w danych, a nie atmosferę zdjęcia kampanijnego. Dla kilku hero image’y na stronie głównej lub w lookbooku często lepszy będzie opis napisany ręcznie. Tam chcesz opowiedzieć, co się dzieje, a nie tylko wskazać, jaki to produkt.
Obowiązuje też zasada: śmieci na wejściu, śmieci na wyjściu. Jeśli kolor w Twoim systemie kasowym jest zapisany jako BLK albo 999, albo nazwa produktu to kod wewnętrzny, tekst alternatywny nie będzie od tego lepszy. Jeśli masz tylko dwadzieścia produktów, szybciej napiszesz teksty alternatywne samodzielnie w panelu sklepu internetowego, niż wdrożysz do tego system.
Jak Photopilot pisze teksty alternatywne
Podczas publikowania do Shopify, WooCommerce i BigCommerce Photopilot dodaje do każdego obrazu opisowy tekst alt na podstawie nazwy produktu, marki i koloru. Jeśli marka lub kolor są już w nazwie produktu, nie są powtarzane. Dopiero gdy nazwa produktu nie jest znana, Photopilot używa numeru artykułu, aby obraz nigdy nie pozostał bez tekstu.
W pliku Webshop-Excel i przy eksporcie do plików każde zdjęcie otrzymuje własny tekst alternatywny, który dodaje ujęcie, np. przód, tył lub na modelu, wraz z grupą docelową i typem produktu, w formie: marka i nazwa, damska kurtka w kolorze navy, przód na modelu. Tekst ma mniej niż 125 znaków, a wielkie litery z list dostawców są porządkowane.
Te teksty pochodzą bezpośrednio z Twoich danych artykułów, a nie z modelu językowego, więc te same dane zawsze dają ten sam tekst i nic nie jest zmyślane. Przy eksporcie przez FTP lub SFTP pliki otrzymują nazwy, których oczekuje Twój sklep internetowy, na przykład z numerem artykułu, kolorem i numerem kolejnym. To część publikowania, które jest dostępne w planie miesięcznym od 500 € miesięcznie.
