Zapoznaj się z 4 zasadami dostępności
Jesteś tutaj:Strona główna / WCAG 2.0 Zasada 1: Percepcja / Wytyczna 1.3 Możliwość adaptacji / 1.3.2 Zrozumiała kolejność (A)
1.3.2 Zrozumiała kolejność (A) - WCAG 2.0
Wygląd każdej strony internetowej opisany jest odpowiednio w plikach CSS. Musimy pamiętać, że przekładając wizualnie elementy na stronie przy pomocy właściwości arkuszy styli musimy zadbać o to, aby miały sens po wyłączeniu styli lub gdy użytkownik korzysta z programu czytającego czy przemieszcza się po treści przy pomocy klawiatury.
Sekwencja nawigacji oraz czytania, określona za pomocą kolejności w kodzie HTML musi być logiczna i intuicyjna.
Zobaczmy przykład błędnej kolejności, zaczerpnięty z prawdziwego serwisu internetowego.
Widok na stronie (wizualnie jest wszystko w porządku)
Bieżące logowanie: 13.03.2012, godz. 13:59,
Ostatnie udane logowanie: 13.03.2012, godz. 13:28,
Ostatnie nieudane logowanie: 12.03.2012, godz. 13:15,
Widok HTML i CSS
<style>
.ul_txt {float:left; list-style-type:none;}
.ul_val {float:left; list-style-type:none;}
</style>
<ul class="ul_txt">
<li>Bieżące logowanie:</li>
<li>Ostatnie udane logowanie:</li>
<li>Ostatnie nieudane logowanie:</li>
</ul>
<ul class="ul_val">
<li>13.03.2012, godz. 13:59,</li>
<li>13.03.2012, godz. 13:28,</li>
<li>12.03.2012, godz. 13:15,</li>
</ul>
Na powyższym przykładzie doskonale widać, jak można użytkownikowi np. niewidomemu, korzystającemu ze screen readera skutecznie utrudnić prawidłowe odczytanie i zrozumienie informacji. Jak już wspominaliśmy program czytający przetwarza stronę www liniowo (upraszczając: tak, jakby wyłączyć w przeglądarce style). Zatem najpierw odczyta listę: Bieżące logowanie, Ostatnie udane logowanie, Ostatnie nieudane logowanie, a dopiero potem daty wraz z godzinami. Czyli w kolejności w jakiej zostały umieszczone w kodzie HTML.
Powrót do: Wytyczna 1.3 Możliwość adaptacji
Dołącz do nas