Update header navigation label

[paulrobertlloyd]

Description

The header navigation currently has an accessible label of ‘Primary navigation’; ‘navigation’ is superfluous, and will be read aloud as “Primary navigation navigation” by screen readers.

Updated this to ‘Menu’ as:

• There is no secondary navigation
• The equivalent service navigation on GOV.UK uses ‘Menu’

Also removed the role attribute as this role is inherent to the nav element (duplicate roles were once needed, but that’s no longer the case).

Finally, removed the id attribute, as don’t believe this is being used anywhere (we have a few ids in this component, that have removed in other PRs).

Breaking change? Only if you are writing your own HTML. If we want it as part of the header breaking change, and I can rebase it onto the header-breaking-changes branch.

Checklist

• Tested against our testing policy (Resolution, Browser & Accessibility)
• Follows our coding standards and style guide
• CHANGELOG entry

[frankieroberto]

@paulrobertlloyd I think we classify all HTML changes as breaking changes but I'm not 100% sure. Probably makes sense to merge this into the breaking-changes branch - then downstream users could make all the updates at once?

Should we also make the aria 'Menu' attribute value configurable by params? (If only for any services doing translation into other languages)

[frankieroberto]

Good to merge into the breaking changes branch. 👍

Should we also add a param for overriding the default / translation? Could be a follow-up PR?

[anandamaryon1]

With removing the id I wonder whether some users might be relying on that for JS things? And whether there is a way to add it back on? (I don't think so via the macros?)

[paulrobertlloyd]

With removing the id I wonder whether some users might be relying on that for JS things? And whether there is a way to add it back on? (I don't think so via the macros?)

Looking through the commit history, the id was never added for a purpose but seemingly added by convention. Here is the original component markup:

<nav class="c-nav-primary" id="c-nav-primary" role="navigation" aria-label="Primary navigation" aria-labelledby="mainmenulabel">

Arguably you may want to add a skip link to the navigation (though we don’t provide that option or give any recommendations that you should). Maybe that is reason enough to keep it?