Hopp til hovedinnhold

Snarveier til innhold

Brukere må kunne hoppe over gjentatt innhold (som menyer) for å komme til hovedinnholdet.

Oppdatert
Kategori: navigasjon

Snarveier til innhold

Hva er problemet?

For tastaturbrukere er det slitsomt å måtte trykke Tab 20-30 ganger gjennom hovedmenyen på hver eneste side før de kommer til selve innholdet.

Hvordan fikse det?

Legg til en "Hopp til innhold"-lenke ("Skip link") helt øverst på siden. Denne lenken kan være visuelt skjult til den får fokus.

Eksempel på implementering

HTML (øverst i <body>):

<a href="#main-content" class="skip-link">Hopp til hovedinnhold</a>
<!-- ... meny ... -->
<main id="main-content">...</main>

CSS:

.skip-link {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

.skip-link:focus {
  position: static;
  top: 0;
  left: 0;
  background: white;
  padding: 10px;
  z-index: 1000;
}