Nettstedet ditt er snart ulovlig- hvilke krav stilles?

Aud Marie Hauge, ekspert i brukskvalitet og universell utforming i Epinova

1

Epinova

• Etablert Mai 2007

• 100 % eid av ansatte

• 26 ansatte

• Eksperter på fagfeltet CMS, EPiServer og Universell

Utforming

• Lang erfaring på utvikling av løsninger, teknologi og

muligheter

• Engasjert i å hente ut potensiale på nett.

• Teknisk implementering av EPiServer CMS

2

Hva er universell utforming?

Deltasenteret (2005) sin definisjon:

”Begrepet universell utforming blir ofte brukt synonymt

med tilgjengelighet for alle, planlegging for alle og

design for alle. Universell utforming vil si å utforme

produkter og omgivelser på en slik måte at de kan

benyttes av alle mennesker, i så stor utstrekning som

mulig, uten behov for tilpassing eller spesiell

utforming”

3

Tilgjengelighetspyramiden

4

De 7 prinsipp for universell utforming

• The Center for Universal Design ved North Carolina

State University

1. Like muligheter for bruk

2. Fleksibel i bruk

3. Enkel og intuitiv i bruk

4. Forståelig informasjon

5. Toleranse for feil

6. Lav fysisk anstrengelse

7. Størrelse og plass for tilgang og bruk

5

Er dette universelt utforma?

6

7

Alternative løysingar

8

Tilgjengelighet

• Fysisk tilgjengelighet– Bygg

– Transport

• Digital tilgjengelighet– Nettsider

– Automater

9

Hvem trenger tilgjengelige nettsider?

ALLE, men spesielt

• Eldre

• Personer med nedsatte funksjonsevner

• Fremmedspråklige

• Brukere av PDA, mobiltelefoner, eldre nettlesere,

små skjermer

• Brukere med datamaskin uten høyttaler m.m

10

Personer med nedsatt syn

Fakta, fra Blindeforbundet sine nettsider:

• 130 000 nordmenn har så svekket syn at de regnes

som synshemmede

• 70 prosent av alle over 70 år får grå stær (tåkesyn)

• Vel 37 millioner av jordas befolkning er blinde og 124

millioner er svaksynte

• Fargeblinde; mellom 5% og 8% av alle menn er

fargeblind

11

Fargeblind?

12

Personer med nedsatt syn på nett

• Skjermleser

• Leselist

• Skjermforstørrer

13

Personer kognitive utfordringer

• Kognitive utfordringer kan være problem

med– Lesing

– Problemløsning

– Konsentrasjon

– Matematikk

• Type kognitiv utfordring kan være– Dysleksi: http://www.dysleksiforbundet.no/

14

En dag er det deg

15

Hvorfor tilgjengelige nettsider?

• Juridisk

• Økonomisk

• Etisk

16

Diskriminerings og tilgjengelighetsloven

• Sikre alle like muligheter og rettigheter til

samfunnsdeltakelse

• hindre diskriminering på grunn av nedsatt

funksjonsevne

• bidra til nedbygging av samfunnsskapte

funksjonshemmede barrierer og hindre at

nye skapes

17

DTL - virkeområde

• Offentlige virksomheter– Jobbe for å fremme universell utforming i virksomheten

• Private virksomheter– Gjelder tilsvarende rettet mot allmennheten

18

DTL - unntak

• Uforholdsmessig byrde– så langt det ikke medfører en uforholdsmessig byrde for

virksomheten

19

DTL - aktivitetsplikt

• «Arbeidsgivere i privat sektor som jevnlig

sysselsetter mer enn 50 ansatte, og

arbeidsgivere i offentlig sektor skal

arbeide aktivt, målrettet og planmessig for

å fremme lovens formål innenfor sin

virksomhet». (http://www.handboka.no/Sak/Lover/

Diskrim/disk01.htm)

20

DTL - § 11

• Plikt til universell utforming av IKT• Nye IKT-løsninger som underbygger virksomhetens

alminnelige funksjoner, og som er hovedløsninger rettet mot eller stillet til rådighet for allmennheten, skal være universelt utformet fra og med 1. juli 2011, men likevel tidligst tolv måneder etter at det foreligger standarder eller retningslinjer for innholdet i plikten.

• For eksisterende IKT-løsninger gjelder plikten fra 1. januar 2021.

• (http://universellutforming.difi.no/Komit%C3%A9innstilling)

21

DTL - § 11

22

DTL - § 11 – håndheving

• Difi har tilsynet

• Kan kreve tilgang til løsninger (innloggede

tenester)

• Kan vedtak tvangsmulkt for å sikre

gjennomføring av pålegg

23

Hvordan gjøre nettsider tilgjengelige?

• Tenk tilgjengelighet allerede i fase 1, fikse på

allerede eksisterende nettsteder kan være

ressurs- og tidkrevende

• Følge standarder (HTML og CSS)

• Følge WAI og Difi sine retningslinjer for

tilgjengelighet

• Validering og manuell testing

• Brukertesting

24

Hvordan oppfylle loven?

• WCAG 2.0 AA

25

WAI og Difi/Norge.no

WAIhttp://www.w3.org/WAI/intro/wcag#is (WAI)

– WCAG 2.0 på norsk

www.difi.nohttp://kvalitet.difi.no/

26

WCAG 2.0

WAIhttp://www.w3.org/WAI/intro/wcag#is (WAI)

– WCAG 2.0 på norsk

www.difi.nohttp://kvalitet.difi.no/

27

Innhold er viktig!

• Skriv for brukeren

• Alternativ text på bilder

• Overskrifter (med semantisk oppbygging)

• Beskrivende tekst på linker (unngå ”Les mer,

klikk her, mer”)

• Beskrivende tekst på overskrifter

• Korrekt merking av tabellfelter

• Korrekt merking av skjemafelter

28

Navigasjon og design

• Gode fargekonstraster

• Skalering av tekst

• Tydelig lenkestil

• Intuitiv tabulator-rekkefølge

• Gjenkjennbart – f.eks global meny

29

Funksjonalitet

• Transkripsjoner av lyd- og videoinnhold

• Teksting av video

• Mulighet for lettlest versjon

• Kortversjoner på andre språk

30

WCAG 2.0

• Noen retningslinjer

31

Linker

• Linker må skille seg fra løpende tekst

• Gode linknavn som gir mening tatt ut av kontekst

• WCAG 2.0, retningslinje 2.4.4 (A) og 2.4.9 (AAA)

– http://www.w3.org/TR/WCAG20/#navigation-mechanisms-refs

– http://www.w3.org/TR/WCAG20/#navigation-mechanisms-link

Alternativ tekst på bileter

33

• WCAG 2.0, Retningslinje 1.1.1, Level A– http://www.w3.org/TR/2008/REC-WCAG20-20081211/#

text-equiv-all

Overskrifter

• Semantikk!

• Forklarande og meningsfull tekst

• WCAG 2.0, retningslinje 2.4.6, Level AA– http://www.w3.org/TR/WCAG20/#

navigation-mechanisms-descriptive

God tilgjengelighet

Dårleg tilgjengelighet

Tabulatorrekkefølge

• WCAG 2.0, retningslinje 2.1.1, Level A:– http://www.w3.org/TR/WCAG20/#keyboard-operation – Viktig for personer som ikke har mulighet til å bruke mus

• Test ved å bruke tabulator når man går gjennom løysinga

Zoom

• WCAG 2.0, retningslinje 1.4.4, Level AA:– http://www.w3.org/TR/WCAG20/#

visual-audio-contrast-scale– Bruk relative størrelser (em, %)

Kontrast

• WCAG 2.0, retningslinje 1.4.3 (AA)

og 1.4.6 (AAA)

– http://www.w3.org/TR/WCAG20/

#

visual-audio-contrast-contrast

– http://www.w3.org/TR/WCAG20/

#

visual-audio-contrast7

40

Konklusjon

• Universell utforming er enkelt

• Lovlige nettsider: WCAG 2.0 AA

Kontaktinfo

Aud Marie

amh@epinova.no

http://twitter.com/audmaha

www.epinova.no

Testing med toolbar

• http://www.visionaustralia.org.au/ais/toolbar/ (IE)

• http://chrispederick.com/work/webdeveloper (Firefox)

• Firebug(Firefox)

• http://browsershots.org (Nettlesertesting)

• http://accessibility.egovmon.no/en/pagecheck/ (Teste

tilgjengelighet)

Deltasenteret sine veiledere

• http://www.bufetat.no/bufdir/deltasenteret/publikasjoner/