Link

Egnet til:

• å lenke til en ny side internt eller eksternt
• å lenke til et annet sted på siden
• å åpne faner eller laste ned filer

Uegnet til:

• handlinger på siden som for eksempel «Lagre» eller «Send inn». Da skal du normalt bruke InlineButton i stedet
• å plassere i liste med flere lenker. Bruk istedet LinkGroup

Teknisk dokumentasjon

Gå til Link i Storybook for tekniske detaljer. 

Varianter

Vanlig lenke

En standard lenke kan brukes både i brødtekst og kan stå for seg selv. 

Ekstern lenke

Når vi tar brukeren til en ekstern side, skal vi alltid bruke external-ikonet.

Lenke med ikon

Ikonet ligger på venstre side og er et funksjonelt tillegg som forteller brukerne hva de får når de klikker på lenken. Ikonet skjult for en skjermleser fordi det er å betrakte som pynt.

Hvordan bruke komponenten 

Retningslinjer for lenkeatferd – samme vidu eller ny fane

Hovedregelen er at lenker skal åpnes i samme vindu. Når lenker åpnes i samme vindu, sikrer vi en konsekvent og forutsigbar brukeropplevelse som viderefører brukerens egne lenkeinnstillinger i nettleseren.

Når bør lenken åpnes i en ny fane eller nedlastning?

• Hvis brukeren risikerer å miste innhold når de klikker på lenken. Eksempel: Ved utfylling av skjema.
• Hvis du lenker til innhold som brukeren trenger for å gjennomføre en oppgave. Eksempel: Veiledning.

Lenker som åpnes i en ny fane må være tydelig markert med (åpnes i ny fane) i slutten av lenketeksten.

Tekst i komponenten

Gode lenker er selvforklarende og forteller hvor du havner når du trykker på dem. Se for deg at lenketeksten skal leses av en skjermleser når du skriver den. Lenketeksten skal gi mening når den leses isolert, uavhengig av om den er en del av en setning, meny eller liste.

Prinsipper for lenketekster

• Bruk de viktige ordene (triggerord) tidlig i lenketeksten
• Vi bruker aldri «Klikk her», «Se her» og «Les mer» som hele lenketeksten
• Alle lenker på samme side må ha unike lenketekster
• Blir lenken blir åpnet i en ny fane, skal det alltid stå tydelig i parentes: (åpnes i ny fane)

Les mer om prinsipper for lenketekster i Skatteetatens skriveregler.

Universell utforming  

• Sjekk rådene om kontrastfarger og innhold i lenker. 
• En lenke skal ha minst 2 ulike visuelle «hint» for å skille det fra vanlig tekst. Hos oss bruker vi blå farge og understreking som standard.
• Lenketekst mot bakgrunnsfargen må ha et kontrastforhold på minst 4.5:1 for liten tekst, mens for stor og fet tekst er kontrastforholdet på 3.0:1. Stor tekst er definert som større enn 24 piksler høy eller minst 19 piksler høy i fet skrift.
• Lenketeksten eller alternativ tekst (grafisk lenke) skal tydeliggjøre hva som er målet til lenken.