Nieuporządkowane listy i dostępność - html, css, accessibility, web-standards

Wiele (najbardziej?) witryny mające na celu zapewnienie dostępności i zgodności ze standardami wykorzystują listy nieuporządkowane do nawigacji. Czy to sprawia, że ​​strona jest bardziej dostępna, czy po prostu dostarcza przydatnych elementów do stylizacji?

Nie przejmuję się nimi i używamlisty nieuporządkowane w ten sposób. Po prostu, gdy usuwam stylizację ze strony, aby spróbować ocenić jej dostępność, uderza mnie, że równie dobrze może to być zwykłe linki. Skąd to pochodzi?

Odpowiedzi:

Najlepszym znacznikiem nawigacji w witrynie byłyby znaczniki HTML, które najlepiej reprezentują to, czym jest Twoja nawigacja.

Czy twoja nawigacja jest listą, która nie ma logicznego porządku? Jeśli tak, to <UL> byłby dobrym wyborem. Czy twoja nawigacja jest bardziej kreatorem, który wymaga kroków, czy może w kolejności alfabetycznej lub numerycznej? Jeśli tak, to <OL> może być lepszym wyborem.

Renderowanie nawigacji jako zwykłe linki jak wspominasz, nie zapewnia żadnej semantycznejznaczenie; sugerowałoby, że twoja nawigacja jest zdaniem do przeczytania. Podając swoje linki na liście, podajesz podpowiedź, jak interpretować tę serię słów powiązanych z hipertekstem.

Podobnie jak inne plakaty zauważyli, semantycznie,<ul> s świetnie nadają się do menu, ponieważ są zwykle tylko listą linków. Ale to, co naprawdę lubię w używaniu list do menu, to semantyczna i wizualna logika zagnieżdżania, którą oferują. Na przykład:

<ul id="mainMenu">
<li>Home</li>
<li>Something</li>
<li>Something Else</li>
<li>Current section
<ul>
<li>A Subsection</li>
<li>Another subsection</li>
<li>More!
<ul>
<li>We go deeper</li>
<li>Who knows where it ends</li>
</ul>
</li>
<li>Back up one step</li>
</ul>
</li>
<li>And another step</li>
<li>All done!</li>
</ul>

Umieść to w swojej przeglądarce i wypal to, a tyzauważy, że każdy poziom nie tylko jest wcięty dalej w prawo, ale również renderuje się z innym pociskiem w stylu. I to nawet bez dodawania CSS. Muszę kochać te listy!

Gdy styl zostanie usunięty, pociski sprawiają, że sekcja nawigacji staje się bardziej oczywista. A jeśli używasz <div>s i <span>s do nawigacji, usunięcie stylu spowoduje powstanie linków, które są tuż obok siebie.

Nawigacja to w zasadzie lista linków, więc oznaczenie jej jako listy wydaje mi się poprawne.

Myślę, że przynajmniej częściowo ma to również związek z seo, biorąc pod uwagę, że html nie obsługuje (jeszcze) żadnego rodzaju elementu listy nawigacji.

Użycie UL (lub OL) daje grupowanie semantycznetwoja nawigacja, zwłaszcza gdy masz zagnieżdżone sekcje nawigacyjne, i mówi, że ta grupa łączy ma jakąś logiczną spójność i hierarchię, przynajmniej taka jest jedna z teorii, które przeczytałem.

Drugą zaletą, o której wspomina Jeremy, jest to, że gdy style są wyłączone, renderowanie poza pudełkiem ma sens.

Myślę, że jest to zrobione dla struktury dokumentu. Użyłem znaczników UL lub div, chociaż zawsze odnosiłem większe sukcesy z UL.

Pozdrowienia,
Szczery