Hva er et tilgjengelig nettsted, og hvorfor er det viktig?

Tilgjengelige nettsteder sikrer at brukere med en rekke funksjonshemninger og behov kan bruke nettsteder uten begrensninger og uten hjelp fra andre. Formålet med et tilgjengelig nettsted er derfor å forhindre ekskludering av visse grupper på nettet, for eksempel personer med fysiske eller intellektuelle funksjonshemninger.

Hva er et tilgjengelig nettsted?

For å lage et tilgjengelig nettsted må man utforme nettinnholdet på en måte som gjør at alle brukere kan få tilgang til og forstå det. Dette inkluderer personer som er avhengige av hjelpeteknologi som skjermlesere, tastaturnavigering, forstørrelsesverktøy eller teksting. Som en del av å skape en inkluderende nettopplevelse er tilgjengelige nettsteder avgjørende for bedrifter, organisasjoner og offentlige institusjoner. Tilgjengelig nettdesign kan også forbedre søkemotoroptimaliseringen ved å forbedre brukervennligheten og informasjonsstrukturen.

Barrierer er hindringer som gjør det vanskelig – eller i noen tilfeller umulig – for brukere å få tilgang til og samhandle med innholdet på nettstedet. Mens bevisstheten om tilgjengelighet i fysiske rom har økt betydelig, oppstår det fortsatt ofte barrierer på nettet, og ofte uten at det er tilsiktet. Disse kan skyldes tekniske beslutninger, visuelle designvalg eller dårlig strukturert innhold. Forskning og praktiske eksempler viser at interaktive komponenter, som pålogging eller sikkerhetsfunksjoner, kan utgjøre store utfordringer. Visse CAPTCHA-er som bruker forvrengte tegn eller kun visuelle gåter, kan begrense tilgangen for personer med synsnedsettelser betydelig og være i strid med dagens forventninger til tilgjengelige nettsteder.

Webtilgjengelighetsstandarder for tilgjengelige nettsteder

Den viktigste internasjonale standarden for tilgjengelige nettsteder er WCAG– nærmere bestemt WCAG 2.2 (Web Content Accessibility Guidelines). Disse W3C-retningslinjene definerer de nyeste kravene og beste praksisene som gjør nettsteder tilgjengelige for alle brukere.

WCAG 2.2 legger vekt på forbedret brukervennlighet, tydeligere tastatur- og fokusnavigering og forenklede interaksjoner på mobile enheter. Disse oppdateringene gjenspeiler endringer i brukeratferd og tar for seg barrierer som tidligere versjoner ikke dekket fullt ut.

Noen av de viktigste suksesskriteriene i WCAG 2.2 er:

• Synlig tastaturfokus: Interaktive elementer må være tydelig synlige når man navigerer med tastaturet.
• Minimumstørrelse på kontroller: Klikkbare og berørbare områder må være store nok til å unngå utilsiktet aktivering.
• Alternativer til drabevegelser: Interaksjoner må ikke være avhengige av dra-og-slipp-funksjonen.
• Unngå overflødig inndata: Brukere skal ikke måtte oppgi samme informasjon flere ganger.
• Tilgjengelig autentisering: Påloggingsprosesser må ikke være avhengige av kognitive oppgaver som puslebaserte CAPTCHA-er.

WCAG 2.2 er den viktigste referansen for moderne nettstedsutvikling og danner det tekniske grunnlaget for tilgjengelighetskrav i Storbritannia.

Oppfattbar

Mange nettsteder inneholder blinkende annonser, kommentarfelt er fylt med tekst i liten skrift, og noen ganger spilles det til og med bakgrunnsmusikk for å forsterke stemningen eller temaet på siden. Avhengig av type og alvorlighetsgrad av funksjonshemming, kan det hende at noen besøkende på nettstedet ditt ikke oppfatter disse elementene fullt ut – eller i det hele tatt.

Blinde mennesker navigerer for eksempel på internett uten visuelle signaler. I stedet leser en skjermleser nettstedet høyt. Enheten sender de lesbare dataene til hjelpeteknologiene som brukes. En oppdaterbar punktskriftdisplay kan for eksempel konvertere tekst til punktskrift. Dette gjør at personen kan oppfatte nettstedet ditt gjennom berøring. Et tekst-til-tale-verktøy spiller av innholdet i lydformat. Med denne teknologien er brukerne avhengige av hørselen for å behandle innholdet på nettstedet. I eksemplet som nettopp ble nevnt, blir imidlertid bakgrunnsmusikken en distraksjon.

Personer med mindre alvorlig synshemming – inkludert mange eldre voksne – kan ta inn innholdet på nettstedet ditt med øynene, men de er avhengige av en sterkt forstørret skjerm. Personer med fargeblindhet kan derimot ikke se advarsler som kun formidles gjennom farger. Døve personer kan ikke få tilgang til informasjonen i lydfiler og mye av innholdet i videofiler.

Forståelig

Svært unge brukere, eldre voksne eller personer med kognitive funksjonsnedsettelser kan ha vanskeligheter med å forstå tekster som er fylt med faguttrykk, uforklarte forkortelser eller komplekse setninger. Hvis et nettsted skiller relatert innhold eller bruker inkonsekvent terminologi, kan brukerne finne det vanskelig å forstå den tiltenkte betydningen.

Operativ

Etter hvert som mobil surfing fortsetter å vokse, blir det spesielt frustrerende når lenker er for små eller ligger for tett sammen til at man kan trykke nøyaktig på dem. Nettsteder som ikke er optimalisert for smarttelefoner – hvor det er vanlig med tettpakket, liten lenketekst – kan være spesielt vanskelige for eldre voksne eller andre med begrenset håndferdighet.

Imidlertid er det nå utviklet mange verktøy for personer med fysiske funksjonshemninger som gjør det enklere å bruke datamaskiner. Noen av disse verktøyene sporer øyebevegelser, mens andre teknologier betjenes via tastaturet. I prinsippet bør et nettsted som er designet for tilgjengelighet på nettet, bygges slik at det kan tolkes av slike hjelpeteknologier. Hvis nettstedet ditt ikke kan navigeres med disse, har potensielle kunder som er avhengige av dem ingen mulighet til å benytte seg av hele tilbudet ditt.

Når brukere blir bedt om å fylle ut et skjema, for eksempel for å melde seg på et nyhetsbrev, er det ikke uvanlig at det oppstår feil. Passordet er for kort, eller fødselsdatoen passer ikke med de angitte parametrene. Gi derfor klare veiledninger om hvordan feilene kan rettes. Interaksjon med et nettsted omfatter også navigering. Personer som bruker enheter med små skjermer eller arbeider med høy skjermforstørrelse, trenger navigasjonsstier som er tilpasset dette, og er avhengige av et klart og godt strukturert nettsted.

Kommentarfelt gir brukerne mulighet til å gi tilbakemelding. De kan bruke dem til å dele sine meninger om et produkt eller innhold, eller til å kommunisere med andre. Når de skriver på en skjerm, bruker personer med synsnedsettelser ofte et skjermforstørrelsesprogram. Dette gjør at elementene vises mye større og øker avstanden mellom lesekolonnen og inntastingsfeltet. Plasser derfor elementene visuelt nær hverandre for å gjøre det enklere for brukerne å kommunisere med hverandre.

Robust

Nettsteder må være kompatible med hjelpeteknologier gjennom riktig kodestruktur. Semantisk HTML (som <main>, <nav>, <section>) hjelper skjermlesere å forstå sidens organisering. Riktige skjemetiketter kobler inndatafelt til beskrivelsene deres ved hjelp av for attributter. ARIA-landemerker gir snarveier for navigering med skjermlesere. Uten disse blir selv godt utformet innhold ubrukelig for brukere av hjelpeteknologi.

Hva er fordelene med tilgjengelig webdesign?

Å fjerne tilgjengelighetsbarrierer forbedrer brukervennligheten til nettstedet ditt og styrker synligheten din i søkemotorer. Mange tilgjengelighetspraksiser overlapper med beste praksis innen brukeropplevelse og SEO, noe som betyr at forbedringer gjort for tilgjengelighet ofte kommer alle besøkende til gode.

En tilgjengelig nettside hjelper:

• brukere på mobile enheter,
• personer med fysiske eller kognitive funksjonshemninger,
• eldre voksne og
• besøkende som kanskje ikke er kjent med nettnavigering.

Ved å presentere informasjonen på en oversiktlig måte og strukturere nettstedet ditt logisk, øker du både lesbarheten og tiden brukerne tilbringer på sidene dine. Tilgjengelighet krever ekstra arbeid og testing, men fordelene er mange. Tilgjengelige nettsteder gir en bedre opplevelse for alle.

Hvordan gjøre en nettside tilgjengelig? Tips og eksempler

Hvis du ønsker å lage et tilgjengelig nettsted, bør du være nøye med hvordan du strukturerer informasjonen og de ulike visuelle komponentene på nettstedet.

Trinn 1: Sørg for en klar informasjonsstruktur

Gi nettstedet ditt en logisk, lettfattelig struktur og bruk et enkelt og brukervennlig språk. Dette gjør innholdet ditt mer tilgjengelig og forbedrer også din Google-rangering, siden søkemotorer vurderer lesbarhet og klarhet.

For å støtte sterk SEO og opprettholde en organisert nettstedsarkitektur, må du huske på følgende:

Trinn 2: Bruk visuelle signaler

Skalerbare skrifttyper og fargejusteringer gjør det lettere for personer med nedsatt syn eller fargeblindhet å lese innholdet på nettstedet. Sørg for at teksten har tilstrekkelig kontrast til bakgrunnen og at interaktive elementer som knapper eller lenker skiller seg tydelig ut.

For å hjelpe brukere som navigerer med tastatur eller skjermleser, kan du markere interaktive elementer ved hjelp av:

• synlige fokusindikatorer,
• hover-effekter,
• aktive lenkeformater.

Ikke stol utelukkende på farger for å formidle mening — suppler fargekodingen med symboler, tall eller stjerner.

Close

Personer som lider av epileptiske anfall er utsatt for risiko hvis en nettside inneholder grafikk eller videoer som blinker mer enn tre ganger i sekundet. Forskere har også funnet ut at skarpt definerte rutenettmønstre med høy kontrast kan utløse anfall hos personer med lysfølsom epilepsi.

Trinn 3: Presentere informasjon i flere formater

Nettstedets tilgjengelighet bør være en del av din daglige arbeidsflyt. Enten du optimaliserer for søkemotorer, publiserer PR-innhold eller legger til nye produktsider, bør innhold som lastes opp regelmessig være strukturert på en måte som er brukbar for alle besøkende.

En grunnleggende del av nettstedets tilgjengelighet – med SEO-fordeler – er å inkludere alternativ tekst for bilder. Fordi søkeroboter og skjermlesere ikke kan tolke bilder, gir alternativ tekst meningsfulle beskrivelser for:

• blinde brukere,
• personer med nedsatt syn,
• brukere med langsomme internettforbindelser.

Transkripsjoner og bildetekster

Å lage transkripsjoner og undertekster kontinuerlig og i tide er en mer omfattende oppgave. Disse verktøyene gjør det mulig å gjøre lydinnhold tilgjengelig for personer som er døve eller har nedsatt hørsel. En transkripsjon, som konverterer talte ord samt lyder og bakgrunnsstøy til tekst, bør plasseres så nær det tilhørende lydinnholdet som mulig – for eksempel via en knapp som lenker direkte til dokumentet.

Teksting gjør det betydelig enklere for døve eller hørselshemmede å forstå nettvideoer. Det er også en fordel for brukere som foretrekker å ikke spille av lyd (for eksempel fordi de ikke ønsker å forstyrre andre). Personer med kognitive funksjonshemninger eller tilstander som ADHD behandler ofte videoinnhold mer effektivt når de kan dempe bakgrunnslyder ved hjelp av en innstilling i videospilleren – på samme måte som brukere med hørselshemninger.

Lydbeskrivelse

Personer med synsskarphet under 30 prosent regnes som synshemmede, og personer med synsskarphet under to prosent regnes som blinde. De oppfatter visuell informasjon bare delvis eller ikke i det hele tatt. For å sikre at disse personene kan forstå videoinnholdet ditt, bør du inkludere et ekstra lydspor. Dette sporet gir forklaringer på visuelle elementer som landskap, mennesker og korte beskrivelser av handlinger som foregår på skjermen. Plasser disse forklaringene i tale- og lydpausene i den originale opptaket, slik at lydsporene ikke overlapper hverandre.

Lettlest språk

Enkelt språk uttrykker innhold på en veldig enkel måte. Det hjelper mennesker med kognitive funksjonsnedsettelser å forstå kompleks informasjon lettere. Enkelt språk unngår elementer som konjunktiv, synonymer og negasjoner. Setningene er korte og inneholder bare én idé om gangen. Personer med kognitive funksjonsnedsettelser har samme rett til informasjon som alle andre. Av denne grunn tilbyr dagsaviser i økende grad versjoner av artiklene sine på lett språk på sine nettplattformer, som et godt eksempel på tilgjengelige nettsteder. Offentlige institusjoner bruker også stadig oftere lett språk i sine informasjonstekster.

En mindre streng form er det som kalles lettlest språk, som tilsvarer omtrent språknivå A2 eller B1.

Trinn 4: Gjør nettstedet kompatibelt

Hjelpeteknologier som skjermlesere gjør nettilgjengelighet mulig for mange brukere. Disse verktøyene behandler nettsteder lineært fra venstre til høyre og fra topp til bunn, og derfor må layout og innhold være tydelig adskilt. Ellers kan sideelementer tolkes feil.

For å hjelpe brukerne med å navigere effektivt, følg disse grunnleggende reglene.

Hopp over navigasjonslenker og andre snarveier

Skjermlesere overfører tekstinformasjon til tekst-til-tale-programvare og oppdaterbare punktskriftdisplayer. For å gjøre dette leser de siden fra topp til bunn – dette inkluderer også gjentatte elementer som navigasjonslinjen, ikoner eller lenker til undersider. For å forhindre at leseren unødvendig gjentar denne informasjonen på hver side, bør du implementere lenker for å hoppe over navigasjon (kort: hopp over lenker).

Brukere som navigerer kun ved hjelp av tastatur, eventuelt med en munnpinne, har også store problemer hvis de må bla gjennom mange elementer. Disse personene har nytte av en hoppekobling øverst på siden som er så synlig som mulig:

<a href="#content">Skip navigation</a>
<main id="content">
    <h1>Main heading</h1>
    <p>First paragraph</p>
</main>

Det finnes hoppelenker som er usynlige i oppsettet, men skjermleseren videreformidler den alternative tekstmeldingen «Hopp over navigasjon» til brukeren når koden ser slik ut:

<a href="#content"><img src="empty.gif" height="15" border="0" alt="Skip navigation" width="5"></a>

Det er viktig at hoppelenker vises så tidlig som mulig i koden. Plasser ankeret i begynnelsen av hovedinnholdet:

<div id="content"></div>

Bruk hoppelinjer med måte, da for mange av dem kan oppheve den positive effekten og tvinge brukerne til å klikke seg gjennom et for stort antall elementer. En mer elegant løsning er å bruke ARIA-landemerker og sørge for et godt strukturert dokument. Det er også lurt å bruke HTML5-elementer.

En annen nyttig funksjon er en innholdsfortegnelse i begynnelsen av dokumentet, som lar brukerne hoppe til bestemte seksjoner via lenker på siden. Moderne skjermlesere leser opp de tilsvarende overskriftene. Ved å bruke meningsfulle, velstrukturerte overskrifter forbedrer du lesbarheten både for søkemotorer og hjelpeteknologier.

Datatabeller i stedet for layouttabeller

For webtilgjengelighet i henhold til W3C-retningslinjene for webtilgjengelighet, bør du ideelt sett bare bruke datatabeller. Skjermlesere har færre problemer med dette formatet og kan presentere informasjonen på en meningsfull måte etter konvertering. Layouttabeller gir derimot en side visuell struktur, men gjør det vanskeligere for skjermlesere å formidle innholdet tydelig.

Definer layouttabeller ved å bruke bare enkle elementer: TABLE, TR og TD (henholdsvis tabell, rad og celle). Bruk strukturelle elementer for å gjøre relasjonene mellom cellene logiske, slik at skjermleseren leser layouttabellen som en datatabell. Du gjør det motsatte hvis du fjerner visse tabellelementer fra tilgjengelighetstreet.

For å sikre tilgjengelighet på nettet, bruk koden role="none" som vist i eksemplet. Dette gjelder tabellen og dens underordnede elementer. Hvis du nestetabeller i tabeller, må du definere begge elementene med den.

<table role="none">
<tr>
<td>
<table role="none">
<tr>
<td>
Example text <abbr title="for example">e.g.</abbr> about ARIA
</td>
</tr>
</table>
</td>
</tr>
</table>

Sjekkliste for tilgjengelige nettsteder

Når du er ferdig med å bygge nettstedet ditt, kan du gå gjennom sjekklisten vår for nettilgjengelighet for å sikre at du har tatt hensyn til de viktigste faktorene.

✓ Informasjonsstrukturen er godt organisert og lett å følge

✓ Bruk av klart og tilgjengelig språk

✓ Alternativ tekst for bilder

✓ Video- og lydtranskripsjoner

✓ Fargeutheving for viktig innhold

✓ Høy kontrast

✓ Støtte for skjermleser

Gratis verktøy for å lage tilgjengelige nettsteder

Det finnes en rekke verktøy som kan hjelpe deg med å lage en tilgjengelig nettside. Nedenfor finner du noen av de mest kjente alternativene:

• TPGi ARC Toolkit: Svært pålitelig og ideell for tekniske nettstedsrevisjoner.
• Accessibility Checker: Denne nettappen lar deg teste nettstedet ditt for WCAG-samsvar gratis.
• Siteimprove: Siteimproves Accessibility Checker tilbyr en gratis nettstedskanning, og resultatene leveres via e-post.

Tilgjengelighet på nettstedet forbedrer brukeropplevelsen for alle

Bedre tilgjengelighet på nettstedet ditt forbedrer den generelle brukervennligheten og gir en betydelig bedre brukeropplevelse. Dette gir følgende fordeler:

• mobilbrukere,
• personer med fysiske eller kognitive funksjonshemninger,
• eldre voksne og
• alle som kanskje har mindre erfaring med å navigere på nettet.

Ved å strukturere nettstedet ditt på en oversiktlig måte og utarbeide innholdet i et inkluderende og lettforståelig format, støtter du både tilgjengelighet og søkemotoroptimalisering. Oversiktlig arkitektur, sterk kontrast, lesbar tekst og kompatibilitet med hjelpeteknologi bidrar til lengre besøkstid og høyere tilfredshet.

Selv om det krever ekstra arbeid å sikre tilgjengelighet – for eksempel grundige tester, tydelig innholdsstruktur, alternativ tekst og gjennomtenkte interaksjonselementer – er investeringen vel verdt det. Tilgjengelig nettstedsdesign kommer alle brukere til gode, styrker merkevarens troverdighet og hjelper deg med å nå et bredere publikum, inkludert de som er avhengige av hjelpeteknologi for å navigere på nettet.