universell utforming som verktøy for betre nettsider

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

amh@epinova.no

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