1 / 19

Web Content Accessibility Guidelines 2.0

Web Content Accessibility Guidelines 2.0. Helene Nørgaard Bech Sensus ApS. Retningslinjerne. WCAG 2.0: http://www.w3.org/TR/WCAG20/ Dansk: http://www.w3.org/2003/03/Translations/byTechnology?technology=WCAG20. Tekst - indholdsredigering.

neorah
Download Presentation

Web Content Accessibility Guidelines 2.0

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Web Content Accessibility Guidelines 2.0 Helene Nørgaard Bech Sensus ApS

  2. Retningslinjerne WCAG 2.0: http://www.w3.org/TR/WCAG20/ Dansk: http://www.w3.org/2003/03/Translations/byTechnology?technology=WCAG20

  3. Tekst - indholdsredigering • Overskrifter – brug Headings (H1-H6) og strukturer dem korrekt. Sørg for at overskrifter beskriver emne eller formål. http://www.dsb.dk/ http://vtu.dk/forskning/internationalt-samarbejde http://www.skat.dk/ • Brug kun fed (strong) og kursiv (em) til tekst som skal fremhæves – ikke til overskrifter • Angiv citater - <q> og <blockquote> • Angiv sidesprog og sprogskift på sider http://www.sensus.dk/vinder_eInclusion http://www.rm.dk/regional+udvikling/den+regionale+udviklingsplan/english+version/focus+for+action/nature+and+the+environment • Brug lister/punktopstilling efter standarden

  4. Links • Formål med link (i kontekst): Formålet med hvert link kan afgøres alene ud fra linkteksten • eller fra linkteksten i kombination med dens programmeringsmæssigt bestemmelige linkkontekst http://www.skat.dk/ http://www.skat.dk/SKAT.aspx?oID=166038

  5. Billeder & grafik • Ikke-tekstligt indhold: Alt ikke-tekstligt indhold, som præsenteres for brugeren, har et tekstligt alternativ, der har samme formål (er det dekoration, link eller informationsbærende?) http://www.vtu.dk/ http://www.dsb.dk/cs/Satellite?pagename=DSB/Forside http://www.skat.dk/ , http://www.skm.dk/tal_statistik/skatter_og_afgifter/510.html http://viewer.zmags.com/showmag.php?linksid=1266&a=1 Billeder af tekst: Hvis det er muligt at opnå den ønskede visuelle præsentation ved hjælp af den anvendte teknologi så anvendes tekst snarere end billeder af tekst. http://www.regionmidtjylland.dk/ http://www.skat.dk/

  6. Tabeller • Angiv tabeloverskrifter (th) og tabelbeskrivelse (caption) http://www.su.dk/SU/satserSU/videregaaende/Sider/default.aspx http://www.skm.dk/tal_statistik/skatter_og_afgifter/510.html

  7. Rammer • Der skal gives et alternativ til rammer, eksempelvis en tekst med url henvisning • Rammer skal forsynes med en titel http://www.dsb.dk/cs/Satellite?pagename=DSB/Forside

  8. Indtastningsformularer • Etiketter eller instruktioner: Der er anvendt etiketter eller instruktioner når indholdet kræver brugerinput. • Etiketter og kontroller skal knyttes sammen i koden • Etiketter: Etiketter beskriver emne eller formål. https://www.skat.dk/SKAT.aspx?oId=1552338&vId=0 • Identifikation af fejl: Hvis inputfejl bliver fundet automatisk, bliver det pågældende element identificeret og fejlen beskrives for brugeren ved hjælp af tekst. http://vtu.dk/nyheder/abonner http://www.mail-online.dk/?gclid=CP3Wi5inr5wCFUF_3godjT3BjA http://www.cphlimo.com/DK/KONTAKT • Forslag ved fejl: Hvis en fejl i input bliver fundet automatisk og der findes kendte forslag til rettelse, bliver disse forslag præsenteret for brugeren med mindre det ville virke ødelæggende for sikkerheden eller formålet med indholdet.

  9. Vej/Husnr./Etage/Dør Sammenknytning kan gøres således i html-kode: <LABEL for="firstname"> First name: <INPUT type="text" id="firstname" tabindex="1"> </LABEL>

  10. Indtastningsformularer 2 • Forebyggelse af fejl (juridisk, finansiel, data): For netstedet, som får brugeren til at indgå juridiske forpligtelser eller gennemføre finansielle transaktioner, som ændrer eller sletter brugerkontrollerede data i databaser, eller som sender brugerens testresultater, er mindst et af følgende udsagn sande: • Reversible: Indsendelsen kan fortrydes. • Kontrolleret: Brugerens data bliver kontrolleret for fejl i input og brugeren får mulighed for at rette dem. • Bekræftet: Det er muligt at gennemse, bekræfte og rette information før indsendelsen gennemføres.

  11. Video- og lydindhold • For forudindspillet indhold, som udelukkende består af lyd (audio only) og indhold, som udelukkende består af video (video only) media skal forsynes med alterntiv. • Der skal leveres et alternativ til tidsafhængige medier • Der skal leveres undertekster til alt forudindspillet lydindhold i synkroniserede medier. • Der skal leveres synstolkning af forudindspillet videoindhold i synkroniserede medier. • Der skal leveres undertekster til alt lydbaseret live-indhold i synkroniserede medier. • Såfremt der findes lydindhold på en side, som afspilles automatisk i mere end tre sekunder, findes der enten mulighed for at stoppe eller pause lyden, eller der er mulighed for at justere volumen uafhængig af den overordnede volumenkontrol på system.

  12. Rækkefølge • Meningsfuld rækkefølge: Når den rækkefølge, som indhold præsenteres i, har indflydelse på indholdets betydning, kan den korrekte læserækkefølge fastslås programmeringsmæssigt. http://www.regionmidtjylland.dk/ http://www.skat.dk/SKAT.aspx • Fokus rækkefølge: Komponenter, som kan komme fokus, kommer i fokus i en rækkefølge som bevare meningen og anvendeligheden hvis en netside kan navigeres sekventielt og navigationssekvensen har betydning for meningen eller anvendelsen.

  13. Tastaturadgang • Tastatur: Al funktionalitet i indholdet kan anvendes ved hjælp af en tastaturgrænseflade idet der ikke stilles særlige krav til tastehastigheden. http://www.skat.dk/SKAT.aspx?oId=205448&vId=0 • Ingen tastaturfælde: Hvis tastatur fokus kan flyttes til en komponent på siden ved hjælp af tastaturgrænsefladen, så kan fokus flyttes væk fra komponenten alene ved hjælp af tastaturgrænsefladen. • Fokus rækkefølge: Komponenter, som kan komme fokus, kommer i fokus i en rækkefølge som bevare meningen og anvendeligheden hvis en netside kan navigeres sekventielt og navigationssekvensen har betydning for meningen eller anvendelsen. • Fokus er synligt: Enhver grænseflade, som kan styres fra tastaturet, har en synlig indikator for tastaturfokus. http://www.skat.dk • Spring over blokke: Der findes mulighed for at springe over blokke af indhold, som gentages på en række netsider. http://vtu.dk/ministeren/taler/2009/aabning-af-forskningens-doegn-2009

  14. Farver & kontraster • Brug af farver: farver bliver ikke anvendt som den eneste visuelle metode til at videregive information, indikere en handling, anmode om et svar eller skelne et visuelt element. http://www.kk.dk/Borger/Borgerservice/Flytning.aspx • Kontrast (minimum): den visuelle præsentation af tekst og billeder af tekst har et kontrastforhold på minimum 4,5:1. Stortekst: Forstørret tekst og billeder af forstørret tekst har et kontrastforhold på minimum 3:1. (ikke logoer) http://www.skat.dk/

  15. Navigation • Konsistent navigation: Navigationsredskaber, som gentages på flere netsider på et sæt af netsider forekommer i samme relative rækkefølge hver gang de gentages, med mindre dette ændres af brugeren. • Der findes mere end en vej til at finde en netside blandt et sæt af netsider med mindre netsiden er resultatet af eller et trin i en proces. (Ex. søgefunktion, sitemap, index…). • Ved fokus: Når en komponent får fokus initierer den ikke en ændring i konteksten. https://www.borger.dk • Ved input: Ændringer i en komponent i brugergrænsefladen medfører ikke automatisk ændringer i konteksten med mindre brugeren på forhånd er blevet gjort opmærksom på dette. • Konsistent identifikation: Komponenter, som har samme funktionalitet på et sæt af netsider er identificeret konsistent.

  16. Strukturer • Sider har titler: Netsider har titler, som beskriver emne og formål. • Sansemæssige egenskaber: Instruktioner, som er medtaget af hensyn at kunne forstå og anvende indholdet er ikke udelukkende afhængig af sansemæssige egenskaber såsom form, størrelse, visuel placering, orientering eller lyd. http://www.aarhuskommune.dk/borger/bolig-og-byggeri/Boligen/Ejendomsskat/Indefrysning/Vejledning-om-laan-til-betaling-af-ejendomsskatter.aspx • Skalerbar tekst: Med undtagelse af undertekster og billeder af tekst er det muligt at skalere tekst op til 200% uden brug af kompenserende teknologi og uden at indhold eller funktionalitet går tabt. http://www.skat.dk/

  17. Strukturer 2 • Navn, rolle, værdi: For alle brugergrænsefladekomponenter (herunder men ikke begrænset til formularelementer, links og komponenter, som er skabt af scripts) kan navn og rolle bestemmes programmeringsmæssigt; tilstande, egenskaber og værdier kan sættes programmeringsmæssigt; og notifikation af ændringer i disse størrelser er tilgængelige for brugeragenter, herunder kompenserende teknologier. • Parsing: I indhold, som implementeres ved hjælp af mark-up sprog, har elementer fuldstændige start og slut tags, elementer er nestet i overensstemmelse med deres specifikationer, elementer indeholder ikke attribut-dubletter, og alle ID’er er unikke bortset fra i de situationer hvor specifikationer tillader denne praksis. http://jigsaw.w3.org/css-validator/

  18. Brugerkontrol • Tidsindstillinger er justerbare: slå fra, juster, advar og giv mulighed for forlængelse • Bevægelse, blink, bladring (scroll) & Autoopdatering : For alle bevægelser, blik og bladrende informationer som (1) starter automatisk, (2) varer mere end fem sekunder, og (3) vises samtidig med andet indhold, er det muligt for brugeren at pause, stoppe eller skjule disse • Grænseværdi på tre eller færre blink: Netsider har ikke indhold, som blinker mere end tre gange pr sekund.

  19. Spørgsmål, kommentarer ?!

More Related