Webbinarium om det nya webbdirektivet

Webbinarium om det nya webbdirektivet 22 mars 2018 Sveriges Kommuner och Landsting Pär Lannerö, Post- och telestyrelsen Ida Franceen, Futurice / T12T webbriktlinjer.se/webbdirektivet

Agenda 1. Övergripande om direktivet Vad och varför? Vem? När? 2. Tillgänglighetskraven Genomgång av WCAG 2.0 AA Genomgång av WCAG 2.1 AA - gäller troligen i höst 3. Mer om direktivet Undantag Tillgänglighetsutlåtande Kommentarsfunktion Uppföljning Angränsande reglering 4. Kom igång

Figurer: Johanna Rydeman, Certec Vad och varför? Funktionshinder Omgivningens krav Individens förmågor Hjälpmedel Assistans Tillgänglighet

Figurer: Johanna Rydeman, Certec Vad och varför? Individens förmågor Omgivningens krav Hjälpmedel Assistans Tillgänglighet

Vad och varför? Nödvändigt för 10% Underlättar för 30% Bekvämt för alla Remote CC-BY-SA Santeri Viinamäki.

Vad och varför? EU-parlamentet 26 okt 2016: Direktiv 2016/2102 om tillgänglighet avseende offentliga myndigheters webbplatser och mobila applikationer

Vad och varför? Finansdepartementet 28 nov 2017: Förslag om Lag om tillgänglighet till digital offentlig service (tjänster eller information som en offentlig aktör tillhandahåller via en teknisk lösning)

Skillnader mellan direktivet och regeringsförslaget Digital offentlig service webbplatser och appar + Digital service via tredjepart så långt det är möjligt. Detaljer kommer i föreskrifter från myndigheten för digital förvaltning.

Vem? Offentliga aktörer myndigheter, kommuner, landsting och offentligt styrda organ sammanslutningar av sådana privata offentligfinansierad skola, hälso- och sjukvård samt omsorg enskilda utbildningsanordnare med examenstillstånd

Vem? Undantagna: NGOs (icke-statliga organisationer, även om de är offentligfinansierade) förutom samhällsviktig service och tjänster avsedda för personer med funktionsnedsättning Public service (radio- och televisionsföretag med uppdrag i allmänhetens tjänst) - dessa förväntas omfattas av annan kommande reglering

När? September 23 Ny lag, och dags att tillgängliggöra dokument - 23 september 2018 Krav på webbplatser - 23 september 2019 (nya) - 23 september 2020 (befintliga publika) - vid omfattande översyn (befintliga icke publika) Krav på inspelningar och tjänster via tredje part - 23 september 2020 Krav på publika appar - 23 juni 2021

Tillgänglighetskrav Regeringen eller den myndighet som regeringen bestämmer får meddela föreskrifter om vilka krav på tillgänglighet som ska gälla och när kraven ska börja tillämpas. Sådana föreskrifter ska överensstämma med artikel 6 i webbtillgänglighetsdirektivet.

Tillgänglighetskrav När det finns en godtagen HEN-standard (preliminärt, men inte säkert, i sommar) så räcker det att uppfylla den. Regeringen Till eller dess: den myndighet som regeringen bestämmer får meddela föreskrifter om vilka krav på tillgänglighet som ska gälla och när kraven ska börja tillämpas. åtminstone motsvarar den nivå som säkerställs genom europeisk standard EN 301 549 Sådana föreskrifter ska överensstämma med artikel 6 i webbtillgänglighetsdirektivet.

EN 301 549 innebörd för webb & appar WCAG 2.0 AA

EN 301 549 innebörd för webb & appar WCAG 2.0 AA = webbriktlinjer.se/1 sedan 2011

Robust EN 301 549 Möjlig att uppfatta Hanterbar Begriplig WCAG 2.0 AA

1.1 Textalternativ Till allt betydelsefullt innehåll som inte är text, så att det kan konverteras till tal stor stil punktskrift DSC20345.jpg Foto: Jan Persson Ange bildtext här En vit blomma

1.2 Alternativ till tidsberoende media Video Spel Annan rörlig media Från och med 23/9 2020

1.2 Alternativ till tidsberoende media En telefon ringer - Hej det är jag! Texta dialog, miljöljud, vem talar

1.2 Alternativ till tidsberoende media Ada står vänd mot kameran Ringsignal. - Hej det är jag! Syntolkning

1.2 Alternativ till tidsberoende media Ada står vänd mot kameran Dåligt exempel Ringsignal. - Hej det är jag! Syntolkning

1.2 Alternativ till tidsberoende media Uppfattas ibland som betungande och nytt Därför ordnar vi en Temadag om tillgänglig webbvideo 20 april i Malmö Medverkan från SRF, HRF, SDR, SVT Webbsänds: webbriktlinjer.se/webbvideo

1.3 Anpassningsbart Skapa innehåll som kan presenteras på olika sätt utan att information eller struktur går förlorad. Hur då? Semantiskt kodad struktur (rubriker, formulär, tabeller ) Logisk ordning vid t.ex. skärmläsning CC-BY Reignfire @flickr

1.4 Urskiljbart Inte bara färg Tillräcklig kontrast Kunna förstora Kunna stänga av ljud

2.1 Tillgängligt via tangentbord Då fungerar det även med många alternativa styrmedel

2.2 Tillräckligt med tid

2.3 Ej flimmer

2.4 Navigerbart Var är jag? Beskrivande sidtitel, rubriker och etiketter Tydligt vilket fält/element som är i fokus

2.4 Navigerbart Kunna komma vidare: Hoppa förbi menyer mm. Logisk tab-ordning Länks funktion ska framgå av länken/sammanhanget Mer än ett sätt att navigera till en sida

3.1 Läsbart Språk anges i kod <body lang= sv > <select id= newlanguage > <option id= 1 lang= fr >Francais</option> <option id= 2 lang= en >English</option> <option id= 3 lang= de >Deutch</option> </select> Klarspråk, teckenspråk också viktigt men saknas i AA

3.2 Förutsägbart Inga oväntade förändringar vid fokusering eller inmatning Konsekvent navigation och benämning

3.3 Inmatningsstöd Hjälp användare att undvika misstag Etiketter vid inmatning Vid viktiga transaktioner: bekräftelsesteg, möjlighet kontrollera indata, ångra och rätta till misstag. Tydlig indikering av var fel uppstått Förslag på åtgärd Förlåtande

4.1 Kompatibelt Korrekt HTML-kod Responsiv Robust

Vad är WCAG 2.1? En ny version av den ca 10 år gamla WCAG 2.0 Förväntas bli standard (W3C Rekommendation) sommaren 2018. Sannolikt även ny version av EN 301 549 (HEN) i sommar som hänvisar till WCAG 2.1 istället för WCAG 2.0.

Vad är WCAG 2.1? Utökar WCAG med nya kriterier Bl.a. för bättre kognitiv och mobil tillgänglighet Helt bakåtkompatibel Förändrar ingenting i WCAG 2.0 Samma principer Samma numrering Samma nivåindelning A - AAA Bredare och omstrukturerad WCAG 3.0 förväntas om en handfull år.

Robust WCAG 2.0 Presenteras på webbriktlinjer.se/1 Möjlig att uppfatta (28st) Hanterbar Begriplig (33st) (18st) (2st)

Robust WCAG 2.0 2.1 AA Möjlig att uppfatta (14st) +6 Hanterbar (12st) +6 Begriplig (10st) +1 (2st)

Robust WCAG 2.0 2.1 AA Möjlig att uppfatta (14st) +6 Hanterbar Begriplig (12st) (10st) (2st)

1.3.4 Identify Common Purpose Märk upp vanliga inmatningsfält med standard-semantik (exempelvis wai-aria/schema.org). Ger möjlighet till förenkling med hjälp av symboler, smart autocomplete mm. Bra för användare med vissa kognitiva funktionsnedsättningar och för den som inte kan sidans språk så bra. name given-name additional-name family-name nickname username new-password current-password organization-title organization street-address address-line1 address-line2 address-level1 country country-name postal-code cc-name cc-exp cc-csc Exempel på innehåll cc-type transactioncurrency transaction-amount language bday sex url photo

Illustrationer från http://nosetothepage.org/fitz/2dscroll.html 1.4.10 Reflow Kunna använda 320 pixlar bred skärm utan horistontell scrollning (med undantag). I praktiken: responsiv design. Underlättar mycket för den som behöver förstora. Besläktad med kravet att kunna förstora text (1.4.4).

1.4.11 Non-Text Contrast Utvidgar kontrastkravet för text i 1.4.3 till innehåll i grafik, knappar och andra kontroller. Bra för personer med nedsatt syn. Bra kontrast Dålig kontrast

Illustrationer från W3Cs Understanding WCAG 1.4.12 1.4.12 Text Spacing Måste kunna öka avstånd mellan stycken, rader, ord och tecken upp till angivna gränsvärden utan t.ex. krockar. Bra för dyslektiker och personer med nedsatt syn. Görs med css. Besläktad med kravet att kunna förstora text (1.4.4).

1.4.13 Content on Hover or Focus Popups, tooltips och liknande ska kunna uppfattas och kontrolleras även av användare som t.ex. använder förstoring. Tack! Kunna stängas enkelt (med t.ex. escapetangent eller klick på det som triggade händelsen). Kunna uppfattas (får inte försvinna för att användaren t.ex. panorerar Du dit eller tar tid kan antin på sig.)

cc-by Ervins Strauhmanis 1.4.13 Content on Hover or Focus Popups, tooltips och liknande ska kunna uppfattas och kontrolleras även av användare som t.ex. använder förstoring. Kunna stängas enkelt (med t.ex. escapetangent eller klick på det som triggade händelsen). Kunna uppfattas (får inte försvinna för att användaren t.ex. panorerar dit eller tar tid på sig.) Gynnar främst personer med nedsatt syn.

Robust WCAG 2.0 2.1 AA Möjlig att uppfatta (14st) Hanterbar (12st) +6 Begriplig (10st) (2st)

CC-BY-SA Niklas Bildhauer 2.4.11 Character key shortcuts Snabbkommandon som består av bara vanliga bokstäver måste gå att stänga av eller bytas ut. De kan annars orsaka problem för personer som använder röststyrning eller som kan råka klicka på fel tangent (t.ex. pga skakningar).

CC-BY Atlasowa @flickr 2.4.12 Label in Name Om text syns på knappar mm så ska samma text finnas maskinläsbar. Nödvändigt för att röststyrning ska fungera på dessa kontroller, och därmed för personer med nedsatt motorik. Lös med t.ex. aria-label.

CC-BY-SA Chad Person 2.5.1 Pointer gestures Komplexa gester (multi-touch på pekskärm, swipe etc) måste kunna ersättas med enklare interaktion (klick/dubbelklick/trycka länge/..) Alla har inte möjlighet att hantera flera punkter samtidigt eller kontrollera en rörelse. T.ex. på grund av motoriska begränsningar eller okunskap.

CC-BY-SA Dave Dougdale 2.5.2 Pointer Cancellation Vid klick/tryck ska antingen: Händelsen ske när knappen/trycket släpps upp Släpp (up-event) återställer det som hände vid tryck Klicket kunna avbrytas eller ångras Undantag för t.ex. pianoprogram och Counterstrike. Viktigt för personer med begränsad motorisk kontroll.

Flexzi2 Eco Clamp 2.6.1 Motion Actuation Rörelsestyrning (skaka/luta/gestikulera) kan stängas av och ha alternativ. Vissa användare monterar enheten fast i t.ex. rullstol. Andra kan inte röra sig, eller har händerna fulla. CC0 pxhere.com CC-BY Andreas Kambanis

2.6.2 Orientation Kräv inte att användaren håller enheten åt ett visst håll (liggande/stående). Viktigt för personer som monterar fast sin enhet på t.ex. rullstol. Landscape Portrait

Robust WCAG 2.0 2.1 AA Möjlig att uppfatta (14st) Hanterbar (12st) Begriplig +1 (10st) (2st)

3.2.6 Status Changes Dynamiskt förändrade status- och felmeddelanden ska kunna tillkännages utan att vara i fokus. Användare som zoomar eller använder skärmläsare riskerar annars att missa meddelandet. Använd t.ex. ARIA live regions. <div role=status aria-live=polite> Den här texten kommer att läsas upp när det passar. </div>

Undantag EN301549 WCAG 2.0 AA Undantaget innehåll Oproportionerlig börda

Undantaget innehåll 1 Dokument (pdf, office..) som publicerats före den 23 september 2018 Förinspelad tidsberoende media som offentliggjorts före 23 september 2020 Direktsänd tidsberoende media tills de är 14 dagar gamla

Undantaget innehåll 2 Tredjepartsinnehåll som ni varken finansierar, utvecklar eller kontrollerar (t.ex. användargenererat innehåll) Reproduktioner av kulturarvsföremål där det är orimligt att tillgängliggöra Innehåll på intranät och extranät som offentliggjorts före den 23 september 2019 fram till omfattande översyn.

Undantaget innehåll 3 Arkiverat innehåll som inte är nödvändigt och inte uppdateras efter 23 september 2019. Digital offentlig service i skolor och förskolor förutom nödvändiga administrativa funktioner som t.ex. ansökan om plats

Oproportionerlig börda Kräver en ordentlig bedömning Kräver information på webben om undantag och ev. alternativ Möjligt att klaga på

Kommentarsfunktion Besökare ska kunna påtala brister i tillgänglighet begära ut otillgänglig information

Tillgänglighetsutlåtande Redovisa på sajten: Icke tillgängligt innehåll, och anledning + alternativ Länk till kommentarsfunktionen Länk till uppföljningsförfarandet Kommissionen ska ta fram mall Uppdatera årligen? Vid varje förändring?

Uppföljning Tillsynsmyndighet ska bl.a. Se över myndigheters bedömning av oproportionerlig börda. Kunna utfärda förelägganden om rättelse, förenat med vite. Informera och utbilda om webbtillgänglighet.

Angränsande reglering Förordning 2001:526 FN-konvention 2008 Diskrimineringslagen 2015 LOU 2017 Lag om tillgänglighet till digital offentlig service 2018 WCAG nivå AA

Undersök nuläget Testa sajten utan mus! Testa sajten med skärmläsare! Gör systematisk granskning (manuell och automatisk!), se webbriktlinjer.se/testa

Orientera organisationen Lär känna WCAG! Se webbriktlinjer.se/wcag Läs på om webbdirektivet! Se webbriktlinjer.se/webbdirektivet Dela erfarenheter, t.ex. i Facebookgruppen Webbriktlinjer. Se webbriktlinjer.se/dela-erfarenheter

Börja idag! o De flesta åtgärderna är inte svåra, men kan kräva t.ex. o utbildning o upphandling o utveckling o Alla dessa kan ta tid

Färdiga åtgärdslappar till din projekttavla Backlog Påbörjat Klart Plocka en bunt idag, eller skriv ut från webbriktlinjer.se/lappar

MITT-nätverket Myndighetssamverkan IT-tillgänglighet. Träffas ca 5 ggr/år. Nästa träff 20/4 hos Malmö stad med tema tillgänglig video. Maila info@webbriktlinjer.se om du vill vara med.

T12T-nätverket Meetup om digital tillgänglighet. Träffas nu och då Mer information och anmälningsfunktion hittar du på t12t.se

Tack! Illustrationer: pictogram.se Hör gärna av dig med frågor och förslag! E-post: info@webbriktlinjer.se Twitter: @plannero och @kolombiken eller #webbföralla Facebookgrupp: webbriktlinjer