Move label in header to from list to nav

Move the 'Navigation menu' label from the `<ul>` to the parent `<nav>` element.

This has previously been flagged as a 'possible misuse of `aria-label`.'

According to WAI ARIA Practises 1.2 [2], it's recommended to label navigation regions, especially as 'if a page includes more than one navigation landmark, each should have a unique label' [3].

Lists can optionally be labelled, but this is only '_potentially_ beneficial for users of screen readers that support both list names and navigation among lists on a page'.

Applying the label to both the list and the parent navigation could be noisy – "Potentially a source of distracting or undesirable screen reader verbosity, especially if nested within a named container, such as a navigation region."

The provided examples [4] also apply the label consistently to the navigation region (albeit using `aria-labelledby`)

[1]: #1340 (comment)
[2]: https://www.w3.org/TR/wai-aria-practices-1.1/#naming_role_guidance
[3]: https://www.w3.org/TR/wai-aria-practices-1.1/#aria_lh_navigation
[4]: https://www.w3.org/TR/wai-aria-practices-1.1/examples/landmarks/navigation.html

src/govuk/components/header/template.njk

@@ -55,8 +55,8 @@
     {% endif %}
     {% if params.navigation %}
     <button type="button" class="govuk-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="{{ params.menuButtonLabel | default('Show or hide navigation menu') }}">Menu</button>
-    <nav>
-      <ul id="navigation" class="govuk-header__navigation {{ params.navigationClasses if params.navigationClasses }}" aria-label="{{ params.navigationLabel | default('Navigation menu') }}">
+    <nav aria-label="{{ params.navigationLabel | default('Navigation menu') }}">
+      <ul id="navigation" class="govuk-header__navigation {{ params.navigationClasses if params.navigationClasses }}">
         {% for item in params.navigation %}
           {% if item.text or item.html %}
             <li class="govuk-header__navigation-item{{ ' govuk-header__navigation-item--active' if item.active }}">

src/govuk/components/header/template.test.js

@@ -121,18 +121,18 @@ describe('header', () => {
       const $ = render('header', examples['with navigation'])
 
       const $component = $('.govuk-header')
-      const $list = $component.find('ul.govuk-header__navigation')
+      const $nav = $component.find('nav')
 
-      expect($list.attr('aria-label')).toEqual('Navigation menu')
+      expect($nav.attr('aria-label')).toEqual('Navigation menu')
     })
 
     it('allows navigation label to be customised', () => {
       const $ = render('header', examples['with custom navigation label'])
 
       const $component = $('.govuk-header')
-      const $list = $component.find('ul.govuk-header__navigation')
+      const $nav = $component.find('nav')
 
-      expect($list.attr('aria-label')).toEqual('Custom navigation label')
+      expect($nav.attr('aria-label')).toEqual('Custom navigation label')
     })
 
     it('renders navigation with active item', () => {