Sto facendo un menu di navigazione, dovrei usare l'elemento <nav> o l'elemento <ul> per quello?Devo usare nav o ul
Se utilizzo uno nav, avrò bisogno di utilizzare un shiv in modo che funzioni attraverso i browser.
Se è così, qual è il vantaggio di utilizzare un nav su un ul?
EDIT:
So che si può mettere un ul in un nav la mia domanda è: perché utilizzare un nav a tutti?
Non confondere con <nav> e <ul>. Entrambi possono essere utilizzati insieme per un menu di navigazione.
Nav è un tag HTML5. Se stai creando qualcosa in HTML5 puoi usare <nav> in quanto non ci sono restrizioni, ma non tutto il browser lo renderà correttamente.
<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>
Ul crea una lista non ordinata. Non ordinato significa che gli elementi nell'elenco non saranno in alcun ordine particolare. È possibile nidificare un elemento ul all'interno di nav per posizionare i collegamenti.
Ulteriori informazioni sui tag HTML e su come funzionano 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>
Questo creerà una barra di navigazione che devi mettere alcuni stili CSS per guardarlo meglio.
Il codice sopra riportato produce lo stesso risultato. L'unica differenza è che nav indica al browser che questo elemento è per scopi di navigazione.
L'elemento nav è semanticamente più specifico, quindi generalmente la scelta migliore. Un motore di ricerca, ad esempio, capirà che i collegamenti al suo interno rappresentano la navigazione, piuttosto che un semplice elenco di collegamenti (che potrebbero essere i post consigliati, o articoli correlati, ecc.).
nav è un elemento html5 semantico, che è stato introdotto per indicare che questo codice è la navigazione della pagina. Per i motori di ricerca "normali nonsemantici" non fa differenza se si utilizza ul o nav. Capiranno entrambi senza problemi. Al momento l'uso di quegli elementi semantici non crea alcun vantaggio reale per te.
Attenzione, l'utilizzo di questi elementi html5 interrompe IE, quindi è necessario "registrarli", quindi IE li riconosce come elementi HTML stylable.
Si dovrebbe in genere utilizzare una lista all'interno di un <nav> in ogni caso, in questo modo:
<nav>
<ul>
<li>...</li>
</ul>
</nav>
Dipende il caso, ma la maggior parte del tempo che verrà usato sia.
<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>
Entrambi sono semanticamente corretti.
Se si desidera utilizzare nav ma evitare qualsiasi problema con i browser che non lo supportano, la cosa più semplice da fare è non applicare alcuno stile e avvolgerlo attorno a uno div e uno stile che invece.
<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>
Funzionerà nei browser che non lo supportano? Sempre? – qwertymk
solo la mia opinione, vorrei usare una ul semplicemente per la ragione che IE 6 e 7 hanno ancora una quota di mercato considerevole, e so che non avrò fare i salti mortali per ottenere un ul al lavoro . Per ora comunque, è più semplice.
Entrambi gli elementi nav e UL può essere utilizzato per creare menù in HTML5,
Tuttavia è possibile utilizzare sia NAV e ul nella creazione di menu,
<nav>
<ul>
<li>item 1</li>
<li>item 2</li>
</ul>
</nav>
Spetta a voi scegliere o nav o ul
Sarà meno SEO friendly se non uso nav? In caso contrario, non vedo alcun vantaggio di nav – qwertymk
@qwertymk come ho detto, non c'è alcun vantaggio SEO (al momento) e anche non nel prossimo futuro. – Christoph