Gå til hovedinnhold
KOMPONENTER

Accessibility

Entur sitt designsystem er utviklet for å være universelt utformet. Det betyr at det skal kunne fungere for alle. Her finner du noen ekstra komponenter for å forenkle dette arbeidet i løsningene våre også.

Komponenter

SkipToContent

NavnTypePåkrevd?Default-verdiBeskrivelse
childrenReactNode

Lenketeksten

mainIdstring "main-content"

IDen til hovedinnholdsområdet

SkipToContent er en snarvei for brukere av tastaturnavigasjon for å forenkle veien til sidens hovedinnhold. Den synes ikke for vanlige brukere, men vil vises med en gang man trykker "tab" for å navigere seg nedover siden.

Den plasseres så tidlig som mulig i dokumentet. Du kan sende inn id-en til sidens hovedinnhold via mainId-propen, og en tekst som sier noe slikt som "Gå til hovedinnhold" i teksten.

Vi bruker den på denne siden også - test den ut med å trykke "tab"!

VisuallyHidden

NavnTypePåkrevd?Default-verdiBeskrivelse
asstring | ComponentClass<any, any> | FunctionComponent<any> "span"

HTML-elementet eller React-komponenten som lager elementet

childrenReactNode

Innhold for skjermlesere

VisuallyHidden brukes for å gi skjermlesere en tekstlig beskrivelse av et visuelt element. Det er den logiske motsetningen til aria-hidden="true", og brukes ofte for å gi informasjon til skjermlesere der man ikke kan (eller vil) vise denne informasjonen til alle brukere.

Alle de kule utviklerne bruker VisuallyHidden-komponenten, asså.