Tekst alternatywny ma przekazać znaczenie obrazu osobie, która go nie widzi. Nie powinien być mechanicznym opisem wszystkiego, co znajduje się na grafice, ani miejscem na kopiowanie podpisu, tytułu artykułu i nazwy pliku. Dobrze przygotowany opis pozwala zrozumieć funkcję obrazu. Źle przygotowany może wprowadzać w błąd, powtarzać informacje albo niepotrzebnie wydłużać korzystanie ze strony.
Problem polega na tym, że nie istnieje jeden uniwersalny tekst alternatywny dla każdego obrazu. Ten sam plik może wymagać innego opisu w galerii fotograficznej, innego w artykule informacyjnym, a jeszcze innego na stronie usługi. Znaczenie obrazu wynika z kontekstu i z tego, po co został umieszczony na stronie.
Dlatego przed napisaniem opisu trzeba najpierw ustalić, jaką informację użytkownik straci, jeżeli obrazu nie zobaczy.
Tekst alternatywny nie opisuje pliku, lecz jego funkcję
Najczęstszym błędem jest traktowanie tekstu alternatywnego jak podpisu technicznego. W polu pojawiają się wtedy określenia takie jak „zdjęcie”, „grafika”, „obrazek”, „baner” albo nazwa pliku.
Taka informacja zwykle nie pomaga. Czytnik ekranu sam informuje użytkownika, że napotkał obraz. Powtarzanie słowa „zdjęcie” nie przekazuje jego znaczenia.
Opis powinien odpowiadać na pytanie: co ten obraz wnosi do treści?
Jeżeli fotografia przedstawia burmistrza podpisującego umowę dotyczącą konkretnej inwestycji, istotne może być wskazanie osób i czynności. Jeśli to samo zdjęcie znajduje się w dekoracyjnym banerze na stronie głównej, może nie wymagać żadnego opisu.
Nie należy więc opisywać obrazu w oderwaniu od miejsca publikacji. Najpierw trzeba zrozumieć jego rolę.
Obraz dekoracyjny powinien zostać pominięty
Nie każdy obraz przekazuje informację. Część grafik służy wyłącznie do uatrakcyjnienia strony, oddzielenia sekcji albo budowania identyfikacji wizualnej.
Jeżeli usunięcie obrazu nie zmieni znaczenia treści, można uznać go za dekoracyjny. W kodzie strony powinien wtedy mieć pusty tekst alternatywny, tak aby czytnik ekranu go pominął.
Dotyczy to między innymi:
- abstrakcyjnych kształtów w tle,
- ozdobnych linii i separatorów,
- zdjęć stockowych bez znaczenia dla treści,
- ikon powtarzających tekst widoczny obok,
- tła graficznego sekcji.
Oznaczenie obrazu dekoracyjnego nie jest brakiem dostępności. Przeciwnie, chroni użytkownika przed słuchaniem niepotrzebnych opisów.
Błędem jest jednak pozostawienie pustego opisu dla obrazu, który pełni funkcję informacyjną albo jest jedynym sposobem przekazania ważnej treści.
Zdjęcie w artykule nie zawsze wymaga szczegółowego opisu
Fotografia ilustrująca wydarzenie może mieć różne znaczenie. Czasami dokumentuje konkretną sytuację, osobę lub rezultat. Innym razem jedynie uzupełnia wizualnie artykuł.
Jeżeli podpis pod zdjęciem przekazuje już wszystkie istotne informacje, tekst alternatywny nie powinien mechanicznie go powtarzać. Można przygotować krótszy opis albo, zależnie od konstrukcji strony, pozostawić pusty tekst alternatywny i oprzeć informację na podpisie.
Jeżeli fotografia pokazuje element ważny dla artykułu, opis powinien go uwzględnić. Przykładowo:
„Nowa pochylnia prowadząca do wejścia głównego biblioteki”.
Taki opis przekazuje istotną informację o zmianie dostępności obiektu. Nie trzeba opisywać koloru elewacji, pogody, wszystkich osób w tle ani roślinności, jeśli nie mają znaczenia.
W artykule reportażowym kontekst może być szerszy. Fotografia może budować narrację, pokazywać emocje, relacje lub atmosferę wydarzenia. Wtedy opis może zawierać więcej szczegółów, ale nadal powinien być zwięzły i podporządkowany sensowi materiału.
Zdjęcie osoby powinno identyfikować ją wtedy, gdy ma to znaczenie
Na stronie zespołu lub w artykule dotyczącym konkretnej osoby fotografia zwykle pełni funkcję informacyjną. Opis powinien pozwalać ustalić, kogo przedstawia.
Może brzmieć:
„Natalia Madej, ekspertka ds. dostępności cyfrowej”.
Nie ma potrzeby szczegółowego opisywania wyglądu, stroju, koloru włosów i tła, jeżeli nie jest to istotne dla treści.
Inaczej może wyglądać opis w materiale fotograficznym, w którym wygląd, gest lub otoczenie mają znaczenie narracyjne. Wtedy można wskazać, że osoba przemawia, podpisuje dokument, uczestniczy w warsztatach albo wykonuje określoną czynność.
Nie należy natomiast zgadywać tożsamości osób ani przypisywać im emocji, których nie da się jednoznacznie rozpoznać. Sformułowanie „zadowoleni uczestnicy” może być interpretacją autora, a nie informacją wynikającą z obrazu.
Bezpieczniej opisywać to, co jest widoczne: „uczestnicy stoją na scenie i trzymają dyplomy”.
Plakat wymaga tekstu poza obrazem
Plakat zawierający datę, program, miejsce i zasady udziału nie powinien być obsługiwany przez bardzo długi tekst alternatywny.
Najlepszym rozwiązaniem jest umieszczenie wszystkich informacji jako zwykłego tekstu na stronie. Wtedy opis alternatywny może być krótki, na przykład:
„Plakat promujący festyn rodzinny. Szczegóły wydarzenia znajdują się poniżej”.
Przepisywanie całej treści plakatu do pola alternatywnego jest niewygodne. Użytkownik nie może łatwo zatrzymać się na wybranym fragmencie, skopiować numeru telefonu ani przejść po nagłówkach. Długi opis jest również trudny do aktualizacji.
Jeżeli plakat jest jedynym źródłem informacji, problem nie polega na braku odpowiednio długiego altu. Problemem jest sposób publikacji całego materiału.
Tekst alternatywny nie powinien zastępować dostępnej treści strony.
Wykres wymaga opisania wniosku i danych
Opis wykresu powinien przekazywać to, co użytkownik ma z niego zrozumieć. Samo stwierdzenie „wykres słupkowy” nie wystarcza.
Jeżeli wykres pokazuje wzrost liczby zgłoszeń z 200 do 350, ta informacja powinna znaleźć się w opisie lub w tekście obok. Można napisać:
„Liczba zgłoszeń wzrosła z 200 w 2024 roku do 350 w 2025 roku”.
Przy bardziej złożonych danych warto dodać tekstowe podsumowanie oraz tabelę z wartościami. Tekst alternatywny powinien pozostać zwięzły, a pełne dane mogą zostać udostępnione w treści.
Nie trzeba opisywać każdego koloru, osi i elementu legendy, jeżeli użytkownik może otrzymać te same informacje w prostszej formie tekstowej.
Ważne jest również to, aby kolor nie był jedynym sposobem rozróżniania danych. Seria oznaczona na wykresie kolorem zielonym powinna mieć także nazwę, wzór albo inne oznaczenie.
Mapa wymaga opisu celu, nie wszystkich szczegółów
Opis mapy powinien zależeć od tego, do czego służy.
Jeżeli mapa pokazuje lokalizację budynku, wystarczy podać adres i najważniejsze informacje o dojściu. Jeżeli przedstawia trasę biegu, trzeba opisać przebieg, start, metę, najważniejsze ulice i punkty orientacyjne. Jeżeli pokazuje obszar objęty inwestycją, należy wskazać jego granice.
Nie da się stworzyć użytecznego opisu mapy przez wymienienie wszystkich ulic, kolorów i symboli. Warto zapewnić równoważną formę tekstową obok grafiki.
Przykładowo:
„Trasa rozpoczyna się na Rynku, prowadzi ulicami Kościuszki, Mickiewicza i 3 Maja, a następnie wraca na Rynek”.
Jeżeli użytkownik potrzebuje szczegółowej nawigacji, można udostępnić opis krok po kroku, plik trasy lub dane możliwe do otwarcia w aplikacji mapowej.
Tekst alternatywny powinien wyjaśnić funkcję mapy i skierować do pełnego opisu.
Ikona z tekstem nie powinna być odczytywana podwójnie
Jeżeli ikona znajduje się obok widocznego tekstu i nie wnosi dodatkowej informacji, powinna być dekoracyjna.
Przykładem jest symbol telefonu obok napisu „Zadzwoń do nas”. Czytnik ekranu nie musi odczytywać kolejno „ikona telefonu, Zadzwoń do nas”. Wystarczy dostępna nazwa przycisku lub linku.
Podobnie symbol pobierania przy odnośniku „Pobierz regulamin w PDF” nie wymaga osobnego opisu.
Inaczej wygląda sytuacja, gdy przycisk składa się wyłącznie z ikony. Wtedy musi mieć dostępną nazwę, na przykład „Otwórz menu”, „Zamknij okno”, „Pobierz plik” albo „Przejdź do następnego slajdu”.
Nie należy liczyć na to, że użytkownik rozpozna funkcję na podstawie samego kształtu. Ikona kosza może oznaczać usunięcie wiadomości, pliku, konta albo pozycji na liście. Nazwa musi wynikać z konkretnego działania.
Logo wymaga nazwy organizacji
Logo zwykle pełni funkcję informacyjną i identyfikacyjną. Tekst alternatywny powinien zawierać nazwę podmiotu, na przykład:
„Laboratorium Dostępności”.
Nie ma potrzeby dodawania słowa „logo”, ponieważ użytkownikowi najczęściej potrzebna jest nazwa organizacji, a nie typ obrazu.
Jeżeli logo jest jednocześnie linkiem do strony głównej, dostępna nazwa całego linku powinna informować o celu, na przykład „Laboratorium Dostępności, strona główna”.
Nie należy opisywać kształtu znaku, kolorów i elementów graficznych, chyba że treść dotyczy samego projektu logo.
W stopce zawierającej wiele logotypów partnerów każdy obraz powinien identyfikować właściwą instytucję. Nazwy plików i ogólne opisy „partner” nie wystarczą.
Obraz będący linkiem musi opisywać cel przejścia
Jeżeli kliknięcie obrazu prowadzi do innej strony, tekst alternatywny powinien informować, dokąd prowadzi link lub co uruchamia.
Miniatura artykułu może mieć opis odpowiadający jego tytułowi. Baner prowadzący do zapisów powinien mieć nazwę „Zapisz się na szkolenie z dostępności cyfrowej”, a nie „grafika szkolenia”.
Użytkownik musi rozumieć działanie elementu bez widzenia obrazu.
Nie należy łączyć w jednym opisie wszystkich elementów wizualnych banera. W przypadku linku najważniejszy jest cel działania.
Jeżeli obok obrazu znajduje się ten sam link tekstowy, można rozważyć ukrycie obrazu przed czytnikiem ekranu albo połączenie obu elementów w jeden odnośnik. Pozwala to uniknąć dwukrotnego odczytywania identycznej funkcji.
Zrzut ekranu wymaga opisania tego, co ma pokazać
Zrzuty ekranu są często używane w instrukcjach. Mogą przedstawiać cały interfejs, choć autor chce zwrócić uwagę tylko na jeden przycisk albo komunikat.
Opis powinien wskazać istotny element:
„Okno logowania z zaznaczonym linkiem „Nie pamiętam hasła” pod polem hasła”.
Nie ma potrzeby opisywania całego pulpitu, wszystkich ikon i zawartości paska przeglądarki, jeśli nie mają znaczenia dla instrukcji.
Warto również zapisać najważniejsze instrukcje jako tekst poza obrazem. Użytkownik nie powinien być uzależniony od samodzielnego odnalezienia małego elementu na zrzucie.
Jeżeli grafika zawiera kolejność kroków, pola i komunikaty, pełny opis powinien znaleźć się w treści artykułu.
Infografika wymaga równoważnej wersji tekstowej
Infografiki często łączą liczby, ikony, wykresy, krótkie hasła i zależności między elementami. Próba zamknięcia całej treści w jednym tekście alternatywnym prowadzi do powstania długiego i mało użytecznego komunikatu.
Najlepiej opublikować pod grafiką pełną wersję tekstową, zachowując logiczną strukturę informacji. Tekst alternatywny może wtedy informować o rodzaju materiału i wskazywać dostępność opisu:
„Infografika przedstawiająca wyniki audytu dostępności. Pełne dane znajdują się w tekście poniżej”.
Jeżeli układ przestrzenny infografiki ma znaczenie, trzeba je opisać w wersji tekstowej. Może chodzić o proces, zależność przyczynowo-skutkową, porównanie albo hierarchię.
Samo przepisanie wszystkich słów widocznych na grafice nie zawsze oddaje relacje między nimi. Opis powinien przekazywać sens, a nie tylko zawartość wizualną.
Opis nie powinien powtarzać sąsiedniego tekstu
Jeżeli ta sama informacja znajduje się w nagłówku, podpisie lub akapicie obok obrazu, nie trzeba jej powtarzać w całości.
Na karcie artykułu może znajdować się zdjęcie, tytuł i krótka zajawka. Jeśli obraz jest linkiem prowadzącym do tego samego miejsca co tytuł, czytnik ekranu może odczytać dwukrotnie identyczny tekst.
Powtarzalność nie zawsze stanowi formalny błąd, ale obniża wygodę korzystania. W rozbudowanej liście aktualności użytkownik może słyszeć ten sam tytuł kilkadziesiąt razy.
Warto przeanalizować cały komponent, a nie tylko pojedynczy obraz. Czasami lepszym rozwiązaniem jest pusty opis obrazu, czasami wspólny link obejmujący zdjęcie i tytuł, a czasami krótki opis uzupełniający.
Celem jest przekazanie pełnej informacji bez zbędnych powtórzeń.
Opis powinien być zwięzły, ale nie za wszelką cenę
Często pojawia się zalecenie, aby tekst alternatywny miał określoną maksymalną liczbę znaków. Nie istnieje jednak jedna długość odpowiednia dla wszystkich obrazów.
Prosta ikona może wymagać jednego lub dwóch słów. Zdjęcie dokumentujące istotne wydarzenie może potrzebować pełnego zdania. Złożony wykres powinien otrzymać krótkie podsumowanie i osobny opis danych.
Najważniejsze jest to, aby opis był wystarczający do przekazania znaczenia i nie zawierał zbędnych szczegółów.
Nie trzeba tworzyć literackich opisów fotografii, jeśli obraz pełni prostą funkcję informacyjną. Nie należy jednak skracać opisu do poziomu, na którym traci sens.
Dobra zasada brzmi: opisz tyle, ile potrzeba do wykonania tego samego zadania lub zrozumienia tej samej informacji.
Nie należy wpisywać tekstu alternatywnego automatycznie
Systemy zarządzania treścią mogą proponować opis na podstawie nazwy pliku, podpisu albo rozpoznawania obrazu. Narzędzia AI również potrafią generować opisy fotografii.
Takie rozwiązania mogą przyspieszyć pracę, ale nie znają pełnego kontekstu publikacji. System może poprawnie rozpoznać, że zdjęcie przedstawia grupę osób w sali, ale nie będzie wiedział, czy istotne jest podpisanie umowy, wręczenie nagród, szkolenie czy otwarcie wydarzenia.
Automatyczny opis może także błędnie rozpoznać osoby, miejsce, przedmiot albo emocje. Publikowanie go bez sprawdzenia może prowadzić do przekazania fałszywej informacji.
Opis powinien zostać zatwierdzony przez osobę, która zna treść artykułu i rozumie rolę obrazu.
Automatyzacja może przygotować propozycję. Nie powinna zastępować decyzji redaktora.
Nazwa pliku nie jest tekstem alternatywnym
Pliki takie jak `IMG_4837.jpg`, `baner-final-2.png` albo `zdjecie1.webp` nie przekazują użytkownikowi żadnej wartościowej informacji.
Nie należy kopiować nazwy pliku do pola alternatywnego. Podobnie niewłaściwe są opisy składające się z ciągu słów kluczowych przygotowanych wyłącznie pod wyszukiwarki.
Tekst alternatywny powinien być naturalnym, zrozumiałym komunikatem. Nadmierne powtarzanie fraz SEO utrudnia korzystanie z czytnika ekranu i nie odpowiada celowi dostępności.
Nazwa pliku może być uporządkowana ze względów administracyjnych lub technicznych, ale nie zastępuje opisu.
Brak obrazu nie może blokować zrozumienia strony
Dobrym testem jest czasowe wyłączenie wyświetlania obrazów albo wyobrażenie sobie strony bez nich.
Czy użytkownik nadal rozumie treść artykułu? Czy wie, dokąd prowadzi przycisk? Czy może poznać datę wydarzenia? Czy otrzymuje dane przedstawione na wykresie? Czy instrukcja nadal pozwala wykonać zadanie?
Jeżeli bez obrazu ginie ważna informacja, trzeba zapewnić odpowiedni opis lub wersję tekstową.
Nie oznacza to, że każda fotografia musi być szczegółowo opisana. Chodzi o zachowanie równoważnego dostępu do informacji i funkcji.
Strona nie powinna opierać się na założeniu, że każdy użytkownik widzi obrazy, rozpoznaje symbole i potrafi odczytać tekst umieszczony na grafice.
Tekst alternatywny powinien być częścią procesu publikacji
Opisy obrazów nie powinny być uzupełniane dopiero podczas audytu. Redaktor powinien podejmować decyzję o ich znaczeniu w chwili publikacji.
Prosta kontrola może obejmować pytania:
- Czy obraz przekazuje informację?
- Czy ta informacja znajduje się już w tekście?
- Czy obraz jest linkiem lub przyciskiem?
- Czy użytkownik straci coś ważnego, jeśli obraz zostanie pominięty?
- Czy opis przekazuje funkcję, a nie tylko wygląd?
- Czy potrzebna jest pełna wersja tekstowa obok obrazu?
Warto również kontrolować bibliotekę mediów. Ten sam obraz może być używany w różnych miejscach, ale opis zapisany globalnie nie zawsze będzie pasował do każdego kontekstu.
System powinien umożliwiać zmianę tekstu alternatywnego przy konkretnym użyciu obrazu, a redaktor powinien wiedzieć, że opis nie jest trwałą cechą samego pliku.
Dobry opis jest niewidoczny dla większości użytkowników, ale ważny dla jakości serwisu
Tekst alternatywny rzadko wpływa na wygląd strony. Z tego powodu łatwo go pominąć albo wypełnić przypadkowo.
Dla osoby korzystającej z czytnika ekranu może jednak decydować o tym, czy zrozumie sens ilustracji, rozpozna osobę, odczyta wynik wykresu albo pozna cel przycisku.
Nie każdy obraz powinien być opisany. Nie każdy opis powinien być długi. Nie każda grafika wymaga dodatkowej narracji.
Najważniejsza jest świadoma decyzja. Obraz informacyjny powinien otrzymać opis odpowiadający jego znaczeniu. Obraz złożony powinien mieć równoważną wersję tekstową. Element dekoracyjny powinien zostać pominięty. Ikona będąca przyciskiem musi natomiast jasno informować o działaniu.
Tekst alternatywny pomaga wtedy, gdy przekazuje informację, której użytkownik rzeczywiście potrzebuje. Przeszkadza, gdy powtarza otaczającą treść, opisuje dekoracje albo zmusza do słuchania szczegółów niemających znaczenia. Dostępność nie polega na opisywaniu wszystkiego. Polega na zapewnieniu, że żadna ważna informacja ani funkcja nie pozostaje dostępna wyłącznie wzrokowo.