nl-design-system / backlog

Central product backlog of the NL Design System.
European Union Public License 1.2
7 stars 1 forks source link

Skip link #74

Open usethetics opened 3 years ago

usethetics commented 3 years ago

Naam

Skip link

Link naar GitHub Discussion

usethetics commented 3 years ago

A first tab on the keyboard commonly exposes a visual indicator allowing a user to activate the link. Similarly, a skip-link is commonly announced by screenreaders at the start of a document.

macedvisioned commented 3 years ago

How to define a good skiplink to your website or webformpage?

WCAG description, succescriterium 2.4.1 https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-skip.html Design tips https://webaim.org/techniques/skipnav/ https://css-tricks.com/how-to-create-a-skip-to-content-link/ Nice usable skiplink how the BBC uses it. https://a11y-101.com/development/skip-link Use when: always, read more on this website https://knowbility.org/blog/2019/skip-links/ why you need to use the skiplink. Don't use: not applicable

**Skiplink code snippet**
<!--Skiplink-->
<h2>Skiplink to go to the maincontent</h2>
<a href="#subheader" class="bypass" tabindex="0">Go to maincontent</a>
<!--end main-->