Co to jest atrybut alt?
Atrybut alt to tekst alternatywny dodawany do elementu HTML img. Opisuje zawartość lub funkcję obrazka, gdy grafika nie może zostać wyświetlona albo gdy stronę odczytuje czytnik ekranu.
Przykład:
<img src="logo.png" alt="Logo szkoły graficznej">
Dlaczego alt jest ważny?
Atrybut alt jest jednym z podstawowych wymagań dostępności stron internetowych. Pomaga osobom niewidomym i słabowidzącym zrozumieć, co znajduje się na ilustracji. Jest też przydatny, gdy obrazek nie załaduje się z powodu błędu pliku, wolnego internetu lub złej ścieżki.
Jak pisać dobry tekst alternatywny?
Dobry alt powinien być:
- krótki i konkretny,
- zgodny z funkcją obrazka na stronie,
- pozbawiony zbędnych słów typu „obrazek przedstawia”, jeśli nie są potrzebne,
- inny dla grafiki informacyjnej i dekoracyjnej.
Przykład poprawny:
<img src="wykres-sprzedazy.png" alt="Wykres sprzedaży pokazujący wzrost o 20% w 2024 roku">
Przykład słaby:
<img src="wykres-sprzedazy.png" alt="obrazek">
Obrazek dekoracyjny
Jeśli grafika jest tylko ozdobą i nie niesie informacji, stosuje się pusty atrybut:
<img src="ozdobnik.png" alt="">
Dzięki temu czytnik ekranu pominie nieistotny element.
Wniosek egzaminacyjny
Aby dodać obrazek zgodnie z zasadami dostępności i WCAG, należy wskazać atrybut alt.