
WCAG 2.1 – kryterium 1.1.1. – Alternatywa tekstowa (poziom A)
- Przejdź do artykułów z tagiem accessibility
- Przejdź do artykułów z tagiem akademiaWCAG
- Przejdź do artykułów z tagiem dostępność cyfrowa
- Przejdź do artykułów z tagiem inclusive design
Treść artykułu
Nowy rok – nowy krok! Zaczynamy cotygodniową, piątkową serię „zrozumieć dostępność cyfrową na podstawie WCAG 2.1”.
WCAG to zbiór rekomendacji technicznych, które wpływają na dostępność produktu cyfrowego.
Dzisiaj zaczynamy od pierwszego kryterium sukcesu – 1.1.1 Alternatywa tekstowa (Poziom A). O co tutaj chodzi? Zapraszam na pigułkę informacji:
Elementy nietekstowe takie jak ikony i grafiki powinny mieć zapewnioną alternatywę tekstową. Jednak czy wszystkie te elementy powinny posiadać opis? NIE! Jest to najczęstszy błąd popełniany przez zespół wytwórczy – to oni wspólnie z projektantami powinni zdecydować czy dana ikona, grafika wnosi coś do układu treści lub nie. Jest to niezwykle ważny etap projektowania. W jaki sposób możemy to oznaczyć?
a) alt=”” – atrybut wykorzystywany w znaczniku <img> oznaczający element dekoracyjny, który będzie omijany przez technologię asystującą.
b) alt=”mały, czarny pies w okularach w sweterku” – przykład w jaki sposób, możemy opisać element, który zostanie przetworzony przez na przykład czytnik ekranu.
Rady co do tekstów alternatywnych:
– nie używaj słowa: „zdjęcie”, „grafika” – poprawnie zaimplementowany element, otrzyma tę informację od znacznika lub roli na przykład <img>;
– opis powinien być treściowy, czy są jakieś limity…? nie, aczkolwiek pamietajmy o zasadzie „im mniej, tym lepiej”.
Ciekawostka:
– social media, MS Office generują automatycznie opis alternatywny, jeżeli go nie zdefiniujemy w sposób manualny. Nie są idealne, dlatego lepiej je sprawdzić przed publikacją.
Referencja do WCAG: https://lnkd.in/d7B6UdzA
A11y annotation kit: https://lnkd.in/eM2G7rax
Automatyczny generator: https://lnkd.in/d2s3EfGf

Piotr Zrolka
Accessibility expert & CEO
Polecane artykuły
-
10.08.2022Dostępność cyfrowa
SVG… SVG… czym jest SVG
SVG (ang. Scalable Vector Graphics) – to format wektorowego pliku graficznego, który w odróżnieniu do rastrowych jpg, png, gif, składa…
-
30.11.2022Badania
Jak zrobić audyt UX. Część 1 – Teoria, odrobina autokrytyki i parę praktycznych porad…
Dzisiaj wrzucamy na blog temat audytów użyteczności! Pomysł na ten wpis narodził się przy okazji audytu UX naszego bloga. Postanowiliśmy…
-
23.12.2022Dostępność cyfrowa
Dostępność cyfrowa – skąd czerpać wiedzę. Część 1
Dostępność, WCAG 2.1, inkluzywność, projektowanie uniwersalne: niektórzy mówią, że to tożsame pojęcia, ale mylą się… W takim razie skąd można…