tillganglig webb - bra för alla
DESCRIPTION
Tillgänglighet på webben: Vad? Varför? Hur? Introduktionsföreläsning från konferensen SiteVisiondagarna 2014TRANSCRIPT
![Page 1: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/1.jpg)
Hur tillgänglig är du?
Tillgänglig webb – bra för alla Sitevisiondagarna, 2014-10-08
Pär Lannerö
![Page 2: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/2.jpg)
Tillgänglig webb – bra för alla Agenda
1. Vem?
2. Vad?
3. Varför?
4. Hur?
![Page 3: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/3.jpg)
Tillgänglig webb – bra för alla Innan vi börjar…
Pär Lannerö Upphovsrätt Illustrationer @plannero
delegationen CC- BY pictogram.se #webbriktlinjer
webbriktlinjer.se
= dela gärna, ange källa: webbriktlinjer.se
![Page 4: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/4.jpg)
![Page 5: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/5.jpg)
E-delegationen
Enklare Öppnare Effektivare
E-förvaltning
”så enkelt som möjligt för så många som möjligt”
![Page 6: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/6.jpg)
Vägledning för webbutveckling
![Page 7: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/7.jpg)
Vägledning för webbutveckling
![Page 8: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/8.jpg)
Användbar
Åtkomlig
över tid
Förtroende-
ingivande Effektiv
Tekniskt
oberoende
Vägledning för webbutveckling
Tillgänglig
Sex principer
![Page 9: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/9.jpg)
![Page 10: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/10.jpg)
Vad?
1. Möjlig att uppfatta
2. Hanterbar
3. Begriplig
4. Robust
WCAGs principer för tillgänglighet
![Page 11: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/11.jpg)
Vad?
Erbjud alternativ
1. Möjlig att uppfatta
![Page 12: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/12.jpg)
Vad? 1. Möjlig att uppfatta för den som använder hörseln
Koda för skärmläsare! • Beskriv allt viktigt med text
Men ALT är inte ALLT!
• Label på inmatningsfält
• H-rubriker
• ARIA
• …
Provlyssna!
Syntolkning?
![Page 13: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/13.jpg)
Vad? 1. Möjlig att uppfatta för den som använder känseln
![Page 14: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/14.jpg)
Vad?
Texta video! Transkribera
tal! Teckentolka?
1. Möjlig att uppfatta för den som använder synen
• Tillräcklig kontrast
• Teckenstorlek till 200% • Tänk på färgblindhet
• </blink>
![Page 15: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/15.jpg)
Vad? 2. Hanterbar
![Page 16: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/16.jpg)
Vad? 2. Hanterbar
![Page 17: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/17.jpg)
Vad? 2. Hanterbar
![Page 18: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/18.jpg)
Vad? 3. Begriplig
![Page 19: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/19.jpg)
Vad? 3. Begriplig
![Page 20: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/20.jpg)
Vad? 4. Robust
Responsiv
Robust
![Page 21: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/21.jpg)
Vad? 4. Robust
Responsiv
Robust
![Page 22: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/22.jpg)
![Page 23: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/23.jpg)
Varför?
Självständighet
![Page 24: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/24.jpg)
Varför?
26% i ålder 16-64 år
har någon
funktionsnedsättning
(SCB 2013).
![Page 25: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/25.jpg)
Varför?
Fler med
funktionsnedsättning
bland äldre
![Page 26: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/26.jpg)
Varför?
100% har särskilda
behov ibland!
![Page 27: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/27.jpg)
Varför?
100% har särskilda
behov ibland!
![Page 28: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/28.jpg)
Varför?
Tillgänglighet
ökar ofta
användbarhet
för alla
![Page 29: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/29.jpg)
Varför?
SEO
![Page 30: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/30.jpg)
Varför?
• Mindre support
• Nöjda kunder
• Nöjda medarbetare
![Page 31: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/31.jpg)
Varför?
Stolta
webbutvecklare
![Page 32: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/32.jpg)
Varför?
• EU-direktiv om
Reglering ser ut att gå från BÖR till SKALL
![Page 33: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/33.jpg)
![Page 34: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/34.jpg)
Hur?
![Page 35: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/35.jpg)
Hur?
Ställ krav vid
beställningar:
• Uppfylla WCAG 2.0 AA
• Erfarenhet av att följa
webbriktlinjerna
![Page 36: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/36.jpg)
Hur?
Låt riktiga
användare testa
![Page 37: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/37.jpg)
Hur?
Låt personas ha
olika funktions-
nedsättningar!
![Page 38: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/38.jpg)
Hur?
Använd verktyg
Ex. – Validator.w3.org
– WAVE, WAT
– Validerat.se
– Colorbrewer
– Fangs
– NVDA, VoiceOver
– …
![Page 39: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/39.jpg)
Hur?
• Testa regelbundet
• Lätt att ta sönder
något som har
fungerat
![Page 40: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/40.jpg)
Hur?
• Bestäm
• Fördela ansvar
• Tilldela resurser
![Page 41: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/41.jpg)
Hur?
• Halvdag med tips
på hur du kan
komma igång
• Eftermiddagen den
2 december i
Stockholm
• Maila [email protected]
![Page 42: Tillganglig webb - bra för alla](https://reader033.vdocuments.pub/reader033/viewer/2022060115/557ad6b7d8b42a8f648b462b/html5/thumbnails/42.jpg)
Slut
Kontakta mig gärna!
par.lannero
@regeringskansliet.se
@plannero
0739-442043
webbriktlinjer.se