SlideShare a Scribd company logo
1 of 86
Universell utforming av ikt –
hva er status?
Dagfinn Rømen
Oslo, 30. august 2018
• Film om uu på 2 min, se https://uu.difi.no/kva-er-universell-
utforming/universell-utforming-pa-2-minutter
Tilsyn for universell utforming av IKTTilsyn for universell utforming av IKT
GRUNNAR
SAMFUNNSØKONOMISK
«En forutsetning for økt
bruk av IKT er at
løsningene blir tilgjengelige
for alle.»
© Berit Roald / NTB scanpix
Høyrselshemma 700 000
Teiknspråkbrukarar 15 000
Blinde og svaksynte 180 000
Lesevanskar 430 000
Eldre over 67 740 000
Norsk som andrespråk 690 000
Tilsyn for universell utforming av IKT
LIKE MOGLEGHEITER
«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
SMART
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
Tilsyn for universell utforming av IKT
LØNNSAMT
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
Tilsyn for universell utforming av IKT
FRAMTIDSRETTA
Tilsyn for universell utforming av
IKT
Tilsyn for universell utforming av IKT
Tilsyn for universell utforming av IKT
LOVKRAV
Lovkrav og tilsyn
Privat sektor
Kven gjeld det?
Kommunal sektorStatleg sektor
Lag og organisasjoner
© thinkstock.com
Retta mot allmennheiten i Norge
• Retningslinjer for
tilgjengeleg webinnhald
(WCAG) 2.0
• Etablert internasjonal
standard
Standarden for nettløysingar
Tilsyn
Kunnskapsgrunnlag
Informasjon
Fagorgan
EU følgjer etter
Frå WCAG 2.0 til 2.1
Intranett
Når gjeld dei nye krava?
• 1. juli 2020: Nye nettstadar
• 23. september 2020: Eksisterande nettstadar
• 23. juni 2021: Mobilapplikasjonar
Opent for endring
Følg med på uu.difi.no
Kva har vi testa på nettstadene?
Tilsyn for universell utforming av IKT
Universell utforming er lagarbeid
Behov Krav Data
Brukarar Standard Indikatorar Informasjon
God kode
God kode
Bra design
God kode
Bra design
Tilgjengeleg innhald
God kode
Gjeld kode deg?
• Tab-tasten, piltastane og enter-tasten
• Muleg å bruke alt innhald
• Logisk rekkefølge
• Snarveg til hovudinnhald
• Ingen tastaturfeller
Tastaturnavigasjon
Synleg fokusmarkering
Koding av skjema
Tilsyn for universell utforming av IKT
Sidetittel
Bra design
God kode
Lenker skal vere tydelege
Sjekk kontrasten
Er teksten minst
19px feit eller 24px vanleg?
Minst
3,0:1
Minst
4,5:1
Ja
Nei
Stor eller liten tekst?
Gratis verktøy
Tenk på fargebruken
Tilgjengeleg innhald
Bra design
God kode
Les mer
Les mer
Les mer
Les mer
Les mer
Les mer
Les mer
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.
Husk å markere overskrifter
som en overskrift
Bruk listeverktøyet til
å lage lister
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
Hugs å tekste video
Alt = “Kran med vann”
Hugs å gi lenka bilde
ein alt-tekst som seier
noko om lenkemålet
Vannavstenging
Tilsyn for universell utforming av IKT
© thinkstock.com
Brukartest
uu.difi.no
E-læringskurs
uu.difi.no/elæring
Tilsyn for universell utforming av IKT
@uudifi @uudifi
24 05 56 10uu@difi.nouu.difi.no
Universell utforming av ikt - hva er status

More Related Content

Similar to Universell utforming av ikt - hva er status

Intranett i NSB-konsernet
Intranett i NSB-konsernetIntranett i NSB-konsernet
Intranett i NSB-konsernetPia Solheim
 
GoOpen 2010: Espen Dalløkken
GoOpen 2010: Espen DalløkkenGoOpen 2010: Espen Dalløkken
GoOpen 2010: Espen DalløkkenFriprogsenteret
 
Å bygge tillit gjennom innhald
Å bygge tillit gjennom innhaldÅ bygge tillit gjennom innhald
Å bygge tillit gjennom innhaldAre Halland
 
Universell utforming av digitale løsninger
Universell utforming av digitale løsningerUniversell utforming av digitale løsninger
Universell utforming av digitale løsningerMetronet
 
Webdagene2007 Christian Johansen Webutvikling
Webdagene2007 Christian Johansen WebutviklingWebdagene2007 Christian Johansen Webutvikling
Webdagene2007 Christian Johansen WebutviklingAnette Urhamar
 
Universell utforming, Frokostseminar hos Bouvet 21.5
Universell utforming, Frokostseminar hos Bouvet 21.5Universell utforming, Frokostseminar hos Bouvet 21.5
Universell utforming, Frokostseminar hos Bouvet 21.5Henriette Høyer
 
Åpne Standarder - hvor er vi og hvor går vi?
Åpne Standarder - hvor er vi og hvor går vi?Åpne Standarder - hvor er vi og hvor går vi?
Åpne Standarder - hvor er vi og hvor går vi?Heidi Austlid
 
Universell utforming som verktøy for betre nettsider
Universell utforming som verktøy for betre nettsiderUniversell utforming som verktøy for betre nettsider
Universell utforming som verktøy for betre nettsideraudmaha
 
Rules engine vs. domain logic - JavaZone 2009
Rules engine vs. domain logic - JavaZone 2009Rules engine vs. domain logic - JavaZone 2009
Rules engine vs. domain logic - JavaZone 2009Anders Sveen
 
Trygg på web kristiansand
Trygg på web kristiansandTrygg på web kristiansand
Trygg på web kristiansandfskj
 
Universell utforming: Internett er for alle!
Universell utforming: Internett er for alle!Universell utforming: Internett er for alle!
Universell utforming: Internett er for alle!Kristin Kokkersvold
 
Spor 1 arkitekturelle rammeverk i offentlig sektor
Spor 1   arkitekturelle rammeverk i offentlig sektorSpor 1   arkitekturelle rammeverk i offentlig sektor
Spor 1 arkitekturelle rammeverk i offentlig sektorSteria Norway
 
Universell utforming av IKT
Universell utforming av IKTUniversell utforming av IKT
Universell utforming av IKTAxel Wathne
 
Core trek 2014
Core trek 2014Core trek 2014
Core trek 2014CoreTrek
 
Rwd seminar 2013
Rwd seminar 2013Rwd seminar 2013
Rwd seminar 2013CoreTrek
 
Trygg på web Oslo
Trygg på web OsloTrygg på web Oslo
Trygg på web Oslofskj
 

Similar to Universell utforming av ikt - hva er status (20)

Intranett i NSB-konsernet
Intranett i NSB-konsernetIntranett i NSB-konsernet
Intranett i NSB-konsernet
 
GoOpen 2010: Espen Dalløkken
GoOpen 2010: Espen DalløkkenGoOpen 2010: Espen Dalløkken
GoOpen 2010: Espen Dalløkken
 
Å bygge tillit gjennom innhald
Å bygge tillit gjennom innhaldÅ bygge tillit gjennom innhald
Å bygge tillit gjennom innhald
 
Universell utforming av digitale løsninger
Universell utforming av digitale løsningerUniversell utforming av digitale løsninger
Universell utforming av digitale løsninger
 
Webdagene2007 Christian Johansen Webutvikling
Webdagene2007 Christian Johansen WebutviklingWebdagene2007 Christian Johansen Webutvikling
Webdagene2007 Christian Johansen Webutvikling
 
Universell utforming, Frokostseminar hos Bouvet 21.5
Universell utforming, Frokostseminar hos Bouvet 21.5Universell utforming, Frokostseminar hos Bouvet 21.5
Universell utforming, Frokostseminar hos Bouvet 21.5
 
Åpne Standarder - hvor er vi og hvor går vi?
Åpne Standarder - hvor er vi og hvor går vi?Åpne Standarder - hvor er vi og hvor går vi?
Åpne Standarder - hvor er vi og hvor går vi?
 
Universell utforming som verktøy for betre nettsider
Universell utforming som verktøy for betre nettsiderUniversell utforming som verktøy for betre nettsider
Universell utforming som verktøy for betre nettsider
 
Rules engine vs. domain logic - JavaZone 2009
Rules engine vs. domain logic - JavaZone 2009Rules engine vs. domain logic - JavaZone 2009
Rules engine vs. domain logic - JavaZone 2009
 
Trygg på web kristiansand
Trygg på web kristiansandTrygg på web kristiansand
Trygg på web kristiansand
 
Innholdsstrategi
InnholdsstrategiInnholdsstrategi
Innholdsstrategi
 
Universell utforming: Internett er for alle!
Universell utforming: Internett er for alle!Universell utforming: Internett er for alle!
Universell utforming: Internett er for alle!
 
Roadshow novermber 2014: Alle skal med /ved Frank Fardal
Roadshow novermber 2014: Alle skal med /ved Frank FardalRoadshow novermber 2014: Alle skal med /ved Frank Fardal
Roadshow novermber 2014: Alle skal med /ved Frank Fardal
 
Semantisk integrasjon
Semantisk integrasjonSemantisk integrasjon
Semantisk integrasjon
 
Spor 1 arkitekturelle rammeverk i offentlig sektor
Spor 1   arkitekturelle rammeverk i offentlig sektorSpor 1   arkitekturelle rammeverk i offentlig sektor
Spor 1 arkitekturelle rammeverk i offentlig sektor
 
Universell utforming av IKT
Universell utforming av IKTUniversell utforming av IKT
Universell utforming av IKT
 
Uu skolen, Yggdrasil15
Uu skolen, Yggdrasil15Uu skolen, Yggdrasil15
Uu skolen, Yggdrasil15
 
Core trek 2014
Core trek 2014Core trek 2014
Core trek 2014
 
Rwd seminar 2013
Rwd seminar 2013Rwd seminar 2013
Rwd seminar 2013
 
Trygg på web Oslo
Trygg på web OsloTrygg på web Oslo
Trygg på web Oslo
 

More from Tilsyn for universell utforming av ikt

The norwegian ict accessibility legislation, methods and indicators malin r...
The norwegian ict accessibility legislation, methods and indicators   malin r...The norwegian ict accessibility legislation, methods and indicators   malin r...
The norwegian ict accessibility legislation, methods and indicators malin r...Tilsyn for universell utforming av ikt
 
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...Tilsyn for universell utforming av ikt
 
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...Tilsyn for universell utforming av ikt
 
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...Tilsyn for universell utforming av ikt
 
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...Tilsyn for universell utforming av ikt
 
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...Tilsyn for universell utforming av ikt
 

More from Tilsyn for universell utforming av ikt (15)

2020 05 25 videoforedrag banksektor tieto evry med manus
2020 05 25 videoforedrag banksektor tieto evry med manus2020 05 25 videoforedrag banksektor tieto evry med manus
2020 05 25 videoforedrag banksektor tieto evry med manus
 
Tilsynets kontroller, EUs webdirektiv og WAI-tools
Tilsynets kontroller, EUs webdirektiv og WAI-toolsTilsynets kontroller, EUs webdirektiv og WAI-tools
Tilsynets kontroller, EUs webdirektiv og WAI-tools
 
Universell utforming av ikt
Universell utforming av iktUniversell utforming av ikt
Universell utforming av ikt
 
Våre funn i utdanning og litt om rettleiing
Våre funn i utdanning og litt om rettleiingVåre funn i utdanning og litt om rettleiing
Våre funn i utdanning og litt om rettleiing
 
Bevegelse i samfunnet med universell utforming
Bevegelse i samfunnet med universell utformingBevegelse i samfunnet med universell utforming
Bevegelse i samfunnet med universell utforming
 
The norwegian ict accessibility legislation, methods and indicators malin r...
The norwegian ict accessibility legislation, methods and indicators   malin r...The norwegian ict accessibility legislation, methods and indicators   malin r...
The norwegian ict accessibility legislation, methods and indicators malin r...
 
Preparing to fail - 7 grunnar til universell utforming
Preparing to fail - 7 grunnar til universell utformingPreparing to fail - 7 grunnar til universell utforming
Preparing to fail - 7 grunnar til universell utforming
 
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...
Fagdag om universell utforming av nettsider 12. november 2015 - Universell ut...
 
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...
Fagdag om universell utforming av nettsider 12. november 2015 - Råd og prakti...
 
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...
Fagdag om universell utforming av nettsider 12. november 2015 - Design og inn...
 
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...
Fagdag om universell utforming av nettløysingar 12. november 2015 - Kven er b...
 
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...
Fagdag om universell utforming av nettsider 12. november 2015 - Her er regelv...
 
Roadshow novermber 2014: Alle skal med /ved Malin Rygg
Roadshow novermber 2014: Alle skal med /ved Malin RyggRoadshow novermber 2014: Alle skal med /ved Malin Rygg
Roadshow novermber 2014: Alle skal med /ved Malin Rygg
 
Roadshow novermber 2014: Alle skal med /ved Cathrine Von Porat
Roadshow novermber 2014: Alle skal med /ved Cathrine Von PoratRoadshow novermber 2014: Alle skal med /ved Cathrine Von Porat
Roadshow novermber 2014: Alle skal med /ved Cathrine Von Porat
 
Velkommen til informasjonseminar
Velkommen til informasjonseminarVelkommen til informasjonseminar
Velkommen til informasjonseminar
 

Universell utforming av ikt - hva er status

Editor's Notes

  1. 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.
  2. Ein litt kjedeleg grunn først - universell utforming er samfunnsøkonomisk lønnsomt
  3. 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.
  4. Vi brukar å seie at universell utforming gir like mulegheiter – også i den digitale verden.
  5. 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.
  6. 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.
  7. Universell utforming er smart! Kort og godt. Det er bra for brukarane, men det er også smart for virksomhetene.
  8. 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.
  9. 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.
  10. For det er nemleg lønnsamt. Universell utforming er ikkje berre lønnsomt for samfunnet – det er lønnsamt for virksomhetene.
  11. 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.
  12. 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.
  13. Universell utforming gir fremtidsretta løysingar!
  14. 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.
  15. 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.
  16. Uansett om du ikkje syns dei 5 foregåande grunnane var gode nok – universell utforming av ikt er faktisk pålagt ved lov!
  17. 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.
  18. 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.
  19. Ikt-løysinga må vere retta mot publikum i Norge Integrert del av måten verksemda informerer og tilbyr sine tenester til publikum.
  20. Ikt-løsninger i forskrifta er definert som nettsider, apper og automater.
  21. 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
  22. 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.
  23. 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.
  24. 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?
  25. 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.
  26. 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.
  27. 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
  28. 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.
  29. 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.
  30. 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.
  31. 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.
  32. Å 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.
  33. 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.
  34. 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
  35. 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.
  36. 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.
  37. 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.
  38. 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.
  39. 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.
  40. 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:
  41. 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
  42. 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.
  43. 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.
  44. 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
  45. I tillegg skal koden unngå enkelte syntaksfeil som er spesifisert i WCAG Her tester vi med HTML-validatoren til W3C.
  46. 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.
  47. For å teste bruker vi inspeksjonsverktøyet i nettleseren.
  48. 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.
  49. Men bra kode er ikkje nok, du må ha god design!
  50. 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
  51. 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…
  52. 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 ? 
  53. Hvis vi legger på farger, blir det litt lettere å se. Noen forslag? Her er det seks lenker.
  54. 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.
  55. 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.
  56. 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.
  57. Det finnes mange gratis verktøy på nettet. Noen er automatiske. Vi bruker colour contrast analyser til å teste
  58. 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.
  59. 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….
  60. Alle var grå. Han er fargeblind. Dette viser - bruk meir enn berre farge! Her kunne vi for eksempel brukt mønster eller skravering.
  61. 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.
  62. 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.
  63. 4 ting du bør passe på sjølv: Lenketekst Overskrift og liste Video Bilde
  64. 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.
  65. 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.
  66. 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).
  67. 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.
  68. Då blir teksten sjåande slik ut både for den som ser, og for den som brukar hjelpemiddel.
  69. For å teste koding av lenker, overskrifter og lister, bruker vi inspeksjonsverktøyet i nettleseren.
  70. 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.
  71. 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.
  72. … 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.
  73. 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?)
  74. 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.
  75. 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.
  76. 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.
  77. 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.
  78. 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.
  79. Tilsynet legg vekt på informasjon og rettleiing og tilsynets hovudkanal er uu.difi.no.
  80. 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.
  81. 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
  82. 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