HTML5 nav element inside footer
Asked Answered
D

4

24

I've read in several places that there's no need to use <nav> inside <footer> when all you're linking to is copyright, terms and conditions, etc.

However, a site I'm working on has these links in the footer: News, Careers, Privacy. Obviously Privacy fits the above description for not using <nav>. But News and Careers - although they're obviously not being given as much weight as items in the main nav at the top - are significant areas of content, which aren't linked to from elsewhere. Would these justify the use of <nav>?

My guess is yes, but I'm a HTML5 newbie, so I thought I'd ask for a second opinion!

Disregard answered 24/7, 2012 at 19:29 Comment(2)
possible duplicate of Links inside HTML5 footer element (nav and aside?)Mize
Almost. "The <nav> element is intended to mark up 'major' navigation blocks" - blocks, plural - so it's not just for the primary nav. "In particular, it is common for footers to have a short list of links to various pages of a site, such as the terms of service, the home page, and a copyright page. The footer element alone is sufficient for such cases." Fine. However, News and Careers are plainly not in this category - hence me posting a new question. There may be issues with the IA / design here, but all that's been signed off - I've just got to mark it up right :)Disregard
D
27

As the W3C specification states

Not all groups of links on a page need to be in a <nav> element — the element is primarily intended for sections that consist of major navigation blocks. In particular, it is common for footers to have a short list of links to various pages of a site, such as the terms of service, the home page, and a copyright page. The footer element alone is sufficient for such cases; while a <nav> element can be used in such cases, it is usually unnecessary.

Note the very last sentence - even if it's not recommended you can use the <nav> element even for the TOS, Privacy etc.

In your case, when you have other significant navigation elements(Careers, News), I think it's totally valid and semantically correct to use the <nav> element in your <footer>

Denominate answered 24/7, 2012 at 19:39 Comment(1)
Note:- it is recommended that additional <nav> elements are required to be distinguishable by the presence of an aria-label, or aria-labelledby.Dozier
K
6

Investigation

According to this French article:

<nav> :

The <nav> element is a section of navigation links. It can be used for navigation, but also for other parts of the document to list the internal navigation links.

<footer> :

The footer element represents the footer, or the conclusion of a section. It places information about the author, legal notices, or a pagination navigation (in combination with <nav>), a reminder logo, contact information, publication dates.

Conclusion

You can combine <nav> with <footer>.

Keble answered 24/7, 2012 at 19:36 Comment(1)
I agree. I think the spec's definition of what should go in the footer doesn't always tally with what gets placed there before HTML building starts. And while most advice on this says "you can put a <nav> inside the <footer>, you probably shouldn't", clearly that means there are legitimate reasons for sometimes doing this.Disregard
S
1

It's all about semantics. The way I look at it is this: how can I convey as much (and as accurate) meaning as possible using just the HTML. If someone were reading just the source code of my site (using a screen reader, for instance), how would I want it to be organized? I'm certainly no expert, but it sounds to me like your scenario would be a perfectly valid use of <nav> inside <footer>

Suppression answered 24/7, 2012 at 19:36 Comment(0)
P
0

From MDN web docs:

Usage notes: It's not necessary for all links to be contained in a <nav> element. <nav> is intended only for major block of navigation links; typically the <footer> element often has a list of links that don't need to be in a <nav> element.

If you take that at face value, although not unacceptable to do otherwise, it would seem MDN is trying to steer folks away from putting a <nav> in the <footer>.

Phio answered 8/12, 2022 at 22:44 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.