Alt - Tekst alternatywny dla obrazów a WCAG (alt text w HTML). Dlaczego brak alt jest problemem?

Tekst alternatywny (ang. alt text) pełni kluczową rolę w tworzeniu dostępnych stron internetowych, a jego brak jest jedną z najczęstszych przeszkód dla osób korzystających z technologii asystujących, takich jak czytniki ekranu. Alt text to opis, który przekazuje treść wizualną w formie tekstu, co pozwala osobom niewidomym lub słabowidzącym zrozumieć, co znajduje się na obrazie. Zawartość obrazu jest zatem dostępna nie tylko wizualnie, ale również w formie werbalnej.

Unsplash / Walkator

2024-09-09 07:48
2 minuty czytania

Dlaczego tekst alternatywny jest ważny?

Brak alt textu może znacząco ograniczyć doświadczenie użytkownika, zwłaszcza jeśli obrazy zawierają istotne informacje. Na przykład:

  • Infografiki – jeżeli infografika przedstawia dane lub wyjaśnia pewien proces, osoby korzystające z czytników ekranu będą zupełnie pozbawione dostępu do tej informacji bez opisu tekstowego.
  • Zdjęcia produktów – w sklepach internetowych, alt text dla zdjęć produktów jest niezbędny, aby osoby niewidome mogły dowiedzieć się, co znajduje się na zdjęciu. Brak tego elementu sprawia, że nie mogą one podjąć świadomej decyzji zakupowej.

Jakie są konsekwencje braku alt textu?

  1. Ograniczona dostępność informacji: Osoby niewidome lub słabowidzące, korzystające z czytników ekranu, nie mają dostępu do treści wizualnej. Na stronie bez alt textu, obraz może zostać odczytany jako "image" lub "graphic", co nie przekazuje żadnej wartościowej informacji.
  2. Naruszenie przepisów: Zgodnie z wytycznymi WCAG i ADA, brak tekstu alternatywnego jest naruszeniem zasad dostępności. Może to prowadzić do sankcji prawnych, zwłaszcza w krajach, gdzie obowiązują przepisy dotyczące dostępności cyfrowej, takich jak Stany Zjednoczone czy Unia Europejska.
  3. Utrata potencjalnych klientów: Strony internetowe, które nie są dostępne dla wszystkich użytkowników, mogą tracić klientów z niepełnosprawnościami. Szacuje się, że globalnie około 15% populacji ma jakąś formę niepełnosprawności, co oznacza duży rynek, który nie może zostać zignorowany.

Jak prawidłowo tworzyć tekst alternatywny?

Tworzenie dobrego alt textu wymaga zrozumienia, co jest istotne w kontekście danego obrazu. Opis powinien być krótki, zwięzły, ale zarazem dostatecznie szczegółowy, aby oddać znaczenie obrazu. Oto kilka wskazówek:

  • Zrozum cel obrazu: Jeśli obraz jest czysto dekoracyjny, może nie wymagać alt textu (ale warto wtedy użyć pustego znacznika alt, np. alt=""). Natomiast jeśli obraz zawiera istotne informacje, opis powinien te informacje przekazywać.
  • Unikaj zbędnych fraz: Frazy typu "Obraz przedstawia..." są zbędne. Zamiast tego skup się bezpośrednio na opisie, np. „Kobieta siedząca przy biurku z laptopem”.
  • Opisuj kontekst: Jeżeli obraz jest związany z określoną treścią, jego alt text powinien to odzwierciedlać. Na przykład, jeśli artykuł dotyczy zrównoważonego rolnictwa, a obraz przedstawia uprawy ekologiczne, alt text powinien opisywać, co widać na obrazie w kontekście artykułu, np. „Pole ekologicznych warzyw na farmie”.

Korzyści z implementacji alt textu

  1. Zwiększona dostępność: Dodanie tekstu alternatywnego poprawia dostępność strony dla osób z niepełnosprawnościami, co czyni ją bardziej inkluzywną.
  2. Poprawa SEO: Prawidłowo wprowadzony alt text pomaga również w optymalizacji dla wyszukiwarek (SEO), ponieważ wyszukiwarki nie "widzą" obrazów, ale analizują tekst, który im towarzyszy.
  3. Lepsze doświadczenie użytkownika: Alt text nie tylko pomaga osobom z niepełnosprawnościami, ale również może być pomocny w sytuacjach, gdy obrazy nie ładują się prawidłowo (np. przy wolnym połączeniu internetowym).

Przykłady dobrego i złego alt textu

  • Zły alt text: „IMG_001.jpg” – To typowy przykład tekstu alt, który nie dostarcza żadnej użytecznej informacji.
  • Dobry alt text: „Mężczyzna w zielonym T-shircie biegnie w maratonie ulicznym, trzymając butelkę wody” – Ten opis przekazuje istotne informacje o osobie na zdjęciu oraz kontekście obrazu.

Jak sprawdzić stronę internetową w zakresie obecności ALT text i jego poprawności?

 

Podsumowanie

Brak tekstu alternatywnego dla obrazów to poważne naruszenie dostępności, które może wpłynąć na doświadczenie użytkowników oraz wyniki SEO strony. Zapewnienie, że każdy obraz posiada odpowiedni opis, nie tylko poprawia dostępność witryny, ale również świadczy o dbałości o wszystkich użytkowników, bez względu na ich możliwości. Dbałość o te detale to kluczowy krok w tworzeniu bardziej inkluzywnej przestrzeni internetowej.

Napisz do nas

Wybierz plik

Blog Artykuły
Ustawienia dostępności
Wysokość linii
Odległość między literami
Wyłącz animacje
Przewodnik czytania
Czytnik
Wyłącz obrazki
Skup się na zawartości
Większy kursor
Skróty klawiszowe