Dostępność obrazów i ilustracji na stronie internetowej

7 stycznia 2022
Artykuły

Niemal każdą stronę internetową wyróżnia to, że posiada ona dużą ilość różnego rodzaju obrazów, zdjęć i ilustracji.

Mogą one pełnić jedną z następującą ról:

  1. Informacyjną
  2. Wizerunkową
  3. Dekoracyjną

Rola informacyjna ilustracji

Ilustracje pełniące rolę informacyjną to wszelkiego rodzaju tabele, wykresy itp., które zostały przedstawione nie jako tekst, ale jako ilustracja. To właśnie tego typu grafiki aby spełniać zasady dostępności powinny zawierać opis alternatywny. który bardzo dokładnie opisywałby to co na nich się znajduje. Służy do tego atrybut alt. Należy jednak zaznaczyć, że najlepiej było by gdyby ilustracje posiadające tekst i liczby w ogólne się nie pojawiały a były przedstawione w naturalnej. Zdarzają się jednak sytuacje, że dane tego typu ciężko było by przedstawić w innej formie niż graficzna.

Poniżej znajduje się przykład takiej ilustracji:




Źródło: https://www1.grupappmsa.pl/pl/p/TESA-50600-Tasma-poliestrowa-zielona/1426

Dane techniczne produktu zostały przedstawione w formie ilustracji. Ilustracja nie posiada jednak opisu alternatywnego więc osoba z niepełnosprawnością wzrokową nie jest w stanie zapoznać się z danymi.

W tym przypadku są to bardzo istotne dane więc opis alternatywny powinien zawierać dokładnie to co zostało przedstawione na ilustracji ale w formie tekstowej.

Przykład:


<img src="adres_obrazka.jpg" alt="Ilustracja przedstawia szczegółowe dane produktu. Dane techniczne. Materiał nośnika: PET, Grubość całkowita 80 mikrometrów (...)"/>

Rola wizerunkowa ilustracji

Rolę wizerunkową pełnią przede wszystkim wszelkiego rodzaju logotypy, ,symbole, herby itp.




Źródło: Allegro

Co do zasady nie ma konieczności przedstawiania dokładnego opisu tego co zostało przedstawione na grafikach tego typu. Wystarczy w opisie alternatywnym umieścić informacje, że jest to logo danej firmy.

Przykład:


<img src="adres_obrazka.jpg" alt="Ilustracja przedstawia logo firmy Allegro"/>

Rola dekoracyjna ilustracji

Są to wszelkiego rodzaju grafiki, których celem jest upiększenie strony i sprawienie, że będzie ona atrakcyjna wizualnie. Może to być tło, tekstura lub ilustracja, która nie przedstawia żadnych istotnych treści dla użytkownika.




Źródło: https://www.fotezja.pl/jak-nalozyc-teksture-na-zdjecie

Przykład:


<img src="adres_obrazka.jpg" alt=""/>

W takim przypadku atrybut alt zostaje pusty.

Polecane wideo