Implementation
Implementation
The Skip link is a block-level element.
Ensure focus is programmatically moved
The link must properly move focus to the targeted area.
For example, using a matching HTML ID: <a href="#main-content">Skip to main content</a> points to <main id="main-content">.
The historical hack of using JavaScript and adding tabindex="-1" to non-interactive target elements is no longer necessary.
DOM order
Place the skip link before all other page content, ideally immediately after <body> tag. However, if a global alert is active, place the skip link directly after the global alert/s so users don’t accidentally bypass important information.
Don’t place the skip link inside a landmark region like <nav> or <header> (Leber, 2001 and GOV.UK Design System, n.d.).