
WCAG 2.1 – kryterium 1.3.1 – Informacje i relacje: (poziom A) część 2
- Przejdź do artykułów z tagiem akademiaWCAG
- Przejdź do artykułów z tagiem dostępność cyfrowa
- Przejdź do artykułów z tagiem listy
Treść artykułu
Dzisiaj kontynuacja kryterium 1.3.1 WCAG – zajmijmy się listami.
Dlaczego warto grupować elementy i w jaki sposób zrobić?
Odpowiedź jest dość trywialna. Dzięki temu, że dane elementy są zgrupowane, wiemy że należą do pewnej całości. Spodziewamy się, ile elementów w danym zbiorze się znajduje. Struktura ta tworzy nam logiczną całość. Przykłady?
Lista zakupów – już na samym początku wiemy jak duże “przedsięwzięcie” nas czeka.
Lista artykułów na temat dostępności – od razu wiesz, ile masz do przejrzenia i jak dużo czasu musisz (a raczej możesz poświęcić 🙂 ).
Listy możemy mieć numerowane bądź też nie. W jaki sposób je implementujemy?
Po pierwsze – prawidłowa semantyka.
Najpierw decydujemy czy jest to lista numerowana czy nie.
Lista numerowana – <ol>
Lista nienumerowana – <ul>
Każdy kolejny element, potomek listy będzie już naszym elementem listy czyli – <li>.
….
<p>Lista zakupów na piątkowy wieczór</p>
<ul>
<li> Sałata 🙂 </li>
<li> Pieczywo </li>
<li> Woda </li>
</ul>
…
Lista zakupów na piątkowy wieczór
* Sałata 🙂
* Pieczywo
* Woda
Mamy też możliwość użycia listy definicji (<dl>), ale nie jest ona już w pełni wspierana przez wszystkie kombinacje przeglądarek i czytników ekranu. Warto w tym wypadku rozważyć użycie tabeli, o której opowiemy w kolejnym artykule.
Link do szczegółowego opisu listy definicji: https://lnkd.in/dAEeCzxN
Link do opisu rodzajów list: https://lnkd.in/drAu2XVU
Referencja do WCAG: https://lnkd.in/dKcSJw6d

Radosław Stachurski
Accessibility Specialist & WCAG 2.1 Auditor & Quality Assurance
Polecane artykuły
-
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…
-
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…