Merking av lenker

Innledning

Lenker er en viktig del av navigasjonen på nett, og måten vi merker dem på påvirker brukeropplevelsen. I denne artikkelen går vi gjennom hvordan vi bør merke lenker og hvilke språk- og designprinsipper vi bør følge. Målet er å skape en mer forutsigbar og tilgjengelig brukeropplevelse.

Eksterne lenker

Eksterne lenker leder brukeren til en annen nettside. Når en bruker klikker på en ekstern lenke, forlater de det opprinnelige nettstedet og åpner innhold fra en annen aktør eller tjeneste.

Det har variert hvordan eksterne lenker blir markert på ulike nettsteder. Noen bruker et ikon for å angi at det er en ekstern lenke, mens andre legger til tekst eller åpner lenken i en ny fane. Det at vi ikke praktiserer dette på samme måte kan skape forvirring for brukerne, spesielt når de ikke får tydelig informasjon om hva som skjer når de klikker på en lenke.

For å skape en forutsigbar og god brukeropplevelse bør vi gi brukeren informasjon om:

• Destinasjonen – hvor lenken fører dem.
• Oppførsel - for eksempel om lenken åpner i ny fane, eller hvis den starter en spesiell handling som telefonsamtale eller e-post.

Språk

Lenketeksten skal beskrive formålet med lenken og da er konteksten viktig. I løpende tekst bør lenken være en naturlig del av setningen og gi mening også når den leses isolert. I en liste eller meny kan lenken stå mer fritt, men den må fortsatt være tydelig og gi brukeren en klar idé om hva de kommer til.

• Unngå “gå til” eller “klikk her” i lenketeksten. Det er allerede tydelig at det er en lenke.
• Unngå å bruke ordet “lenke” i lenketekster. Du risikerer da at skjermlesere oppgir “lenke” flere ganger.
• Ikke bruk kun "Les mer" som lenketekst. Ta med konteksten i lenketeksten, for eksempel “Skattemeldingen kan du lese mer om hos Skatteetaten”
• Bruk så korte lenketekster som mulig. Det kan være vanskelig for folk å lese lange tekster med underlinje, særlig når en lenke bryter over flere linjer.
• Ikke bruk lenkens adresse (URL) som lenketekst. Det er slitsomt for folk som bruker skjermlesere å få adressen lest opp tegn for tegn.
• Pass på at du ikke har flere lenker med samme lenketekst på samme side. Det blir vanskelig for folk som bruker skjermleser eller leselist når lenkene blir vist i en egen lenkeliste. Unntaket kan være hvis det er flere lenker som går til samme URL-adresse.

Lenkeliste i skjermlesere

Skjermlesere lar brukere navigere gjennom en liste over lenker. Derfor må lenketekster gi mening alene, uten ekstra kontekst. Legg det viktigste tidlig i lenketeksten for å gjøre det tydelig hva formålet med lenken er.

Design og opplevelse

Unngå at lenker blir åpnet i ny fane

Vi sikrer en forutsigbar brukeropplevelse når lenker åpnes i samme fane. Da videreføres brukerens egne lenkeinnstillinger i nettleseren. Flere bruker Tilbake-knappen i nettleseren hvis lenken ikke førte dit de trodde, men det fungerer ikke når lenken blir åpnet i ny fane.

Det finnes likevel noen unntak, der lenken bør åpnes i ny fane:

• Hvis systemet må logge ut brukeren når det navigeres til en annen side, og det er hensiktsmessig å unngå utlogging.
• Når brukeren er midt i en prosess og risikerer å miste innhold ved å klikke på lenken. Ny fane bør vurderes hvis systemet ikke klarer å lagre brukerens inndata.

For disse unntakene bør vi unngå bruk av ikon, men heller skrive det som en del av lenketeksten. For eksempel Søk om støtte hos Nav.no (åpnes i ny fane).

Vi anbefaler å skrive “åpnes i ny fane” som en del av lenketeksten. Ikke alle kombinasjoner av nettlesere og skjermlesere gir brukeren beskjed om at lenken blir åpnet i ny fane, selv om lenken inneholder target="_blank".

Utseende

UU-tilsynet har informasjon om lovpålagte krav for utseende på lenker (uutilsynet.no). Brukeren må kunne identifisere alle lenker uavhengig av situasjon, evner og innstillinger på utstyret som benyttes.

Unngå “ekstern-lenke”-ikon

Det er etablert et ikon som betyr “ekstern lenke”, men dette ikonet blir ofte forstått som “Åpnes i ny fane”. En miniundersøkelse vi utførte i arbeidet med denne artikkelen viste at selv erfarne designere var usikre på betydningen av ikonet. Halvparten tolket ikonet som “åpnes i ny fane”, mens resten mente det betydde “ekstern lenke”. Dette viser at ikonet i seg selv ikke er entydig, og kan ikke bli brukt som eneste måte å formidle funksjonen på.

Bruk av ikonet kan i verste fall villede brukeren, spesielt hvis lenken ikke faktisk åpnes i en ny fane. Hvis det primære målet er å indikere at en lenke leder til en ekstern side, er det mer effektivt å kommunisere dette i lenketeksten i stedet for å stole på et ikon alene.

Hvis lenketekstene blir veldig lange, eller lenkelister gjentar informasjon om eksterne lenker, kan det være fristende å bruke ikoner i stedet. Før du tar dette valget, vurder om bruker faktisk trenger denne ekstra informasjonen.

Hvis du likevel bruker ikonet, vær oppmerksom på at det kan bli tolket ulikt av forskjellige brukere, siden det blir brukt både for eksterne lenker og åpne i ny fane.

Dersom ikonet inneholder meningsbærende informasjon som ikke kommer frem i lenketeksten, skal dette formidles i ikonets alternativ tekst.

Hvor fører lenken

Det er ikke alltid nødvendig å merke at en lenke er ekstern. Ofte fremgår det tydelig av konteksten. Hvis lenketeksten for eksempel er “Flekkefjord kommune”, vil brukeren naturlig forvente at lenken leder til kommunens nettsider. I slike tilfeller er det unødvendig å legge til ekstra informasjon.

Dersom lenken viser til et spesifikt innhold hos kommunen, som for eksempel informasjon om parkering, kan lenken være "Parkering i Flekkefjord kommune" eller "Parkering (flekkefjord.kommune.no)" Det viktigste er at brukeren ikke blir overrasket over hvor de havner etter å ha klikket.

Lenke til filer

Gjør det tydelig at lenken peker til en fil:

• Opplys om filtype

  • skriv filtype som en del av lenketeksten
  • ikke bruk ikon alene for å vise filtype

• Gjerne vis filstørrelse som en del av lenketeksten, spesielt hvis filstørrelsen er stor. Det gir brukeren bedre kontroll, siden de da kan vurdere om det passer å laste ned filen nå. For eksempel hvis de bruker mobildata, har dårlig nettforbindelse eller lite lagringsplass.

Filer som skal lastes ned

Dersom lenken fører til en fil som skal lastes ned istedenfor å åpnes i nettleseren, bør vi sørge for å ha med attributten download med filnavn som indikerer filtype, f.eks. download="årsrapport.docx".

Vær oppmerksom på at dersom filtypen er av PDF, har de fleste nettlesere innebygd støtte for å vise PDF-filer i en forhåndsvisning, uavhengig av om download-attributtet er der eller ikke. Dette er også avhengig av brukerens innstillinger i nettleseren.

Relevante kilder

• WCAG 2.1: 2.4.4 formål med lenke (i kontekst) (A)
• WCAG 2.1: 2.4.9 Formål med lenke (bare lenke) (AAA)
• WCAG 2.1: 3.2.5 Endring på anmodning (AAA)
• UU-tilsynet om løsningsforslag for lenker
• Skjermlesere informerer ikke om at lenker åpnes i ny fane - undersøkelse av Powermapper

Rediger denne siden på Github (åpnes i ny fane)