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.
DĂ„rlige eksemplerGode eksempler

Finn ledige stillinger pÄ arbeidsplassen.no

68 05 99 99 (Mangler formÄl)

Ring oss pÄ 68 05 99 99

Klikk her for Ă„ lese mer om saken hos uio.no

(UnngĂ„ “klikk her” + “Saken” sier ikke noe om hva det gjelder)

Rediger

(sier ingenting om hva som redigeres eller hvor)

Rediger denne siden pÄ github.com

Les mer om merverdiavgift pÄ: https://www.skatteetaten.no/nn/bedrift-og-organisasjon/avgifter/mva (unngÄ url i lÞpende tekst)

Merverdiavgift (skatteetaten.no)

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.

GjĂžr slik

Viser eksempel pÄ lenker med tydelig formÄl og logisk tekst
I eksempelet over kommer det tydelig frem hva formÄlet med lenkene er.

UnngÄ

Viser eksempel pÄ lenker med utydelig formÄl og tekst som ikke gir mening alene
Hvor kommer man nÄr man trykker 'Vis mer' eller 'Lenke til dokument'? Ikke godt Ä si uten mer kontekst.


GjĂžr slik

Viser eksempel pÄ lenker med tydelig formÄl og logisk tekst
I eksempelet over kommer det tydelig frem hva formÄlet med lenkene er.

UnngÄ

Viser lenkeliste der alle lenkene har 'Les mer' som tekst
Se for deg en lenkeliste med artikler der alle har 'Les mer'. Slik ser det ut i en lenkeliste. Ikke godt Ă„ si hvilken artikkel man kommer til.

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Ă„.

Hvilket ikon er for eksterne lenker og hvilket er for Ă„pne i ny fane?

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

Bidragsytere

Sarah Brodwall (Nav), Eivind LÞland-Andersen (Skatteetaten), Trond Ausland (Skatteetaten), Jan Schjetne (Oslo kommune), Stine RÞrvik (Oslo kommune), Roy Halvor Frimanslund (BrÞnnÞysundregistrene), Linn Kamilla DrÄgen (BrÞnnÞysundregistrene), Øyvind Hjartnes (Entur), Chris Lorang (Politiet), Lasse Febakke Straum (Digdir), Tobias Barsnes (Digdir), Marianne RÞsvik (Digdir), Jan Beniamin Kwiek (UU-tilsynet) og Stian Morsund (KS Digital).