[terra-application-header-layout] Skip-to-Content button appears after toggle menu in focus order

[neilpfeiffer]

Feature Request

Description

The skip-to links are a key part of accessibility features when users that use keyboard navigation to interact with websites and applications. An application built with the Terra-Application-Layout component, users have issues because the Skip-to-Content link does not always appear as the first interactive element for keyboard users, when the application is in a small viewport (mobile + tablet) the toggle menu (shows and hides the left drawer) is the first navigation element and appears before the skip-to link.

Proposal

• Move the skipToContentButton so that it is the first interactive element and will come before the toggle menu button if one is presented, so that it always appears first for all viewports.

Additional Context / Screenshots

Documented criteria: HNCONSUMER-26017

Full Tech Design of related issues compiled here: consumer-framework-tech-designs / spikes / HNCONSUMER-28288: Investigate accessibility issues with navigation.md

@ Mentions

Will be contribution from Consumer development team