Universe l l u t f o r m i n g

Oslo WordPress meetup 24. september 2014 av Kristin Kokkersvold, Studio Netting

Internett er for alle

”Hvordan gjør dere det i forhold til de nye sidene som blir satt opp med tanke på Universell Utforming og de 32 eller 35 punktene som skal ivaretas?”

Anonym

Full forvirring #uu

” Hvis WordPress og themet en bruker er ikke "universell utformet" kan vi ikke lenger jobbe med det, eller? Dette virker ganske tragisk!?”

Anonym

”Skal bli litt moro å se om staten klarer å forby alle themes til f.eks. WordPress”

Anonym

”Leste meg opp og nettsider trenge ikke å oppfylle alle kravene kun rundt 50% og en velger selv hva det skal være.”

Anonym

”Alt fra landets største banker til den minste idrettsklubb må i løpet av få år skaffe seg nye, dyrere webløsninger. Lar man være, kan man straffes.”

Aftenposten

Universell utforming

Universell utforming handler om å utforme omgivelsene slik at vi tar hensyn til variasjonen i funksjonsevne hos innbyggerne, inkludert personer med nedsett funksjonsevne. Når du lager noe som er universelt utformet, når du alle målgruppene gjennom en og samme løsning.

Hvorfor skal vi bry oss?

?

L I K E ST I L L I N G S A M F U N N S Ø KO N OM I

S E O + U U = S A N T Å P E N T F O R A L L E

§ N O R S K LOV

”Nettet har fått sin våtromsnorm. Og det var jammen på tide.”

Wilhelm Joyce Andersen

Hvem gjør vi dette for?

Hvem?

•  For forstå kravene så må vi sette oss inn behovene

•  UU er for alle

”Det handler om reelle brukerbehov vi som jobber med digitale flater må ha et bevisst forhold til og tilrettelegge for”

Henriette Høyer

UU + WordPress = sant

” The web design and development community has disregarded and ignored accessibility for too long.”

Morten Rand-Henriksen

Hvordan skal vi jobbe med UU?

Les og lær

•  WCAG 2.0 AA •  Begynn med de 35 kriteriene •  HTML •  Test: – Test en nettside med tale – Hvordan ser nettsiden ut i ren tekst? – Hvordan ser siden ut for fargeblinde?

Arbeidsprosess

•  Ha med i hele prosessen: fra design, til kode og innholdspublisering.

•  Lag en sjekkliste for det man jobber med i forskjellige faser i utviklingen av et nettsted

•  Test nettsiden, både med verktøy, sjekklister og aller helst brukere.

•  Lær opp kunden/webredaktøren

Vår sjekkliste Overordnet Krav

Nivå

Roller

Notater Dette er viktig i vårt arbeid

Test

9 1.4.3 Mulig å skille fra hverandre

Kontrast (Minimum) Den visuelle presentasjonen av tekst og bilder av tekst har et kontrastforholdpå minst 4.5:1, unntatt i følgende tilfeller: Stor tekst: Stor skriftstørrelse og bilder av stor skriftstørrelse har et kontrastforhold på minst 3:1.

AA Designer 18  px  eller  14  px  bold  er  stor  tekst.  “18  point  text  or  14  point  bold  text  is  judged  to  be  large  enough  to  require  a  lower  contrast  ra<o”      “For  many  mainstream  body  text  fonts,  14  and  18  point  is  roughly  equivalent  to  1.2  and  1.5  em  or  to  120%  or  150%  of  the  default  size  for  body  text  (assuming  that  the  body  font  is  100%”

Contrast Verktøy under design og kontrolltest med WAVE

Feil kan rettes

•  Fordelen med web er at ingenting er hugget i stein og kan rettes fortløpende.

Strekk deg lenger enn loven

•  WCAG 2.0 AAA •  Klart språk •  Typografi og lesbarhet

Ressurser •  WCAG 2.0 på norsk: http://www.w3.org/Translations/WCAG20-no-20110926/

•  De 35 kravene i regelverket: http://uu.difi.no/veiledning/nettsider/krav-til-nettlosninger/krav-wcag

•  Veileder for regelverket: http://uu.difi.no

•  WordPress og UU: http://codex.wordpress.org/Accessibility

•  ”Som julekvelden på kjerringa”, Doga 17. juni 2014: http://vimeo.com/album/2923385

•  Oversikt over nyttige testverktøy: http://uu.difi.no/veiledning/nettsider/test-og-testverktoy/testverktoy

•  Plugin WP Accessibility: https://wordpress.org/plugins/wp-accessibility/

•  Lynxlet, tekst-basert nettleser for Mac: http://habilis.net/lynxlet/

•  Klarspråk: http://www.sprakrad.no/klarsprak/

Takk for meg!

Twitter: @kekkakokkers Epost: kristin@studionetting.no

Mobil: 911 07 367