Universell utforming av ikt - hva er status. En presentasjon om tilsynets testmetode. Ved Dagfinn Rømen, teknolog i tilsyn for universell utforming av ikt i Difi.
8. «Internetts styrke er at det
er universelt. Tilgjengelighet
for alle er essensielt, uavhengig
av funksjonshemning.»
Tim Berners-Lee, direktør for W3C,
(oppfinner av World Wide Web)
Foto: Nadav Kander
11. Idé: Denis Boudreau
DESIGN FOR YTTERPUNKTA
La midten ordne seg sjølv!
Brukarar med
nedsatt
funksjonsevne
Eldre
brukarar
Den
«gjengse»
brukar
Brukarar av
smartbrett
Brukarar av
smarttelefon
14. Tilsyn for universell utforming av IKT
«Empower every person
and every organization
on the planet to achieve more».
Slagordet til Microsoft
Bill Gates – grunnleggar Microsoft
Photo by Yana Paskova/Getty Images
31. Når gjeld dei nye krava?
• 1. juli 2020: Nye nettstadar
• 23. september 2020: Eksisterande nettstadar
• 23. juni 2021: Mobilapplikasjonar
Opent for endring
44. • Tab-tasten, piltastane og enter-tasten
• Muleg å bruke alt innhald
• Logisk rekkefølge
• Snarveg til hovudinnhald
• Ingen tastaturfeller
Tastaturnavigasjon
68. Løsninger som møter kravene i forskriften
Det er en rekke krav til tekststruktur for å tilfredsstille loven.
Avhengig av hvilket publiseringssystem som benyttes,
kan kravene løses ulikt teknisk, men grunnprinsippene vil være de samme.
Innholdet må struktureres med korrekt kode, og må kunne forstørres uten tap
av tekst eller lesbarhet.Overskrifter Overskrifter og rett bruk av
overskriftsnivåer er kanskje det mest fremtredende virkemiddelet for å gi
struktur og oversiktlighet til teksten. Mange brukere, både med og uten
hjelpemiddel, benytter mellomtitler for å skumlese innholdet og finne det som
virker mest interessant. Uten mellomtitler blir lange tekster tunge å lese.
Overskrifter kodes ved hjelp av overskriftelementene <h1> til <h6>, og disse
deler opp teksten tilsvarende i kapitler og delkapitler i ulike nivåer. Sidetittel
skal være h1Hovedinnholdets tittel skal være den første overskriften i koden,
og skal være på nivå 1 ved hjelp av elementet <h1>. Dette gjelder også
startsiden, som bør ha en synlig overskrift som tydelig formidler hvilken
virksomhet brukeren har kommet til. Dette er gunstig både for
søkemotoroptimalisering og for brukere med hjelpemiddel.
71. Løsninger som møter kravene i forskriften
Det er en rekke krav til tekststruktur for å tilfredsstille loven. Avhengig av
hvilket publiseringssystem som benyttes, kan kravene løses ulikt teknisk,
men grunnprinsippene vil være de samme. Innholdet må struktureres med
korrekt kode, og må kunne forstørres uten tap av tekst eller lesbarhet.
Overskrifter
Overskrifter og rett bruk av overskriftsnivåer er kanskje det mest
fremtredende virkemiddelet for å gi struktur og oversiktlighet til teksten.
Mange brukere, både med og uten hjelpemiddel, benytter mellomtitler for å
skumlese innholdet og finne det som virker mest interessant. Uten
mellomtitler blir lange tekster tunge å lese.
Overskrifter kodes ved hjelp av overskriftelementene <h1> til <h6>, og disse
deler opp teksten tilsvarende i kapitler og delkapitler i ulike nivåer.
Sidetittel skal være h1
Noe dere kan ta med dere når dere snakker om hvorfor uu er viktig i deres egen organisasjon.
5 grunnar til at vi meiner det gir samfunnet ein meirverdi å satse på universell utforming.
Ein litt kjedeleg grunn først - universell utforming er samfunnsøkonomisk lønnsomt
Regjeringen satsar på digitalisering – ikkje berre for å få betre tenester, men like viktig er ambisjonen om å drive ein meir effektiv forvaltning. For å oppnå dette, så er det ein forutsetning at flest muleg kan bruke nye løysingar.
Her skal du få eit lite bakteppe for kor mange har nytte av universell utforming.
Vi brukar å seie at universell utforming gir like mulegheiter – også i den digitale verden.
Men dette med å inkludere alle, det er ein tanke som ikkje er ny,
Den har vært med siden oppstarten av internett
Oppfinnaren av Internett Tim Berners Lee har sagt at
«Internetts styrke er at det er universelt. Tilgjengelighet for alle er essensielt, uavhengig av funksjonshemming».
Tilgjengelegheit for alle er essensen av internett.
Og ta for eksempel Stephen Hawking.
Han var rekna for å vere ein av verdens mest intelligente personer.
Internett og digitale hjelpemiddel var jo på mange måtar ein forutsetning for at vi kunne ta del i hans tankar og idear.
Universell utforming er smart!
Kort og godt. Det er bra for brukarane, men det er også smart for virksomhetene.
Dette er noko vi brukar å snakke om når vi snakkar om design på nettet:
Dersom vi brukar tilnærminga til den amerikanske hæren, fokuserer du her i midten. («gjengse brukar»)
På denne illustrasjonen (inspirert av Denis Boudreau) finn du:
At på begge sider av gjennomsnitt finn ein ytterpunkta.
på den ene ytterkanten dei største brukarutfordringane,.
på den eine kanten har du brukarar av smarttelefon
Liten skjerm – krev responsive design.
Vårt råd er derfor å designe for ytterpunktene.
Dersom du designar for ytterpunkta, vil dei i midten følgje med automatisk. På den måten har du favna alle.
Når vi er rundt og snakkar om uu, ser vi at dei fleste tenker umiddelbart at dette handlar om å få dei blinde på nettet.
I virkeligheten er for eksempel Google verdens største blinde brukar. I prinsippet, brukar dei den same tilnærminga som ein skjermlesar for å finne innhald.
Dermed vil dere også ha den fordelen at dersom du gjer nettsida di meir universelt utforma kjem du lenger opp i søket på Google.
For det er nemleg lønnsamt.
Universell utforming er ikkje berre lønnsomt for samfunnet – det er lønnsamt for virksomhetene.
Microsoft har hatt som innebygd prosess at løysingane skal vere tilgjengeleg for alle så langt det er muleg frå starten av.
Slagordet er å sette kvar person og kvar organisasjon i stand til å oppnå meir. Det skal inkludere alle – uavhengig av funksjonsevne.
Dette sikkert omdømmemessig lurt av Microsoft, tenker eg, men eg har ingen tru på at dei gjer dette dersom det ikkje er lønnsomt.
Så det blir slik at dei som har tenkt på funksjonshemma brukarar frå starten av, dei har no ein kjempefordel og eg kan nemne andre selskap som har tenkt slik:
Facebook
Amazon
Apple
Dei har nok ikkje gjort det for hjertets godhet. Det er smart å tenke på eit større omfang. Det må vi også tenke på i offentlig sektor, med digitalisering.
Universell utforming gir fremtidsretta løysingar!
Teknologiutviklinga går veldig raskt. Du veit ikkje kva teknologi innhaldet ditt blir presentert på i 2021, eller kva yrker som er aktuelle i 2030.
Få tenkte på appar i 2008, då lova kom
Nye måtar å løyse oppgåver på vil komme jamt og trutt – tenk berre på mobilbetaling, eller P-app.
Det at vi lever i eit globalt samfunn, betyr at Norge ikkje er lausriven frå resten av verden.
Spesielt ikkje på det digitale området.
Premissene for mykje av det vi gjer på nett, blir lagt andre stader i verda.
Det handlar ikkje om å berre henge med på dei siste teknologiane, men det handlar om å forstå kva verden dei opererer i, og då må du forstå folk.
Det å designe ei nettside, handlar om å lage løysingar for brukarane. Og dagens unge, som er «digital natives», morgendagens brukere, kjem til å stille høge krav til brukarvenlegheit. Og uu er ein del av dette.
Uansett om du ikkje syns dei 5 foregåande grunnane var gode nok – universell utforming av ikt er faktisk pålagt ved lov!
Frå 1. juli 2013 vart universell utforming lovpålagt gjennom forskrift om universell utforming av IKT, og tilsynet vart etablert.
Forskrifta har heimel i Likestillings- og diskrimineringslova
Nye ikt-løysingar skal no utformast i samsvar med krava.
I 2021 skal alle løysingar følge dei nye krava.
Og det gjeld alle sektorar.
Forskrifta gjeld for:
Det gjeld alle verksemder i
Statleg sektor (klikk)
Kommunal sektor (klikk)
Privat sektor (klikk)
Lag og organisasjoner
Og frå i 2018 er også skole- og utdanningssektoren inkludert i regelverket.
Ikt-løysinga må vere retta mot publikum i Norge
Integrert del av måten verksemda informerer og tilbyr sine tenester til publikum.
Ikt-løsninger i forskrifta er definert som nettsider, apper og automater.
For nettløysingar viser forskrifta til delar av standarden: Retningslinjer for tilgjengelig webinnhold. (WCAG) 2.0
WCAG er ein etablert og godt kjent internasjonal standard.
WCAG er bygd opp med fire prinsipp
Informasjon skal presenterast på ein måte som brukarane kan oppfatta.
Det skal være mulig å bruke nettsida
Det skal vera muleg å forstå informasjon og betening av brukargrensesnitt
Innhaldet skal vera robust nok til at det kan tolkast på ein påleiteleg måte av ulike nettlesarar og hjelpemiddel
vi i tilsynet jobbar med å følge opp regelverket på fleire måtar:
Gir informasjon og å veiledning
Bygger kunnskap og skaffer status på korleis det står til med universell utforming av ikt i Norge
Fagorgan: Videreutvikling av regelverk
Fører tilsyn - kontroll av enkeltverksemder.
Viss verksemda ikkje viser vilje eller evne til å retta opp feila, eller brukar for lang tid på å setta i verk retting, kan vi gi pålegg om retting og i siste instans dagbøter. Vi har nylig vært oppe i en dagbotsats på 150 000 kroner dagen.
Norge har hatt regelverk på dette området i 5 år.
Og EU kommer etter.
Med direktivet om tilgjengelighet til nettsteder i offentlig sektor – kjent som webdirektivet.
Det ble vedtatt i desember 2016.
Så hvordan vil dette påvirke oss i Norge?
Krava gjeld nettsider og mobilapplikasjonar.
Dagens norske regelverk dekkar i stor grad krava i webdirektivet.
Direktivet stiller nokre nye krav, mellom anna til at vi i tilsynet skal gjøre jevnlige målinger av nettsider og mobilapplikasjoner og rapportere status for universell utforming av ikt i Norge inn til EU-kommisjonen.
Men kva blir nytt for dykk?
Det er en prosess på å innlemme WCAG 2.1 i direktivet.
WCAG 2.1 var klar som standard frå W3C tidligere i år.
Alle kravene i 2.0 ligger i 2.1, men det er noen nye krav, som er ment å ivareta bruk av nettsider på mobil og nettbrett.
Nevner noen eksempler, utan at eg går i dybden
Eksempel på krav er:
Det skal være mulig å bruke nettsiden i både liggende og stående visning (Success Criterion 1.3.4 Orientation)
Innhold kan presenteres uten at man må scrolle både loddrett og vannrett (med noen unntak, for eksempel for kart), (Success Criterion 1.4.10 Reflow)
Grafer og navigeringsmekanismer skal ha en kontrast mot bakgrunnen på minst 3:1. Altså utvidet krav til kontrast, som i dag bare gjelder mellom tekst og bakgrunn (Success Criterion 1.4.11 Non-text Contrast)
Minimumskrav til klikkeflate (Success Criterion 2.5.5 Target Size)
Dette kommer. Trenger ikke vente.
Verksemdene skal utarbeida ei tilgjengelegheitserklæring for løysingane sine, som dokumenterer status for universell utforming – kva som er uu og kva som ikkje er uu.
Erklæringa skal vere publisert på nettstaden (eller tilsvarande for appar) og skal oppdaterast når verksemda gjer større endringar av løysinga
For å få oversikt over status for løysinga må verksemda teste løysiga, anten ved å teste den sjølv, eller ved å kjøpe ein test i marknaden.
EU-kommisjonen har utarbeider ein mal, som skal omsettast til norsk.
Nettstaden skal ha ein tilbakemeldingsfunksjon der brukarane skal kunne gje verksemda tilbakemeldingar om løysinga og feil knytt til uu.
Brukeren har da krav på utfyllende svar på henvendelsen.
Dersom brukaren ber om eit tilgjengeleig alternativ til innhald som ikkje er universelt utforma, skal verksemda svara på førespurnaden innan rimeleg tid.
Verksemdene sine intranettsider skal også vere universelt utforma.
Omgrepet intranett er ikkje klart definert i direktivet, men omfattar den interne nettstaden til verksemda.
Det vert ikkje stilt krav til ikt-løysingar i arbeidslivet generelt.
Intranett omfattar t.d. ikkje:
saksbehandlingssystem
publiseringsløysing
System for tidsregistrering og reiserekningar
andre fagsystem
Vi regner med at det nasjonale regelverket trer i kraft 1. juli 2019.
For nye krav er det uansett en innføringstid på ett år, og fristen for nye løsninger er derfor 1. juli 2020.
Fristene for eksisterende nettsteder følger av direktivet
Jeg sier dette med et stort forbehold. Dette kan være åpent for endring.
Departementa (KMD, BLD), med bistand fra oss, jobber med å oppdatere lov og forskrift for å innarbeide det som er nytt. Det er fortsatt en del som er uavklart, også fra EU-kommisjonens side.
Det blir vanleg høyring i haust.
Alle har høve til å gje innspel i høyringa
Det blir ope høyringsmøte
Følg med på nettstaden vår for meir informasjon. Vi jobbar òg med veiledning om det som er nytt.
Nå om testing.
Kan ikke legge nettsida på vektskåla og lese av kor stor prosent den er uu.
Å teste ein heil nettstad etter WCAG kan virke overveldende.
Start i en ende og prioriter. Det er lett å si
Kor skal ein starte? Kven skal gjere kva?
Her kan vi godt få nokre innspel frå salen etterpå. Eg jobbar med tilsyn, og har såleis ein anna testkvardag enn de som er her i dag. Det er de som kjenner best på utfordringane de har i dag.
Når vi testar, gjer vi alltid eit utval.
Vi tester ikkje alle sidene på nettstaden, men vi veljer ut for eksempel
Dei viktigaste brukaroppgåvene. Kva teneste eller informasjon er primærfunksjonen til nettstaden?
Ulike sidetypar og malar – Ved å teste ein mal, får du testa mange sider samtidig, og endringar får store ringvirkningar
Innhaldet på nettsidene avgjer kva krav det er relevant å teste. Vi treng for eksempel ikkje teste tabellar viss det ikkje finst tabellar på sidene.
Å jobbe med universell utforming er lagarbeid.
Sjølv om det er mange flinke folk her i salen, er det nok ingen som kan gjøre alt. Og det er viktig at ein ikkje blir sittande aleine med ansvaret.
Kven som testar kva og kva du testar kjem an på dei ulike rollane i organisasjonen.
Og universell utforming er ikkje berre noko som skjer ein gong, men er ein prosess. Det må inn i rutinane.
Når vi tester, bruker vi vår egenutvikla metode, som er indikatorsettet vårt.
Som forvaltere av et lovverk, forholder vi oss til standarden, WCAG 2.0.
Standarden har tatt hensyn til brukerbehov.
Indikatorene bygger på krava og dokumentasjonen i WCAG.
Indikatorene beskriver hvordan kan vi teste på en forutsigbar måte, som kan gås etter i sømmene. Andre skal kunne bruke våre metodar og finne dei same feila.
Fra test, får vi informasjon om hvordan det står til med løsningen, hva som er feil og hva som er rett av innholdet vi har testa.
Vi tar vare på dataene og kopler sammen anna informasjon, som grunnlag til videre arbeid med veiledning og kontroller.
Metoden vår, indikatorsettet, blir brukt både i kontrollar og statusmålingar.
måling av nettsidene til de politiske partiene før valget i fjor.
ny større statusmåling om universell utforming på nett, resultata kjem i haust.
tilsyn og kontroller
No skal eg snakke litt om vanlege feil vi finn, kva vi ser etter når vi testar.
Eg har lyst til å gi dykk gode råd på 3 område som det er viktig tenke på når de jobbar med universell utforming og kva du kan gjere for å komme i gang.
Ein analogi vi ofte brukar er å tenke på nettsida som eit hus.
Og då bør du ha ein solid grunnmur: Ha god kode.
Bør ha ein bra design.
Fylt med tilgjengeleg innhald.
Grunnmur: Ha god kode.
Bør ha ein bra design – det skal både sjå bra ut, og ha ein design som fungerar
Fyllt med tilgjengeleg innhald.
Grunnmur: Ha god kode.
Bør ha ein bra design.
Fyllt med tilgjengeleg innhald. Like sjølvsagt som at du kan få tak i alle tinga i huset ditt, at brukarane skal få tak i innholdet på like vilkår.
Men korleis får du det til?
Eg veit at dei fleste av dykk er travle, du
sit med tusen oppgåver og masse leveransar
Du skal vere med og sørge for at nettsida følgjer lovkravet om uu.
Du skal drive masse testing
Eg er her i dag for å gi litt hjelp.
La oss starte med grunnmuren:
GOD KODE
Viktig for alle brukere, både med tanke på brukervennlighet, og at nettløsningen skal fungere ved bruk i forskjellige nettlesere og hjelpemidler.
som for eksempel skjermleser og lignende.
Også viktig for fremtidig teknologi. God kode gjør nettsiden mer robust.
Det finnes mange måter å kode en nettside på, og det finnes ulike løsninger, avhengig av hvilket kodespråk man bruker.
Kode gjeld vel ikkje deg, tenker du. Det er leverandøren din. Eller utviklaren din.
Men du har med kode å gjere både når du kravspekkar og når du testar.
Basert på det vi ser i tilsyn og våre erfaringer, så vil eg trekke fram 5 viktige punkt som du må tenke på når det gjeld kode:
Tastaturnavigasjonen tek utgangspunkt i koden på nettsida får å fungere.
Her testar vi fleire ulike ting.
KLIKK
Vi bruker Tab-tasten for å navigere gjennom ei nettside. Vi brukar også piltastane for å bla mellom val, og enter-tasten for å bekrefte. Esc.
Vi tester:
Om det er muleg å bruke alt innhald. Alt du kan nå med mus må du kunne nå med tastaturet
At innhaldet kjem i ei logisk rekkefølge
Om det finst ein Snarveg frå toppen av sida ned til hovudinnhaldet
At tastaturnavigasjonen ikkje sitt fast i ei tasttaurfelle
Om brukeren tabber gjennom ei nettside, eller svaralternativ i ei nedtrekksliste, skal brukaren ikkje få ei kontekstendring, med mindre brukaren får beskjed.
Eksempel på kontekstendring er at
tastaturfokuset blir flytta til ein annan del av sida
innhaldet på sida endrar seg i vesentleg grad
sida laster på nytt og tastaturnavigasjonen stater på toppen igjen, eller
skjema blir sendt inn automatisk
Dette skal ikkje skje før brukeren har aktivt fullført eller bekreftet handlingen.
Du må kunne sjå kvar du er.
Alle objekter på nettstedet skal ved tastaturnavigering skal få tydelig markering av fokus. Det må være lett å se hvilket objekt som har fokus, hvis ikke blir tastaturnavigering i praksis umulig for enkelte brukere.
Alle nettlesere har en standard fokusmarkering innebygd, med mindre den aktivt er fjernet i koden eller css.
Men i enkelte tilfeller er ikke bruk av kun stiplet linje godt nok, og man kan definere egne, bedre fokusmarkeringer i koden.
Dette tester vi ved å bruke tab-tasten for å bla mellom elementene på sida.
Språket skal være rett koda, både opp mot HTML-standard, men også språkkode.
Det gjeld både for hovudinnhaldet, og der delar av innhaldet er på eit anna språk.
Da blir nettsida lest opp med riktig stemme av skjermleser.
Vi testar med inspeksjonsverktøyet i nettlesaren.
Vi høyreklikker på elementet vi skal teste og velger inspiser element. F12
I tillegg skal koden unngå enkelte syntaksfeil som er spesifisert i WCAG
Her tester vi med HTML-validatoren til W3C.
Skjemaelement skal vere kopla til ein ledetekst i koden.
Og det er nettopp på skjema at vi bruker å finne en del gjennomgåande feil.
For eksempel at skjemafelt ikkje er kopla til noko ledetekst, eller at ledeteksten i koden er feil eller på feil språk.
Da blir det umogeleg for enkelte brukara å vite kva som skal fyllast inn i skjemafelta.
For å teste bruker vi inspeksjonsverktøyet i nettleseren.
Nettsidene skal ha ein sidetittel som beskriv innhaldet.
Sidetittelen er synleg på fana i nettlesaren og ligg i title-elementet i HTML-koden.
Vi sjekkar om title-elementet finst, og at teksten i elementet beskriv innhaldet på sida godt nok.
Bruker inspeksjonsverktøyet.
Men bra kode er ikkje nok, du må ha god design!
Det er mykje ubevisst bruk av design. Det er mykje som er laga for å sjå «kult» ut.
Men eg synast at det ikkje er kult viss det ikkje er brukarvenleg
Eg tenker at det er 4 ting du skal passe på når vi snakkar om god design:
Tydelege lenker
Kontrast
God fargebruk
Forstørring av innhald
Lenker skal vere tydeleg.
Kva er grunnen til at vi syns at lenker er så viktig?
Dette er ein av dei viktigaste måtane folk kjem seg rundt på nettstaden på.
Derfor må lenkene skilje seg tydeleg frå teksten.
La oss ta et eksempel…
Her er eit utsnitt av ei fiktiv nettside slik
ho vil sjå ut i sterkt sollys
eller for ein som er fargeblind.
Her er det ikke så lett å se hva som er lenker og ikke.
Kor mange lenkjer trur de det er her ?
Hvis vi legger på farger, blir det litt lettere å se.
Noen forslag?
Her er det seks lenker.
Her er det igjen sort-hvitt, men vi har understreket lenketeksten og da går det med en gang å se
Når vi testar, startar vi med å identifisere lenker i løpande tekst, der det er brukt farge for å skilje lenka frå teksten.
Vidare skal lenka ha anna markering i tillegg til farge, for eksempel med understreking (som her), feit skrift, ikon eller andre virkemiddel.
Sjekk kontrasten.
Det er heilt utruleg kor mykje dårleg kontrast som er ute å går.
Minn designaren på at det finst krav til kontrast mellom tekst og bakgrunn.
Det ser kanskje fint på retinaskjermen – men for svaksynte eller på mobilen ute i sola er det ein annan sak.
Det er ulike krav for stor og liten tekst.
En huskeregel kan være at:
stor tekst er det som er dobbelt så stor som brødteksten.
Alt annet er liten tekst.
Grensa for stor tekst er i WCAG 2.0 sett til 19px feit eller 24px vanleg og større. Då kan teksten ha kontrast heilt ned i 3,0:1. Er teksten mindre enn det må kontrasten minst være 4,5:1.
Det er som oftest ikke så mye som skal til for å få kontrasten opp på minimumsnivået, og det har stor effekt for mange brukere.
Det finnes mange gratis verktøy på nettet. Noen er automatiske.
Vi bruker colour contrast analyser til å teste
Tenk på fargebruken – sjølv om kontrasten er bra så tenk på at same farge ikkje ser lik ut for alle.
I for eksempel grafar og diagram, skal det verer mogleg å lese av grafen, sjølv om ein ikkje kan sjå alle fargane.
Vi tester derfor om informasjonen er formidla på en annen måte i tillegg til farge, for eksempel med mønster, eller ei form for kopling til tekst.
Det finns mange nettsider der du simulere ulike type fargeblindheit.
Det anbefalar eg – du kan få deg ein aha-opplevelse.
La meg vise dykk eit eksempel. Dette var noko vi gjorde – det handlar om bevisstheit.
Dette lysarket, brukte vi på eit foredrag i 2014, for å vise kor mange prosent av befolkningen som hadde nedsatt funksjonsevne.
Her er dei med nedsett funksjonsevne merka med rosa farge, for å skilje seg frå dei andre, som er grå.
Då eg skulle vise det til ein kollega lurte han på om alle hadde nedsatt funksjonsevne.
Nei, det er berre dei rosa, sa eg…
Han såg dette….
Alle var grå.
Han er fargeblind.
Dette viser - bruk meir enn berre farge!
Her kunne vi for eksempel brukt mønster eller skravering.
Innholdet skal også kunne forstørres utan tap av innhold og funksjonalitet. 200 %
Responsiv design kav være en egna måte å oppfylle kravet på.
Dette er et eksempel på en vanlig feil ved forstørring av innhald. Ved zoom kan deler av innholdet, for eksempel bakgrunnsbilde, legge seg over anna innhald og skjule eller gi dårleg kontrast.
Vi testar med å bruke zoomfunksjonen i nettlesaren. Viss dette ikkje fungerer, leiter vi etter ein zoomfunksjon på nettsida og testar eventuelt med den.
Og så, siste område – Tilgjengelig innhald
Rett før sommaren i fjor gjorde vi ein test av nettsidene til dei politiske partia på Stortinget. Eitt av partia gjekk ut i media og sa at dei skjønte ikkje kvifor dei scora dårleg, for dei hadde jo bestilt ei nettside som var universelt utforma for to år sidan.
Vi skjønnar at det er fort å tenke slik, men det kan du ikkje.
Du skal jo sjølv legge inn innhald – og det må vere tilgjengelig.
4 ting du bør passe på sjølv:
Lenketekst
Overskrift og liste
Video
Bilde
Lenketekstar
God lenketekst som forklarer målet for lenken.
enten alene
eller sammen med innholdet som står rundt lenken (konteksten), for eksempel tekst i samme avsnitt, i en overskriftscelle i tabell, eller forrige overskrift i innholdet.
I følge kravet er det nok at lenkemålet går fram av konteksten, t.d. med avsnitt at «referata frå kommunestyret finn du HER», (så er «HER» lenketeksten).
Likevel anbefaler vi at lenkemålet framgår av sjølve lenketeksten.
Og her er grunnen: Skjermlesarbrukarar kan skumlese sida ved å hente opp lenkene i ei liste.
Då ser det slik ut…. Ei lang liste, kor kvar lenke er les mer, les mer, les mer…
Derfor er det mykje betre å skrive tydelege lenker og ikkje berre les mer.
Når det gjeld overskrifter og lister, så er det noko vi ser mange gjer feil på.
For den som får teksten opplest ser det utan riktig struktur, slik ut. Ei lang blokk med tekst.
Det er ein enkelt å få til legge på rett struktur, med å bruke funksjonane som er i publiseringsløysinga.
Feit font kan bety at det ser ut som ei overskrift. Men det er ikkje koda som overskrift.
Overskrifter skal vere koda med h-elementa i HTML (eller tilsvarande koding som ivaretek strukturen).
Dette gjeld også lister.
Tankestrek er ikkje ei punktliste.
Bruk listeverktøyet når du lagar lister.
Lister skal være koda som liste, avhengig av om de er nummererte eller unummererte.
Då blir teksten sjåande slik ut både for den som ser, og for den som brukar hjelpemiddel.
For å teste koding av lenker, overskrifter og lister, bruker vi inspeksjonsverktøyet i nettleseren.
Slik kan det opplevast for dei over 700 000 nordmenn som har nedsett høyrsel.
Vi har snakka med Hørselshemmedes landsforbund, og dei påpeikar at det er eit stort demokratisk problem at alt frå Stortingsforhandlingar, kommunestyremøter til viktige infofilmar ikkje er teksta.
Vi tester om videoane er teksta og at tekstinga ikkje forstyrrer innhaldet i videoen.
Tekstinga skal gjengi både det som blir sagt, og viktige lydeffektar.
Videre til bilder.
Det kan være litt vrient å vurdere hva som er rett alt-tekst.
-På skjermen ser dere et eksempel på en alt-tekst – Kran med vann –
Dette er den informasjonen du får viss du ikke kan se bildet,
men får lest opp den alternative teksten med et hjelpemiddel.
La oss si at dette er et lenket bilde. Prøv å gjett hvor lenken leder.
… Jo, den lenker til en side om vannavstenging i kommuen.
Riktig alt-tekst er helt avgjørende for at brukerne som ikke ser bildet,
skal få med seg denne viktige informasjonen.
Det er ikkje nok at alt-teksten er der, den må også vere god nok.
alternativ tekst, skrives inn i HTML-koden og er knyttet til bildeelementet IMG i HTML.
Bruk alt-attributtet i HTML. Det skal alltid være med.
Funksjonen til bildet avgjer kva alt-tekst det skal ha.
Lenka bilde skal ha ein alt-tekst som beskriv lenkemålet
Pynt skal ha tom alt-tekst
Vanlege bilde skal ha ein alt-tekst som beskriv innhaldet
Komplekse bilde med mykje informasjon, skal ha ei lengre forklaring i tillegg.
For å teste alt-tekst bruker vi (noen forslag?)
Inspeksjonsverktøyet i nettleseren.
Vi leter etter alt-attributtet på img-elementet.
Alle steder der vi bruker inspeksjonsverktøyet, kan det finnes andre «mer brukervennlige» verktøy. Vi bruker inspeksjonsverktøyet for å få direkte tilgang til koden, i tilfellet kravet er oppfylt på en måte som verktøyene ikke tar høyde for.
I skjema må brukaren få tydeleg beskjed om kva dei skal skrive inn.
Vi testar difor om skjemaelement er identifiserte ved hjelp av ledetekstar eller instruksjonar, og at ledetekstane beskriv kva brukaren skal fylle inn.
Dersom skjemaelementa er obligatoriske, skal dei vere merka. Viss merkinga er eit symbol, for eksempel ei stjerne, skal det vere forklart før den er teke i bruk første gong.
Det kan for eksempel vere at brukaren har fylt inn feil informasjon i eit felt som krev eit særskild dataformat, for eksempel dato, eller brukaren har gløymd å fylle ut eit obligatorisk felt.
Viss skjemaet kan oppdage feil automatisk
I feilmeldinga skal brukaren få informasjon om
Kor feilen er
Kva som er feil
Og få forslag til korleis dei kan rette feilen
Feilmeldinga skal vere i form av tekst
Feilmeldingane treng ikkje vere lange, men dei må vere tydelege og spesifikke.
Vi testar med å sende inn eit tomt skjema og ved å sende inn eit skjema der vi har fylt inn feil informasjon. Vi vurderer så feilmeldingane som kjem opp.
Som mye av det jeg nettopp har sagt, er indikatorene og vår metode er i hovedsak manuell, med noko automatisering.
I og med at det er mye innhold som skal testes, er det en fordel å kunne automatisere der man kan.
Da er det noen krav som egner seg bedre til automatisering enn andre, for eksempel .
Kontrast
Grunnleggende tastaturnavigasjon
Kodesyntaks
Koding av språk
Automatisering er ikke egnet der man må vurdere meningsinnhold og betydning på innholdet. Som for eksempel
Tekstalternativ til bilde og video
Lenketekster
Overskrifter
Ledetekster og feilmeldingar i skjema
Vi forventer at mer og mer blir mulig å teste automatisk.
Som Malin, sjefen min, bruker å si: Hvis det er mulig å lage selvkjørende biler, må det være mulig å bruke kunstig intelligens til å vurdere alt-tekster på bilder.
I tillegg til å teste etter minimumskrava i standarden, anbefalar vi at de gjer brukartestar.
Test sida di med forskjellige brukarar – på alle stadier i utviklingsprosessen.
Vi får ofte fortvila e-postar frå folk som har brukartesta sida veka før produksjonssetting.
Brukartest med ulike brukarar allereie på designstadiet. Då sparar du pengar, tid og frustrasjon.
Tilsynet legg vekt på informasjon og rettleiing og tilsynets hovudkanal er uu.difi.no.
Treng du repetisjon?
Ta e-læringskurset vårt.
Gratis og ope for alle. Få alle i verksemda di som jobbar med nett til å ta det.
Kurset er delt inn i tema og ta heile eller deler av det, og bruk det som oppslagsverk .
Kort og lang versjon.
Indikatorsettet vårt. Bruk det gjerne for å teste eiga løysing. Gi gjerne tilbakemelding.
Ikkje det mest tilgjengelege formatet, i 50 Excel-arbeidsbøker. Jobber med ei meir tilgjengeleg løysing på sikt.
Rapport som beskriver metoden i detalj
Nettsida vår uu.difi-no har veiledn og info om regelverket.
Ta gjerne kontakt på epost dersom du har spørsmål, el tlf
Og følg oss gjerne på tw og fb