Overslaan-link
Het eerste focusbare ding op de pagina: een link naar de inhoudslandmark, buiten beeld tot hij de focus heeft.
Demo
Eigenschappen bewerken
Wijzig een waarde en pas die toe; de demo wordt met de nieuwe waarden getoond. Een geweigerde waarde wordt bij het veld gemeld en de demo houdt de beginwaarde.
Eigenschappen
| Eigenschap | Type | Standaard | Toegestane waarden | Omschrijving |
|---|---|---|---|---|
target | string | verplicht | Het id van de inhoudslandmark waar de link naartoe gaat. | |
label | string | verplicht | De linktekst, in de taal van de pagina. |
Gebeurtenissen
Dit component verstuurt geen gebeurtenissen.
Toetsenbord
| Toetsen | Doet |
|---|---|
| Tab | Bereikt de link als eerste op de pagina; hij wordt zichtbaar. |
| Enter | Verplaatst de focus naar de inhoudslandmark. |
Toegankelijkheid
- Buiten beeld door een transform, niet display: none, zodat hij in de Tab-volgorde blijft en bij focus verschijnt.
- In deze demo is de link zichtbaar wanneer hij de focus heeft: tab de demo in.
Waarom zo
Een toetsenbordgebruiker bereikt de inhoud zonder op elke pagina door de kop en het menu te tabben. De link is de eerste regel van de body en wordt zichtbaar bij focus, zodat een ziende toetsenbordgebruiker ziet waar de focus is. Het doel, <main id="content" tabindex="-1">, neemt de focus zonder eigen omlijning.
Verwijzingen
- rule 15 item 1
Gebruikt
Dit component gebruikt geen ander component.
Gebruikt door
Nog geen gebruik vastgelegd.
README
skip-link
The first focusable thing on the page: a link to the content landmark, off screen until it has focus.
Change log
- 2026-10-14:
component.json(the manifest: the props now live there) anddemo.php(the demos the inspector and the catalogue page show) added; see docs/architecture/inspector.md. - 2026-10-14: new, from the first line of the body in
header.php.