universell utforming som verktøy for betre nettsider
DESCRIPTION
Lysark frå foredrag hold på Oslo Kommunes WebdagTRANSCRIPT
Aud Marie Hauge, ekspert brukervennlighet og universell utforming
1
• At brukaren skal finne det han/ho leiter etter
• Minst mogeleg mas --> sjølvbetjening
2
Deltasenteret (2005):
”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
4
5
6
7
8
• Eldre
• Personar med nedsatte funksjonsevner
• Framandspråklege
• Undervegs
• …..
• ALLE
Tid er knapp ressurs
9
10
11
• Tenk tilgjengelegheit allerede i fase 1, fikse på
eksisterande nettsider kan vera ressurs- og
tidkrevande
• Føl standarder (HTML og CSS)
• WAI og Kvalitet på nett (Difi)
• Validering og manuell testing
• Brukertesting
12
• 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 2013, men likevel tidligst tolv måneder etter at det foreligger standarder eller retningslinjer for innholdet i plikten.”
• For eksisterande IKT-løsningar gjeld plikta frå 1. januar 2021.
• (http://universellutforming.difi.no/Komit%C3%A9innstilling)
13
• WCAG 2.0 AA
14
15
• God fargekonstrast
• Skalering av tekst
• Tydeleg lenkjestil
• Intuitiv tabulator-rekkefølgje
• Gjenkjennbart – til dømes global meny
16
• Transkripsjon av lyd- og videoinnhald
• Teksting av video
• Mogleik for lettlest versjon
• Kortversjon på andre språk
17
• Skriv for brukaren
• Alternativ tekst på ikkje tekstleg innhald
• Overskrift (med semantisk oppbygging)
• Skildrande tekst på lenkjer (unngå ”Les meir,
klikk her, meir”)
• Skildrande tekst på overskrifter
• Korrekt merking av tabellfelt
• Korrekt merking av skjemafelt og feilmeldingar
18
• Nokre retningslinjer
19
• Lenkjer må skilja seg frå løpande tekst
• Gode lenkjenamn som gjev mening teke 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
• Semantikk!
• Forklarande og meiningsbærande tekst
• WCAG 2.0, retningslinje 2.4.6, Level AA
– http://www.w3.org/TR/WCAG20/#navigation-
mechanisms-descriptive
• WCAG 2.0, retningslinje 1.4.3 (AA)
og 1.4.6 (AAA)
– http://www.w3.org/TR/WCAG2
0/#visual-audio-contrast-
contrast
– http://www.w3.org/TR/WCAG2
0/#visual-audio-contrast7
25
… også dei med nedsatte funksjonsevner
• Kven skal finne informasjon på din
nettstad?
• Uavhengig av funksjonsnedsetting
– Men for personer med nedsatt
funksjonsevne blir utfordringa med dårlege
nettsider endå større
• Dersom nettstaden din er universelt
utforma har den OGSÅ bra innhald
• Målgruppe
• Brukertesting
• Lovlige nettsider: WCAG 2.0 AA
• Bruk WCAG 2.0 som eit verktøy for
brukarvennlege nettsider for alle
Aud Marie
http://twitter.com/audmaha
www.epinova.no
• 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)
• http://www.bufetat.no/bufdir/deltasenteret/publikasjoner/
• WAI-ARIA
• ATAG
• www.w3.org/tr/mobile-bp
• Funkas retningslinjer for universell utforming på mobil
36