Move phase banner inside header to resolve aXe landmark issue

[robertparkinson]

Non breaking implementation so low impact on existing users.
See #1604 for details

[hannalaakso]

Thanks a lot for your work on this @robertparkinson 👍

As discussed in #1604 (comment), some open questions remain around accessibility if the phase banner is moved inside the header. Have you been able to test this approach with users of assistive technologies and were there any findings around how the navigation elements and the skip link were perceived? (Our team also has some accessibility user research coming up so we might be able to test some variations of including the phase banner and the back links inside the header.)

[robertparkinson]

Hi @hannalaakso I have not no as this change should have no impact on a users experience. I specifically chose to only move the phase banner as it doesn't run into the problems of the nav tags mentioned in that link. The tools used by most users from an accessibility point of view should behave the same as they will read out the feedback link in the phase banner even if it is in the header.

I was hoping by making this small change that will remove one of the aXe errors it will help reduce the amount of time spent by testers and projects identifying this issue and either coding around it or getting it signed off as a known issue which is what we had to do.

[vanitabarrett]

Hi @robertparkinson 👋 Thank you for this contribution. There are multiple ways that users of assistive tech may be navigating pages, and we can’t confidently say for certain that this change would have no impact on their experience without testing. We’re planning to include this as part of some upcoming user research our team is planning and work from there.

As a team I think we also want to consider whether this is the right approach technically, as this is probably something we'd be applying to other components, e.g: breadcrumbs, back link. Another potential approach would be decoupling the header component from the <header> element and making it part of the page template rather than fixed to a specific component (like we do for <main>). Obviously, this would be a much bigger change! We have some other header improvements planned, so probably need to consider how this change would fit in with those.

But as @hannalaakso mentioned, please let us know if you do any testing or come across any relevant research!

[owenatgov]

We've decided to close this PR as it's been open for over 2 years following a comment from @vanitabarrett that this isn't something we would want to include in govuk-frontend in its current state. More details on the state of the linked issue: #1604 (comment)