Why do almost everybody I see use this kind of structure when creating some sort of navigation
<ul>
<li><a href="/link1">link1</a></li>
<li><a href="/link2">link2</a></li>
<li><a href="/link3">link3</a></li>
</ul>
instead of this?
<div>
<a href="/link1">link1</a>
<a href="/link2">link2</a>
<a href="/link3">link3</a>
</div>
What are the advantages of the first one compared to the last one? Since so many are doing it this way.
By using a ul , it's very clear where the beginning and where the end is, and that's especially important for navigation menus, because a navigation entry often only make sense in comparison to all the others (finding the right link for your goal is often only possible by checking all available navigation links and ...
In the past, nav was used to “contain” a list of navigation links. Now the nav element exists and, by definition, groups the links. So the ul is unnecessary.
An unordered list typically is a bulleted list of items. HTML 3.0 gives you the ability to customise the bullets, to do without bullets and to wrap list items horizontally or vertically for multicolumn lists.
If you Google around on whether or not you should use lists as the markup for navigation on websites, you'll find no debate. Every article suggest that yes you should. The vast majority of tutorials you read will use lists for navigation. The vast majority of templates you see will use lists for navigation.
It's about semantic use of html. You have a list of links, so you use the appropriate html element which in this case is either a <ul>
(if order doesn't matter semantically) or an orderer list <ol>
(if order is meaningful, for example if you have a month navigation listing January to December).
https://en.wikipedia.org/wiki/Semantic_HTML
http://www.html5rocks.com/en/features/semantics
In short, because the content is a list of links, so we write markup that reflects that.
It gives us more options for styling the links (since the additional markup gives us more elements to play with), and it lets us tell them apart without access to visual styling.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With