This is a workaround for an IOS/keyboard navigation bug which means focus never really gets to main content when using the skip link, and keyboard-navigation IOS users effectively cannot use the skip link.
It forces focus and a tabindex 0 value on the main content element. It also introduces an <a> as the target for main content, rather than <main>
How to test
This is primarily only testable with the correct hardware: an IOS device & external keyboard.
Load a page.
Navigate to the skip link
Hit ENTER to activate it.
Verify that you have been brought to the main content area (i.e. past main nav/header)
Hit TAB again.
Verify that focus is now on the next available link or focusable element within main content.
NB
It is worth testing with a regular ol' browser via keyboard navigation and mouse click to make sure there is no regression.
It can only really be validated with the correct hardware.
What does this change?
This is a workaround for an IOS/keyboard navigation bug which means focus never really gets to main content when using the skip link, and keyboard-navigation IOS users effectively cannot use the skip link.
It forces focus and a tabindex 0 value on the main content element. It also introduces an
<a>
as the target for main content, rather than<main>
How to test
This is primarily only testable with the correct hardware: an IOS device & external keyboard.
NB