A link for keyboard users to jump past the header and navigation to the main content.
Mirrors SkipLink from @digdir/designsystemet-react.
Html.body []
[ SkipLink.view { href = "#main-content" } [] [ Html.text "Hopp til hovedinnhold" ]
, siteHeader
, Html.main_ [ Attr.id "main-content", Attr.tabindex -1 ] [{- … -}]
]It's invisible until focused, so put it first on the page where the first Tab reveals it.
<SkipLink href="#main">Hopp</SkipLink> → SkipLink.view { href = "#main" } [] [ … ]
An
<a class="ds-skip-link">to an element on the same page.hrefis"#"plus the target'sid. Give the targettabindex="-1"so it can take focus.