Home Kontakt Jovanor ...">

Is it better to use <nav> with <li> <a> or just <nav> <a>?

<nav> <a href="#">Home</a> <a href="#">Kontakt</a> <a href="#">Jovan</a> </nav> 

or

 <nav> <ul> <li> <a href="#">Home</a> </li> </ul> </nav> 

What's better? When the only nav and <a> or last. The first should not be placed in CSS <inline>

+4
source share
4 answers

From my point of view, the first solution is the most enjoyable, since your menu is navigation, it uses less code and (as far as I know), and is also useful for seo as a second solution.

 <nav> <a href="#">Home</a> <a href="#">Kontakt</a> <a href="#">Jovan</a> </nav> 

If you use other elements inside nav , such as ul , ol , h1 , table (!) Or something else, it should be semantically correct. Therefore, if your menu is a list, simply use ul . If you want to add elements inside to simplify the style, use div and / or span .

Update

After some discussion in the comments: In most cases, the menu is a list, then the ul method is a great choice. If you use ul , it’s easier for screen readers to navigate according to Steve

0
source

Following the W3 specification on <nav> , any flow content is acceptable. And not that it matters a lot, but both W3 and MDN demonstrate its use with <ul> (and, for what it's worth, W3 even includes the heading above <ul> for the section heading).

Personally, I think that <ul> describes a few links better than just solo <a> s, but that’s really the way you want to do it. <ul> also has more semantics for multiple links than just floating anchors.

+4
source

Personally, I use a list. I like it better, as it can be more reliable if you need it. For example, if you need inlaid borders for your style, it's easy to create a light border on <a> and a darker border on <li> to create this effect.

However, at the same time, the list method can be created as simply as if you hadn’t used anything except <a>

Besides ... There is no discernible speed between them.

+3
source

It is completely up to you. The <nav> element should contain only the main navigation, it does not have to be in the list. But a list is commonly used as the navigation menu tends to be a list of items.

So, if your navigation contains a list of items, then this should probably be a list.

+1
source

All Articles