Dlaczego opisy zdjęć i grafik są krytyczne w instytucji publicznej
Znaczenie tekstu alternatywnego dla osób z niepełnosprawnościami wzroku
Zdjęcia, ikony, infografiki czy skany dokumentów są w instytucjach publicznych wykorzystywane na każdej stronie i w niemal każdym dokumencie. Dla osoby niewidomej lub słabowidzącej bez odpowiedniego alternatywnego opisu zdjęcia są po prostu pustą przestrzenią. Czytnik ekranu widzi tylko informację „grafika” albo – co gorsza – nic. Cały przekaz wizualny, który ma wyjaśniać, ilustrować lub przekonywać, przestaje istnieć.
Tekst alternatywny w WCAG (ang. alternative text) jest odpowiednikiem obrazu w formie słownej. Czytnik ekranu odczytuje opis zdjęcia lub grafiki w miejscu, w którym osoba widząca widzi element wizualny. Dzięki temu użytkownik może zrozumieć, jaka informacja, funkcja lub kontekst kryje się w obrazie. Nie chodzi więc o „podpis pod zdjęciem”, ale o realne zastąpienie funkcji obrazu tekstem.
Użytkownicy słabowidzący korzystają często z powiększenia, kontrastu lub czytnika ekranu w wybranych sytuacjach. Dla nich opisy grafik są równie ważne. Duża, skomplikowana infografika na stronie BIP, której nie da się wygodnie powiększyć, bez dodatkowego opisu jest zwyczajnie bezużyteczna. Jeśli towarzyszy jej opis strukturalny albo pełna transkrypcja treści, osoba słabowidząca może skorzystać z treści niezależnie od problemów z widocznością elementów.
Obowiązki prawne: WCAG 2.1 i ustawa o dostępności cyfrowej
W kontekście instytucji publicznych alternatywny opis zdjęcia to nie tylko dobra praktyka, ale wymóg prawny. Z punktu widzenia standardu WCAG 2.1 kluczowe jest kryterium 1.1.1 Treść nietekstowa. Zgodnie z nim każdy element nietekstowy, który przekazuje informację lub pełni funkcję, musi mieć tekstową alternatywę. Wyjątkiem są jedynie elementy stricte dekoracyjne, które mogą być pomijane przez technologie asystujące.
Ustawa o dostępności cyfrowej stron internetowych i aplikacji mobilnych podmiotów publicznych wprost wskazuje konieczność spełnienia wymagań WCAG (na poziomie AA, z pewnymi wyjątkami). W praktyce oznacza to, że:
na stronach WWW instytucji (w tym BIP) wszystkie istotne obrazy muszą być opisane,
w dokumentach publikowanych w Biuletynie Informacji Publicznej i na stronach muszą być dostępne opisy grafik, wykresów i schematów,
w materiałach służących komunikacji urzędowej (projekty uchwał, zarządzenia, raporty, komunikaty kryzysowe) nie można opierać przekazu wyłącznie na obrazie bez tekstowego odpowiednika.
Kontrolerzy dostępności zwracają szczególną uwagę na alternatywne opisy grafik w BIP, ponieważ to właśnie tam publikuje się treści o charakterze urzędowym, często o dużym znaczeniu prawnym. Brak opisu wykresu w raporcie z konsultacji czy brak opisu skanu ważnego ogłoszenia może zostać uznany za utrudnianie dostępu do informacji.
Minimum formalne a realna użyteczność opisów
Spełnienie minimum WCAG w zakresie tekstów alternatywnych nie zawsze oznacza, że użytkownik rzeczywiście zrozumie treść. Wiele instytucji wpisuje w atrybut alt wyłącznie zdawkowe hasła typu „wykres”, „logo urzędu”, „zdjęcie budynku”. Z formalnego punktu widzenia jakiś tekst alternatywny istnieje, ale z perspektywy osoby korzystającej z czytnika ekranu jest on niemal bez wartości.
Realnie użyteczny opis zdjęcia lub grafiki powinien:
odpowiadać na pytanie, jaką rolę pełni obraz w danym miejscu,
zawierać kluczową informację, którą osoba widząca „łapie” wzrokiem w ułamku sekundy,
być zwięzły, ale nie tak ogólny, by nic z niego nie wynikało.
Przykład różnicy między „minimum” a użytecznością: alt „zdjęcie sali konferencyjnej” w informacji o spotkaniu konsultacyjnym spełnia warunek techniczny, ale nic nie wnosi. Alt „uczestnicy konsultacji społecznych siedzący w sali konferencyjnej podczas dyskusji o planie zagospodarowania gminy” daje od razu kontekst i wspiera odbiór treści.
Specyfika instytucji: BIP, dokumenty urzędowe i treści kryzysowe
Opisy grafik w administracji publicznej mają nieco inną wagę niż w serwisach komercyjnych. Na stronach BIP publikowane są:
akty prawa miejscowego, uchwały, zarządzenia,
ogłoszenia o naborach, konkursach, zamówieniach publicznych,
raporty, sprawozdania, wyniki konsultacji,
informacje kryzysowe i ostrzeżenia.
Jeśli do raportu dołączone są wykresy lub mapy bez alternatywnego opisu, część obywateli jest de facto pozbawiona dostępu do tych danych. Jeżeli ogłoszenie o utrudnieniach drogowych ma wyłącznie mapkę bez słownego opisu, osoby korzystające z czytników ekranu nie są w stanie ocenić, czy utrudnienia ich dotyczą. W komunikacji kryzysowej może to mieć bezpośredni wpływ na bezpieczeństwo.
W dokumentach urzędowych publikowanych w PDF wyzwanie jest jeszcze większe – często są to skany lub pliki generowane z programów, które nie zachowują struktury i atrybutów alt. Opisy obrazów w PDF muszą być dodane świadomie już na etapie przygotowania dokumentu (np. w edytorze tekstu lub w programie do składu), inaczej po konwersji nie będzie możliwości ich odczytania przez czytnik ekranu.
Źródło: Pexels | Autor: cottonbro studio
Podstawy: czym jest tekst alternatywny i jakie ma formy
Tekst alternatywny w atrybucie alt i jego rola
Podstawową formą opisu obrazu na stronach WWW jest atrybut alt w znaczniku <img>. To właśnie tam powinien znaleźć się krótki, treściwy opis tego, co obraz przekazuje lub jaką pełni funkcję. Dla użytkownika technologii asystującej tekst alternatywny:
zastępuje obraz, gdy ten nie jest widoczny (np. z powodu braku wzroku, wolnego łącza, błędu wczytywania),
pozwala zrozumieć znaczenie obrazu podczas nawigacji tylko za pomocą klawiatury i czytnika ekranu,
staje się częścią kolejności odczytu na stronie lub w dokumencie.
Alternatywny opis zdjęcia nie zawsze musi być długi. Często wystarczą 2–8 słów opisujących sedno. Kluczowa jest odpowiedź na pytanie: „Co użytkownik traci, jeśli nie widzi tego obrazu?”. Jeśli obraz jest dekoracją, użytkownik nic nie traci i wówczas alt powinien być pusty. Jeśli obraz niesie informację – tekst alternatywny musi ją przekazać.
Opis w treści, podpis pod ilustracją i tytuł (title)
Nie każdy opis obrazu musi trafić do atrybutu alt. W wielu sytuacjach lepiej sprawdza się opis w treści strony (np. tuż pod grafiką) lub podpis pod ilustracją. Kluczowe jest, by użytkownik korzystający z czytnika ekranu usłyszał nie tylko informację „grafika”, ale też treść przekazywaną przez obraz. Istnieje kilka możliwości:
Krótki alt + rozwinięcie w tekście – alt wskazuje, co to za obraz („Mapa objazdów w centrum miasta”), a szczegóły są opisane w akapicie poniżej.
Alt odsyłający do opisu – np. „Wykres liczby wniosków – opis w tekście poniżej”. Wtedy czytnik ekranu od razu sygnalizuje użytkownikowi, że informacje będą rozwinięte.
Opis w podpisie pod ilustracją – jeśli podpis jest na tyle szczegółowy, a grafika powtarza tylko przekaz tekstu, alt może być bardzo krótki lub wręcz pusty (o ile podpis jest logicznie powiązany z obrazem w strukturze strony).
Atrybut title przy obrazach ma zupełnie inny cel. Jest przeznaczony głównie do wyświetlania „dymków” po najechaniu kursorem. W wielu czytnikach ekranu jest ignorowany lub odczytywany w sposób niespójny. Z punktu widzenia dostępności nie można traktować go jako zastępnika alt. Jeśli obraz ma być zrozumiały dla użytkownika niewidomego, kluczowym miejscem jest zawsze alt i/lub opis w tekście.
Kiedy krótki alt nie wystarcza – długi opis grafiki
Niektórych obrazów nie da się sensownie opisać w jednym krótkim zdaniu. Dotyczy to głównie:
złożonych wykresów (np. kilka serii danych, wiele osi, różne kategorie),
W takiej sytuacji atrybut alt pełni rolę „nagłówka” albo krótkiego wprowadzenia, a szczegóły przenoszone są do długiego opisu. Może on przyjąć różne formy:
osobny akapit pod grafiką,
opisana tabela danych towarzysząca wykresowi,
link o treści „Pełny opis grafiki” prowadzący do innej podstrony, załącznika lub sekcji w tym samym dokumencie.
Technologie asystujące odczytują najpierw alt, a następnie umożliwiają przejście dalej w strukturze dokumentu. Jeśli pod grafiką znajduje się opis, użytkownik usłyszy go po przejściu do kolejnego akapitu. Dlatego ważne jest, by tekst alternatywny wyraźnie sugerował, że dalsze szczegóły znajdują się w kolejnym fragmencie, np. „Wykres słupkowy liczby wniosków – opis danych poniżej”.
Jak czytniki ekranu traktują obrazy i alt
Czytnik ekranu rozpoznaje obrazy jako elementy nietekstowe, ale jeśli w kodzie znajduje się atrybut alt, odczytuje jego zawartość w miejscu wystąpienia obrazu. Sposób działania jest dość przewidywalny:
Obraz z wypełnionym alt – czytnik odczytuje treść alt jako część ciągu tekstu (np. „grafika: herb miasta Warszawy”).
Obraz z alt=”” – oznaczony jako dekoracyjny, jest pomijany w czytaniu ciągłym; użytkownik może nawet nie mieć świadomości, że tam był obraz, ale też nie traci istotnej treści.
Obraz bez atrybutu alt – czytnik zwykle odczytuje nazwę pliku lub komunikat typu „grafika” / „obraz”, co jest bezużyteczne i irytujące.
Dla nawigacji klawiaturą i czytnikiem ekranu szczególnie ważne jest odróżnienie obrazów dekoracyjnych od informacyjnych. Nadmiar „ozdobnych” altów powoduje, że osoba niewidoma musi przeklikiwać się przez lawinę mało ważnych komunikatów (np. „grafika: linia pozioma”, „grafika: logo partnera”), co bardzo utrudnia korzystanie z serwisu.
Źródło: Pexels | Autor: nappy
Rodzaje obrazów w instytucji i różne strategie opisu
Podział funkcjonalny: informacyjne, dekoracyjne, funkcjonalne, złożone
Dobry system opisów grafik w instytucji zaczyna się od klasyfikacji. W praktyce można wyróżnić cztery podstawowe kategorie:
Obrazy informacyjne – przekazują konkretną treść (zdjęcia wydarzeń, ikony z informacją, schematy, rysunki ilustrujące krok po kroku).
Obrazy dekoracyjne – służą wyłącznie ozdobie, wypełniają layout, nie wnoszą nowej treści.
Obrazy funkcjonalne – pełnią rolę przycisków, linków lub elementów sterujących (np. ikona lupy jako przycisk wyszukiwarki, ikona drukarki jako przycisk „Drukuj”).
Obrazy złożone – zawierają wiele informacji, relacje między elementami, dane liczbowe (wykresy, mapy, infografiki, schematy procesów).
Od tego podziału zależy, jak opisywać zdjęcia i grafiki, aby spełnić WCAG w instytucji:
obrazy informacyjne – potrzebują zwięzłego, ale treściowego alt,
dekoracyjne – powinny mieć pusty alt i być pomijane,
funkcjonalne – alt opisuje działanie, a nie wygląd ikony,
złożone – wymagają altu + dłuższego opisu lub alternatywnej formy danych.
Obrazy informacyjne: jak uchwycić sedno
Obraz informacyjny ma coś zakomunikować. W instytucjach są to np.:
zdjęcia z wydarzeń (sesja rady, spotkanie konsultacyjne, otwarcie inwestycji),
zdjęcia ilustrujące działanie urzędu (przyjmowanie wniosków, punkt obsługi klienta),
ikony obok tekstu, które uzupełniają informację (np. ikona telefonu obok numeru infolinii),
proste schematy, rysunki instruktażowe.
Opis powinien oddawać to, co jest najważniejsze w danym kontekście. Jeśli zdjęcie jest jedynie uzupełnieniem informacji, nie trzeba opisywać każdego detalu. Przykładowo:
Za ogólny: „zdjęcie mężczyzny”.
Za bardzo szczegółowy: „mężczyzna w ciemnym garniturze, z niebieskim krawatem, siedzący przy drewnianym stole w jasnym pokoju”.
Lepszy w kontekście strony urzędu: „pracownik urzędu przyjmuje wniosek od mieszkańca przy biurku obsługi”.
Różnica jest subtelna, ale istotna. W pierwszym przypadku opis skupia się na elementach wizualnych bez związku z treścią strony. W drugim – na funkcji zdjęcia: pokazuje relację urząd–mieszkaniec oraz sytuację obsługi.
Przy zdjęciach z wydarzeń publicznych dobrym punktem odniesienia jest krótka odpowiedź na trzy pytania: kto, co robi, w jakim celu / w jakim kontekście. Przykład:
„Prezydent miasta podpisuje umowę o dofinansowanie remontu szkoły.”
„Mieszkańcy omawiają projekty budżetu obywatelskiego podczas spotkania konsultacyjnego.”
Nie ma potrzeby opisywania liczby osób w tle, koloru ścian czy modelu mikrofonu, o ile te szczegóły nie są kluczowe dla zrozumienia przekazu.
Obrazy dekoracyjne: kiedy alt powinien pozostać pusty
Obrazy dekoracyjne budują nastrój, uatrakcyjniają layout i wspierają identyfikację wizualną, ale nie przekazują istotnej treści. W instytucjach publicznych to np.:
tła nagłówków z rozmytym zdjęciem miasta,
ornamenty, ramki, ikony strzałek wykorzystywane jako ozdoby,
powtarzające się zdjęcia stockowe, które nie odnoszą się do konkretnej usługi.
Tego typu elementy powinny mieć alt="", a sam obraz powinien być oznaczony jako czysto dekoracyjny w systemie zarządzania treścią lub w edytorze PDF. Dzięki temu czytnik ekranu je pominie, a użytkownik nie będzie słuchał serii nic nie wnoszących komunikatów.
Wątpliwości pojawiają się przy zdjęciach „na pograniczu” – np. duże zdjęcie w banerze na stronie głównej. Tu można porównać dwa podejścia:
Zdjęcie neutralne + tekst w banerze zawiera cały przekaz – obraz spełnia rolę dekoracyjną. Wystarczy pusty alt, a treść sloganu i linku jest dostępna jako tekst.
Zdjęcie niesie konkretną informację (np. pokazuje nowo otwarty budynek urzędu, nowe pociągi w komunikacji) – warto zastosować krótki alt uzupełniający przekaz tekstu, ale bez dublowania sloganu.
Jeśli ten sam element graficzny powtarza się na wielu stronach (np. ten sam wzór tła w każdym nagłówku), traktowanie go jako obrazu dekoracyjnego jest bezpieczniejszym wyborem z punktu widzenia komfortu użytkowników technologii asystujących.
Obrazy funkcjonalne: ikony, które „coś robią”
Obraz funkcjonalny nie ma czego „pokazać” – ma coś uruchomić. Przykłady z serwisów instytucji publicznych:
ikona drukarki jako przycisk „Drukuj stronę”,
ikona koperty prowadząca do formularza kontaktowego,
ikona koszyka w systemie opłat lub rezerwacji,
ikona lupy uruchamiająca wyszukiwarkę.
Dla takich elementów alt musi opisywać działanie, a nie wygląd ikony. Zamiast „ikona drukarki” lepiej użyć „Drukuj stronę”. W ten sposób użytkownik czytnika ekranu otrzymuje taką samą informację funkcjonalną, jak osoba widząca klikająca ikonę.
W praktyce są dwa rozsądne warianty:
Sama ikona jako link/przycisk – alt zawiera pełny opis czynności, np. alt="Wyślij formularz".
Ikona + tekst obok (w tym samym linku/przyciski) – alt może być pusty, ponieważ rolę opisu spełnia tekst (np. link zawiera ikonę i słowo „Drukuj”). Powielanie opisu spowodowałoby „podwójne” czytanie treści.
W systemach, gdzie jeden obraz pełni kilka ról (np. logo instytucji jest jednocześnie linkiem do strony głównej), alt powinien łączyć informację o tożsamości z funkcją nawigacyjną. Przykład:
alt="Urząd Gminy X – strona główna" zamiast samodzielnego „logo urzędu” lub „link: strona główna”.
Obrazy złożone: wykresy, schematy, infografiki
Obrazy złożone pojawiają się często w sprawozdaniach, raportach i dokumentach strategicznych. Różnią się jednak pod względem tego, co jest najważniejsze: same liczby, relacje między elementami, czy może narracja i proces. Ta różnica wpływa na strategię opisu.
Można wyróżnić trzy typowe grupy:
wykresy i diagramy danych – priorytetem są wartości liczbowe i porównania,
infografiki – ważne są komunikaty tekstowe, skróty informacji, prosta historia,
mapy i schematy przestrzenne – liczą się lokalizacje, trasy, odległości lub obszary.
W każdej z grup alt pełni przede wszystkim funkcję etykiety, a ciężar merytoryczny przenosi się do dłuższego opisu. Różne są natomiast najlepsze formy tego opisu: tabela, uporządkowana lista kroków, opis trasy słowny lub odnośnik do sekcji „Opis mapy”.
Jak pisać dobry krótki opis (alt) krok po kroku
Krótki alt ma konkretne ograniczenie: powinien dać się odczytać jednym tchem, nie rozwijając się w długi akapit. Kilka kroków pomaga utrzymać tę dyscyplinę.
Określ funkcję obrazu w danym miejscu
Zacznij nie od tego, co widać, tylko po co obraz tam umieszczono. Ten sam herb miasta będzie opisany inaczej w nagłówku strony (funkcja identyfikacyjna), inaczej w artykule o historii herbu (funkcja ilustracyjno-informacyjna). Gdy obraz pełni kilka funkcji naraz, wybierz tę najważniejszą dla użytkownika.
Odpowiedz na pytanie „co użytkownik traci”
Wyobraź sobie, że obraz znika z wersji drukowanej. Jaką informację musiałbyś dopisać słownie, żeby tekst wciąż miał sens? To jest rdzeń altu. Jeśli bez obrazu tekst pozostaje kompletny – najprawdopodobniej wystarczy pusty alt.
Unikaj zbędnych wstępów
Sformułowania typu „zdjęcie”, „grafika”, „rysunek” są często powtarzane przez sam czytnik ekranu. W alt zazwyczaj wystarczy od razu treść, np. „Budowa nowej szkoły podstawowej” zamiast „zdjęcie budowy nowej szkoły podstawowej”. Wyjątek to sytuacje, gdy rodzaj obrazu ma znaczenie (np. „fragment mapy zabytków dzielnicy Śródmieście”).
Skracaj do sensu, nie do liczby znaków
Dobrze skonstruowany alt ma zwykle od 2 do kilkunastu słów. Gdy wychodzi dłuższe zdanie, sprawdź, czy nie próbujesz w alt zmieścić całego długiego opisu. Jeśli tak – skróć alt do nagłówka, a szczegóły przenieś niżej.
Zadbaj o spójność w serwisie i dokumentach
Ustalenie wspólnych wzorców upraszcza pracę zespołu. Przykładowo: wszystkie zdjęcia z wydarzeń opisujemy według schematu „kto + co + w jakim kontekście”, a logotypy instytucji zawsze jako „pełna nazwa instytucji”. Dzięki temu użytkownik nie musi za każdym razem domyślać się logiki opisów.
Przykłady krótkich altów w typowych sytuacjach urzędowych
Porównanie kilku wariantów pomaga ustalić poziom szczegółowości. Kilka realistycznych przykładów:
Zdjęcie z otwarcia inwestycji drogowej
Zbyt ogólny: „otwarcie drogi”.
Zbyt szczegółowy: „prezydent miasta wraz z trzema osobami przecina niebieską wstęgę na tle fragmentu nowej asfaltowej drogi i barier ochronnych”.
Proporcjonalny: „uroczyste otwarcie nowego odcinka obwodnicy miasta”.
Zdjęcie sali obsługi mieszkańców
Zbyt ogólny: „biuro”.
Proporcjonalny: „stanowiska obsługi mieszkańców w nowej sali urzędu miasta”.
Prosta ikona informacyjna (telefon obok numeru infolinii)
Jeśli jest obok tekstu „Infolinia 800 000 000” – alt może być pusty, bo tekst już przekazuje informację. Gdy ikona jest jedynym elementem klikanym, alt powinien brzmieć np. „Zadzwoń na infolinię”.
Typowe błędy w krótkich opisach
Najczęściej powtarzają się trzy grupy problemów. Każdy z nich można wyeliminować, wprowadzając proste zasady redakcyjne.
Opisy zbyt „wizualne” – skupione na kolorach, ubraniach, tle; pomijają sens. W dokumentach urzędowych takie szczegóły rzadko są kluczowe.
Powielanie tekstu z otoczenia – alt powtarza nagłówek artykułu lub podpis dosłownie. Wtedy użytkownik usłyszy tę samą informację dwa razy, co wydłuża nawigację.
Opis niezgodny z funkcją – na przykład alt „ikona koszyka” dla przycisku, który w rzeczywistości oznacza „Przejdź do płatności”. Dla użytkownika czytnika ekranu istotne jest działanie, nie kształt.
Długie opisy dla wykresów – trzy praktyczne strategie
Dla wykresów w instytucji publicznej można zastosować trzy podejścia do długich opisów. Wybór zależy od tego, jak użytkownicy będą korzystali z danych oraz w jakim formacie publikowany jest materiał (strona WWW, PDF, prezentacja).
Opis danych w tekście obok wykresu
Najprostsze i często najbardziej czytelne rozwiązanie. Wykres jest wizualnym skrótem, a poniżej znajduje się opis, który streszcza główne wnioski oraz podaje najważniejsze liczby. Alt pełni wtedy rolę nagłówka, np. alt="Wykres słupkowy liczby wniosków – opis danych poniżej".
Dobrze działa, gdy:
liczba kategorii jest niewielka (kilka słupków, jedna linia trendu),
dla użytkownika ważne są przede wszystkim wnioski, a nie każda pojedyncza wartość,
dokument ma formę artykułu lub raportu z komentarzem.
Tabela z pełnym zestawem danych
W tym wariancie wykres jest uzupełnieniem tabeli, a nie jedynym nośnikiem informacji. Użytkownik czytnika może przeanalizować dokładne wartości, porównać kategorie, skorzystać z sortowania (w aplikacjach webowych). Alt może brzmieć np. alt="Wykres słupkowy liczby wniosków w latach 2020–2023 – pełne dane w tabeli poniżej".
Ten sposób sprawdza się, gdy:
prezentowane są dane roczne, kwartalne lub według wielu kategorii,
w dokumencie używa się kilku wykresów o podobnej strukturze,
odbiorcy mogą potrzebować dokładnych wartości (np. analitycy, radni, dziennikarze).
Oddzielny długi opis lub załącznik
Stosowany rzadziej, ale bardzo przydatny przy skomplikowanych wykresach (kilka serii na jednej osi, rozbudowane legendy, wykresy wielowymiarowe). W alt umieszcza się wówczas odsyłacz, np. alt="Złożony wykres struktury budżetu – pełny opis w załączniku 1", a link do opisu może znajdować się pod wykresem lub w spisie treści.
To rozwiązanie jest sensowne, gdy:
dane zajmują dużą objętość i mogłyby „zalać” główny tekst,
w dokumencie stosuje się wiele podobnych wykresów, a do każdego przewidziany jest szczegółowy komentarz,
projekt rozlicza wymagania formalne (np. w przetargach) i musi udokumentować pełną dostępność danych.
Długie opisy infografik: streszczenie, rozpiska czy wersja tekstowa 1:1
Infografiki łączą tekst, ikony i układ przestrzenny. W instytucjach pojawiają się np. przy opisie procedur („Jak złożyć wniosek”), kampaniach informacyjnych („Jak segregować odpady”) czy prezentacji wyników badań. Tu także można wybrać jedną z trzech strategii, albo łączyć je zależnie od złożoności materiału.
Krótkie streszczenie treści infografiki
Przy prostych infografikach (np. trzy piktogramy z krótkimi hasłami) wystarczy streszczenie, które zbierze wszystkie komunikaty w jednym akapicie. Alt opisuje, czego dotyczy materiał, np. alt="Infografika o godzinach pracy punktów selektywnej zbiórki odpadów", a pod grafiką pojawia się tekst: „Od poniedziałku do piątku punkt czynny jest…”.
Rozpiska krok po kroku
Przy procedurach administracyjnych zwykle ważna jest kolejność i warunki przejścia między etapami. Zamiast odtwarzać układ graficzny, lepiej wypisać kroki w formie listy numerowanej. Alt może wskazywać, że pełny opis jest w tekście, np. alt="Infografika przedstawiająca etapy złożenia wniosku o wydanie dowodu – opis kroków poniżej".
Przykładowe rozwinięcie pod grafiką:
Zaloguj się do profilu zaufanego.
Wypełnij formularz wniosku o wydanie dowodu osobistego.
Załącz aktualne zdjęcie spełniające wymagania.
Złóż wniosek i oczekuj na powiadomienie o gotowym dokumencie.
Ten sposób sprawdza się zwłaszcza wtedy, gdy infografika przedstawia „ścieżkę klienta” albo serię decyzji typu „jeśli – to”. Użytkownik czytnika ekranu dostaje liniową, spokojną narrację zamiast rozproszonego obrazu.
Wersja tekstowa 1:1
Przy rozbudowanych infografikach (np. podsumowaniach raportów, plakatach z wieloma blokami) sensowniej jest przygotować równoległą wersję tekstową: osobną sekcję albo załącznik. Alt wtedy pełni funkcję tytułu i drogowskazu, np. alt="Infografika z wynikami badań jakości powietrza – pełna wersja tekstowa w rozdziale 3.2".
Wersja tekstowa może mieć strukturę:
nagłówek główny odpowiadający tytułowi infografiki,
podnagłówki odpowiadające głównym blokom (np. „Źródła zanieczyszczeń”, „Działania miasta”, „Rekomendacje dla mieszkańców”),
pod spodem dokładne treści etykiet, wartości liczbowych i krótkich komentarzy.
Taka „lustrzana” wersja jest bardziej pracochłonna, ale w zamian daje pełną kontrolę nad dostępnością i ułatwia późniejsze aktualizacje, bo tekst można zaktualizować niezależnie od grafiki.
Długie opisy map i planów: trzy praktyczne modele
Mapy i plany budynków są dla osób niewidomych jednymi z trudniejszych materiałów. Różnica między „minimalnym” opisem a naprawdę użytecznym bywa ogromna. Trzy podejścia pomagają dobrać właściwy poziom szczegółów.
Opis celu i orientacyjnego położenia
Przy mapach ilustrujących jedynie ogólne położenie (np. „gdzie leży gmina w województwie”) wystarczy opis finałowego przekazu, a nie wierne odtwarzanie geografii. W alt można użyć formuły typu: alt="Mapa województwa z zaznaczoną gminą X na północny wschód od stolicy regionu", a pod spodem doprecyzować np. sąsiednie jednostki.
Taki opis wystarcza, gdy:
mapa pełni funkcję ilustracyjną lub wprowadzającą,
nie ma potrzeby odwzorowywania każdej miejscowości czy numeru drogi,
kluczowe jest umiejscowienie „w przybliżeniu”, a nie planowanie trasy.
Słowny opis trasy lub dojścia
Jeśli mapa pokazuje dojazd lub dojście do budynku urzędu, ważniejsza od konfiguracji ulic jest konkretna instrukcja: skąd, którędy i jak daleko. Alt może sygnalizować, że mapa przedstawia drogę, natomiast pełną instrukcję warto rozpisać krokiem marszu, np.:
alt="Mapa dojścia do siedziby urzędu z przystanku Dworzec Główny – opis trasy poniżej"
Przykładowa instrukcja pod mapą:
Wyjdź z przystanku „Dworzec Główny” w kierunku centrum.
Idź prosto około 200 metrów wzdłuż ulicy Kościuszki, mijając po lewej park.
Na pierwszym skrzyżowaniu z sygnalizacją świetlną skręć w prawo w ulicę Urzędową.
Wejście do urzędu znajduje się po lewej stronie po około 100 metrach, za niskim ogrodzeniem.
Taki opis można łatwo dostosowywać, np. tworząc wariant dla osób poruszających się na wózku (informacje o krawężnikach, podjazdach, windach).
Strukturalny opis planu budynku
Plany kondygnacji, ewakuacyjne czy rozkłady stoisk na targach wymagają podwójnej strategii: orientacji ogólnej oraz opisu kluczowych punktów. Alt podaje temat i ewentualną lokalizację, np. alt="Plan pierwszego piętra urzędu miasta z zaznaczonymi wydziałami i drogami ewakuacji".
Dłuższy opis warto ułożyć według logicznych segmentów:
Układ ogólny – np. „Korytarz w kształcie litery L, wejście z klatki schodowej w krótszej części”.
Rozmieszczenie głównych punktów – „Po lewej stronie od wejścia, w krótszym ramieniu korytarza, znajdują się pokoje 101–104, w tym Biuro Obsługi Mieszkańców w pokoju 102”.
Miejsca krytyczne – „Dwie klatki schodowe na końcach dłuższego korytarza, w połowie korytarza wyjście ewakuacyjne na dziedziniec”.
W dużych obiektach opłaca się przygotować osobne opisy dla każdej kondygnacji oraz zbiorczy opis dostępności (podjazdy, windy, toalety dostosowane) w oddzielnym rozdziale serwisu.
Różnice między opisem w serwisie WWW a w dokumentach PDF i prezentacjach
Ta sama ilustracja będzie inaczej opisana w zależności od nośnika. Różnice dotyczą nie tylko techniki (gdzie wpisać alt), ale też stylu i długości tekstu.
Serwis WWW
Użytkownik korzysta z nagłówków, linków, często też z powiększania. Alt powinien być krótki, a dłuższe opisy lepiej umieszczać jako tekst na stronie – w akapitach, listach, tabelach. Dobrą praktyką jest także zapewnienie możliwości powiększenia samej grafiki bez utraty czytelności.
Dokumenty PDF
Tu czytniki ekranu polegają na strukturze tagów. Trzeba zadbać nie tylko o alt, ale też o poprawne oznaczenie roli obiektu (figure, artifact). Dłuższe opisy można włączyć bezpośrednio do treści dokumentu lub zastosować atrybut Actual Text dla złożonych elementów, jeśli narzędzie to umożliwia. W raportach częstą praktyką jest umieszczanie wykresu na stronie, a pełnej tabeli z danymi w aneksie – i wyraźne wskazanie tego w alt.
Prezentacje (PowerPoint, LibreOffice Impress)
Uczestnik spotkania rzadko ma czas na spokojne przeanalizowanie szczegółowego opisu w trakcie slajdu. Zwykle lepiej przygotować osobną tekstową wersję materiału (np. notatki z prezentacji lub dostępny plik DOCX), a w samych slajdach stosować alt typu: alt="Zdjęcie nowej sali obsługi – opis w materiałach towarzyszących". Przy prezentacjach publikowanych w BIP alt może być dłuższy, bo tam pełni rolę stałego dokumentu, a nie tylko wsparcia wystąpienia ustnego.
Jak organizować pracę nad opisami w instytucji
Dobre opisy powstają szybciej, gdy zespół ma ustalone zasady. Zamiast liczyć na indywidualną wrażliwość każdej osoby, lepiej zbudować prosty system: kto za co odpowiada, jak podejmowane są decyzje i jak wygląda kontrola jakości.
Podział ról
Najczęściej sensowny jest model, w którym:
autor treści przygotowuje propozycję altu (zna kontekst),
grafik lub osoba techniczna umieszcza alt w systemie CMS czy edytorze PDF,
koordynator dostępności sprawdza losowo wybrane materiały pod kątem zgodności z przyjętymi zasadami.
W małych zespołach te funkcje mogą się łączyć, ale kluczowe jest, by przynajmniej jedna osoba patrzyła na opisy systemowo, a nie tylko „przy okazji”.
Proste wzorce i szablony
Dobrym punktem wyjścia jest kilkustronicowa ściągawka z przykładami. Zamiast ogólnych zasad „pisz krótko”, praktyczniej jest zdefiniować szablony typu:
„zdjęcia z wydarzeń – kto + co + gdzie (opcjonalnie)”
„ikony funkcjonalne – opis działania przycisku”
„wykresy – tytuł + wskazanie miejsca pełnych danych”
„mapy dojazdu – punkt startowy + główne orientacyjne punkty + dystans orientacyjny”.
Taki dokument może być załącznikiem do procedury redakcyjnej albo instrukcją dla wykonawców zewnętrznych (np. agencji przygotowujących kampanie informacyjne).
Lista kontrolna przy publikacji
Prosty checklist przy zamieszczaniu materiału w BIP lub serwisie głównym skutecznie wyłapuje najczęstsze błędy. Kilka kontrolnych pytań:
Czy każde znaczące zdjęcie ma alt odpowiadający funkcji obrazu?
Czy dekoracje (np. tła, paski ozdobne) mają pusty alt lub są pominięte przez czytniki?
Czy wykresy mają wskazanie, gdzie znajdują się pełne dane?
Czy mapy i plany są uzupełnione o opis umożliwiający dojście lub orientację?
Wprowadzenie takiej listy do procesu publikacji (np. jako krok obowiązkowy przed zatwierdzeniem) zwykle bardziej poprawia dostępność niż jednorazowe szkolenie.
Współpraca z wykonawcami zewnętrznymi
Przetargi na kampanie społeczne, projekty graficzne czy opracowanie raportów często nie uwzględniają kwestii opisów alternatywnych. Efekt: materiały są atrakcyjne wizualnie, ale wymagają wielu poprawek po stronie urzędu. Kilka prostych zapisów w umowach zmienia sytuację.
Wymaganie dostarczenia propozycji altów
W specyfikacji można wskazać, że wykonawca ma obowiązek dostarczyć listę wszystkich grafik wraz z propozycją krótkiego i – tam, gdzie potrzebne – długiego opisu. Instytucja zachowuje prawo do korekty, ale uniknie pisania wszystkiego od zera.
Formaty robocze z warstwami tekstu
Przy infografikach i mapach opłaca się otrzymać pliki źródłowe z rozdzielonym tekstem (np. w formacie edytowalnym zamiast tylko JPG). Ułatwia to stworzenie wersji tekstowej 1:1 oraz późniejsze aktualizacje bez angażowania grafika.
Kryteria oceny dostępności
W postępowaniach można przewidzieć punkty za demonstrację sposobu opisu grafik: próbkę infografiki z propozycją altu i długiego opisu. Pozwala to porównać podejścia różnych wykonawców, jeszcze zanim powstanie właściwy materiał.
Testowanie opisów z użytkownikami i narzędziami
Nawet dobrze przemyślany system opisów z czasem wymaga korekt. Najprostszy test zaczyna się od uruchomienia czytnika ekranu i próby przejścia przez stronę tak, jak zrobiłby to użytkownik niewidomy.
Testy z użyciem czytnika ekranu
Nawet kilkanaście minut z NVDA czy VoiceOverem pokazuje, które obrazy „zalewają” treścią, a gdzie opisy są zbyt skąpe. Zespół może przygotować krótkie scenariusze, np. „odnajdź informację o godzinach pracy PSZOK-u” i przejść je wyłącznie za pomocą klawiatury i czytnika.
Testy z udziałem osób niewidomych lub słabowidzących
Najwięcej informacji daje rozmowa z realnymi użytkownikami. Warto porównać ich odbiór różnych strategii: czy wolą szczegółową tabelę danych, czy raczej tekstowy opis wniosków; czy opis trasy z mapy jest dla nich zrozumiały, czy wymaga doprecyzowania punktów orientacyjnych.
Automatyczne walidatory a jakość opisów
Narzędzia automatyczne wskażą brak altów albo techniczne błędy, ale nie ocenią, czy opis odpowiada funkcji obrazu. Mogą być więc pierwszym filtrem, lecz nie zastąpią przeglądu redakcyjnego. W praktyce najlepiej łączyć oba podejścia: walidator do wychwycenia „dziur” i przegląd ręczny kilku kluczowych stron miesięcznie.
Najczęściej zadawane pytania (FAQ)
Co to jest tekst alternatywny (alt) i po co się go używa w instytucji publicznej?
Tekst alternatywny (alt) to krótki opis treści lub funkcji obrazu dodany w kodzie strony lub w dokumencie. Czytnik ekranu odczytuje go w miejscu, gdzie osoba widząca widzi zdjęcie, ikonę, infografikę czy skan dokumentu. Dzięki temu osoba niewidoma lub słabowidząca otrzymuje tę samą informację, tylko w formie słownej.
W instytucjach publicznych alt nie jest „miłym dodatkiem”, ale kluczowym elementem równoprawnego dostępu do informacji. Bez niego wykres w raporcie, mapa objazdów czy skan ogłoszenia stają się dla części odbiorców pustą przestrzenią – formalnie opublikowaną, ale faktycznie niedostępną.
Jak poprawnie opisywać zdjęcia i grafiki, żeby spełnić WCAG 2.1?
Żeby spełnić WCAG 2.1 (kryterium 1.1.1 Treść nietekstowa), każdy obraz przekazujący informację lub pełniący funkcję musi mieć tekstową alternatywę. Alt powinien odpowiadać na pytanie: „Co użytkownik traci, jeśli nie widzi tego obrazu?”. W praktyce oznacza to opisanie sedna, a nie samego faktu istnienia zdjęcia.
Zamiast ogólnego „wykres” lepiej użyć np. „Wykres słupkowy pokazujący wzrost liczby wniosków o dowód osobisty w latach 2020–2023”. Krótki alt można uzupełnić szerszym objaśnieniem w tekście pod grafiką – zwłaszcza przy złożonych wykresach, schematach czy mapach.
Czy każde zdjęcie na stronie BIP musi mieć opis alt?
Nie każde, ale każde istotne. Obrazy, które przekazują informację (wykresy, schematy, mapy, skany pism, zdjęcia ilustrujące treść komunikatu), muszą mieć opis. Elementy czysto dekoracyjne – np. tło ozdobne, falka w nagłówku – powinny mieć pusty alt (alt=””), by czytnik ekranu je pomijał.
Na stronach BIP i w dokumentach urzędowych większość grafik ma jednak charakter informacyjny. W praktyce więc w BIP opisy wymaga prawie wszystko poza typową dekoracją. To szczególnie ważne przy aktach prawa miejscowego, ogłoszeniach, raportach czy informacjach kryzysowych, gdzie brak opisu może być uznany za realne utrudnianie dostępu do informacji.
Jaka jest różnica między alt a podpisem pod zdjęciem i kiedy co stosować?
Alt jest odczytywany w miejscu obrazu i ma zastąpić jego funkcję. Podpis pod zdjęciem to część widocznej treści strony – może być dłuższy, rozbudowywać kontekst, komentować grafikę. Dobrze działa układ, w którym alt informuje, co to za obraz („Mapa objazdów w centrum miasta”), a szczegóły trasy i ulic znajdują się już w tekście pod mapą.
Jeśli podpis pod ilustracją dokładnie opisuje to, co na niej jest, alt może być bardzo krótki lub pusty, pod warunkiem że podpis jest logicznie powiązany ze zdjęciem w strukturze strony. W przeciwieństwie do tego atrybut title nie zastępuje alt – jest wyświetlany jako „dymek” i często bywa ignorowany przez czytniki ekranu.
Jak pisać alt do logo urzędu, pieczęci, herbu – wystarczy „logo urzędu”?
Tu wiele zależy od funkcji obrazu. Jeśli logo lub herb pełni wyłącznie rolę dekoracyjną (np. w stopce obok powtórzonej już nazwy urzędu), można zastosować pusty alt, bo użytkownik niczego nie traci. Jeśli natomiast logo jest jedynym miejscem, gdzie pojawia się nazwa instytucji (np. na pierwszej stronie PDF), alt powinien ją zawierać – np. „Herb miasta X – Urząd Miejski w X”.
Sam opis „logo urzędu” zwykle niewiele mówi. Dla osoby korzystającej z czytnika ekranu przydatniejsza jest konkretna informacja: jaka to instytucja, ewentualnie jaki symbol (np. „Herb gminy: biały orzeł na czerwonej tarczy”).
Jak opisywać wykresy i mapy w raportach i ogłoszeniach urzędowych?
Przy wykresach i mapach krótkie alt-y rzadko wystarczają. Lepsze są dwa poziomy opisu: zwięzły alt, który identyfikuje grafikę („Mapa utrudnień drogowych w centrum miasta 10–15 maja”), oraz pełny opis w tekście – np. lista zamkniętych ulic, objazdów, kluczowych liczb z wykresu. Dzięki temu osoba z czytnikiem ekranu otrzymuje nie tylko informację „jaki to obraz”, ale też jaką treść zawiera.
Dla danych liczbowych z wykresu często najlepszym rozwiązaniem jest dodatkowa tabela lub tekstowa transkrypcja w raporcie. Graficzna forma wykresu pomaga osobom widzącym szybko porównać wartości, natomiast opis tekstowy zapewnia dostępność dla wszystkich pozostałych.
Czy skany dokumentów w PDF można uznać za dostępne, jeśli dodam do nich alt?
Sam alt do grafiki w PDF ze skanem nie rozwiązuje problemu, jeśli cały tekst dokumentu jest jednym obrazem. Czytnik ekranu „zobaczy” wtedy tylko jedną dużą grafikę, nawet z opisem, ale bez możliwości przejrzenia treści punkt po punkcie. W przypadku skanów konieczne jest zastosowanie OCR (rozpoznanie tekstu) i nadanie właściwej struktury dokumentowi.
Obrazy w PDF (np. wykresy, zdjęcia, pieczęcie) trzeba opisać na etapie tworzenia pliku – w edytorze tekstu lub programie do składu. Różnica jest taka, że skan całego dokumentu bez OCR i struktury będzie zawsze praktycznie niedostępny, a PDF z zachowanym tekstem, nagłówkami oraz alt-ami do grafik może w pełni spełniać wymagania WCAG i ustawy o dostępności cyfrowej.
Kluczowe Wnioski
Tekst alternatywny nie jest „podpisem pod zdjęciem”, lecz pełnoprawnym odpowiednikiem obrazu – ma przejąć jego funkcję informacyjną lub użytkową dla osób, które obrazu nie widzą.
Brak opisów grafik w instytucjach publicznych realnie wyklucza osoby niewidome i słabowidzące z dostępu do treści urzędowych – wykres w raporcie czy mapka utrudnień drogowych bez opisu są dla nich po prostu niewidoczne.
WCAG 2.1 (kryterium 1.1.1) oraz ustawa o dostępności cyfrowej nakładają na podmioty publiczne obowiązek opisywania wszystkich istotnych elementów nietekstowych; pomijane mogą być wyłącznie czysto dekoracyjne grafiki.
Techniczne „odhaczenie” wymogu (np. alt „wykres”, „logo urzędu”) nie wystarcza – opis ma przekazywać tę samą kluczową informację, którą osoba widząca odczytuje z obrazu w ułamku sekundy.
W serwisach urzędowych i BIP stawka jest wyższa niż w serwisach komercyjnych: brak alternatywy dla wykresów, map, skanów ogłoszeń czy wyników konsultacji może być traktowany jako utrudnianie dostępu do informacji o skutkach prawnych lub bezpieczeństwie.
W dokumentach PDF (uchwały, raporty, zarządzenia) opisy obrazów trzeba zaplanować na etapie tworzenia pliku – później, po eksporcie lub skanowaniu, dodanie poprawnych altów jest zwykle bardzo trudne lub niemożliwe.
