Czy powinienem używać nav lub ul

Question

Robię menu nawigacyjne, czy powinienem używać elementu <nav> lub elementu <ul>?

Jeśli użyję nav, będę musiał użyć shiv, aby działał w różnych przeglądarkach.

Jeśli tak, jaka jest korzyść z używania nav w stosunku do ul?

EDIT:

wiem można umieścić ul w nav moje pytanie jest dlaczego używać nav w ogóle?

Answer 1

Nie należy się mylić z <nav> i <ul>. Oba mogą być używane razem w menu nawigacyjnym.

Nav to tag HTML5. Jeśli tworzysz coś w HTML5, możesz użyć <nav>, ponieważ nie ma żadnych ograniczeń, ale nie wszystkie przeglądarki wyrenderują to poprawnie.

<nav> 
    <ul> 
     <li><a href="default.asp">Home</a></li> 
     <li><a href="news.asp">News</a></li> 
     <li><a href="contact.asp">Contact</a></li> 
     <li><a href="about.asp">About</a></li> 
    </ul> 
</nav> 

1. Read about Html 5

Ul tworzy listę nieuporządkowaną. Nieuporządkowane oznacza, że ​​pozycje na liście nie będą w żadnej określonej kolejności. Możesz zagnieździć element ul wewnątrz nav, aby umieścić linki.

Przeczytaj więcej o znacznikach HTML i ich działaniu here.

<ul> 
    <li><a href="default.asp">Home</a></li> 
    <li><a href="news.asp">News</a></li> 
    <li><a href="contact.asp">Contact</a></li> 
    <li><a href="about.asp">About</a></li> 
</ul> 

Spowoduje to utworzenie paska nawigacyjnego, w którym należy umieścić kilka stylów CSS, aby wyglądał lepiej.

Powyższy kod wygeneruje taki sam wynik. Jedyna różnica polega na tym, że nav informuje przeglądarkę, że ten element służy celom nawigacyjnym.

Answer 2

Element jest semantycznie bardziej szczegółowy, więc ogólnie lepszym wyborem. Na przykład wyszukiwarka zrozumie, że zawarte w niej linki reprezentują nawigację, a nie prostą listę linków (które mogą być polecanymi postami lub powiązanymi przedmiotami itp.).

Answer 3

to semantyczny element html5, który został wprowadzony, aby podkreślić, że ten kod jest nawigacją Twojej strony. W przypadku "normalnych niesemantowych" wyszukiwarek nie ma różnicy, że używasz ul lub nav. Zrozumią obydwa bez problemów. W tej chwili używanie tych elementów semantycznych nie daje żadnej realnej korzyści.

Bądź ostrożny, używając elementów html5 zrywa IE, więc musisz je "zarejestrować", więc IE rozpoznaje je jako elementy html stylible.

Answer 4

Należy zazwyczaj używają listę wewnątrz <nav> tak, jak w przykładzie:

<nav> 
    <ul> 
    <li>...</li> 
    </ul> 
</nav> 

• http://html5doctor.com/nav-element/

Answer 5

Zależnie od przypadku, ale przez większość czasu będziesz używając obu.

<nav> 
    <ul> 
     <li><a href="#">item1</a></li> 
     <li><a href="#">item2</a></li> 
     <li><a href="#">item3</a></li> 
     <li><a href="#">item4</a></li> 
     <li><a href="#">item5</a></li> 
    </ul> 
</nav> 

<!-- Or just links --> 

<nav> 
    <a href="#">Item</a> 
    <a href="#">Item</a> 
    <a href="#">Item</a> 
</nav> 

Obie są semantycznie poprawne.

Answer 6

Jeśli chcesz korzystać z , ale unikaj problemów z przeglądarkami, które go nie obsługują, najprostszą rzeczą do zrobienia jest niestosowanie do niego jakiejkolwiek stylizacji i zawijanie go wokół stylu div.

<nav> 
    <div class="nav"> 
     <ul> 
      <li><a href="?">List Item Link</a></li> 
      <li><a href="?">List Item Link</a></li> 
      <li><a href="?">List Item Link</a></li> 
     </ul> 
    </div> 
</nav> 

Answer 7

tylko moja opinia, chciałbym użyć ul po prostu dlatego, że IE 6 i 7 mają jeszcze spory udział w rynku, i wiem, że nie będzie musiał skakać przez obręcze, aby uzyskać ul pracować . Na razie jednak jest prostsze.

Answer 8

obu nav i ul elementy mogą być wykorzystane do tworzenia menu w HTML5,

• Element nav komunikuje, że mamy do czynienia z dużym blokiem nawigacyjnym
• Lista komunikuje, że linki wewnątrz tej nawigacji blok tworząc listę elementów

jednak można używać zarówno nav i uL w tworzeniu menu

<nav> 
<ul> 
    <li>item 1</li> 
    <li>item 2</li> 
</ul> 
</nav> 

To do ciebie, czy wybrać nav lub ul