Herinspectie WCAG 2 - gemeente-oldambt.nl...ze weet of de inhoud en functionaliteit van haar website...
Transcript of Herinspectie WCAG 2 - gemeente-oldambt.nl...ze weet of de inhoud en functionaliteit van haar website...
Verder met digitale toegankelijkheid
Herinspectie WCAG 2.0 Herinspectie website gemeente Oldambt
Versie 1.0
21 augustus 2018
2
Rapport: Herinspectie WCAG 2.0 gemeente Oldambt, versie 1.0
Firm Ground, 21 augustus 2018
De in dit rapport beschreven bevindingen zijn specifiek gericht op de door de opdrachtgever
geformuleerde vraagstelling. Als zodanig is de inhoud van dit rapport niet generaliseerbaar.
Dit rapport, of delen ervan, mogen niet zonder expliciete toestemming van de auteurs
gepubliceerd of gedeeld worden.
Inhoudsopgave
Samenvatting .................................................................................................................... 5
Overzicht WCAG 2.0 ................................................................................................................ 5
1 Inleiding ......................................................................................................................... 9
2. Scope en steekproef .................................................................................................... 10
2.1 Scope ............................................................................................................................... 10
2.2 Steekproef ....................................................................................................................... 11
3. Onderzoeksresultaten ................................................................................................. 14
WCAG 2.0: principes, richtlijnen en succescriteria................................................................ 14
Over de opmerkingen ....................................................................................................... 15
Principe 1 Waarneembaar .................................................................................................... 16
Richtlijn 1.1 Tekstalternatieven ........................................................................................ 16
Richtlijn 1.2 Op tijd gebaseerde media ............................................................................. 18
Richtlijn 1.3 Aanpasbaar ................................................................................................... 23
Richtlijn 1.4 Onderscheidbaar ........................................................................................... 30
Principe 2 Bedienbaar ........................................................................................................... 35
Richtlijn 2.1 Toetsenbordtoegankelijk .............................................................................. 35
Richtlijn 2.2 Genoeg tijd .................................................................................................... 36
Richtlijn 2.3 Toevallen ....................................................................................................... 37
Richtlijn 2.4 Navigeerbaar ................................................................................................. 37
Principe 3 Begrijpelijk............................................................................................................ 42
Richtlijn 3.1 Leesbaar ........................................................................................................ 43
Richtlijn 3.2 Voorspelbaar ................................................................................................. 43
Richtlijn 3.3 Assistentie bij invoer ..................................................................................... 45
Principe 4 Robuust ................................................................................................................ 47
Richtlijn 4.1 Compatibel .................................................................................................... 47
Principe Universeel................................................................................................................ 50
Afgekeurde en afgeraden eigenschappen ........................................................................ 50
UTF-8 ................................................................................................................................. 51
Gebruik ten minste open specificaties (Niveau AA) ......................................................... 51
Duidelijke URI's ................................................................................................................. 51
4. Over WCAG 2.0 ........................................................................................................... 52
5. Over Firm Ground ....................................................................................................... 52
4
5
Samenvatting
Bij de bouw en het invoeren van content op de site van de gemeente Oldambt is duidelijk
aandacht besteed aan de toegankelijkheid van de site. De gemeente wil nu graag inzicht in
de mate van conformiteit met de internationale toegankelijkheidsrichtlijnen WCAG 2.0
(niveau AA). Hierin staan eisen voor de toegankelijkheid van webcontent, zodat content ook
goed toegankelijk is voor mensen met een functiebeperking.
Er zijn op de site van de gemeente Oldambt nog wel toegankelijkheidsproblemen
aangetroffen. Op dit moment voldoet de site nog niet volledig aan de
toegankelijkheidsrichtlijnen.
De aangetroffen toegankelijkheidsissues hebben impact op de bruikbaarheid van de site
door mensen en zoekmachines. Denk bijvoorbeeld aan mensen die dyslectisch zijn, mensen
die geen of niet goed kleur kunnen waarnemen, mensen met een motorische, visuele of
auditieve beperking en mensen met verschillende apparaten.
De issues die zijn aangetroffen, hebben betrekking op wijze waarop code is opgemaakt en de
content die is ingevoerd. Veel issues komen op meerdere pagina’s voor. Soms betekent dat
een eenmalige aanpassing in de code, in andere gevallen zal de code van of content op
meerdere pagina’s verbeterd moeten worden. De aangetroffen problemen zijn goed op te
lossen.
In het volgende hoofdstuk worden de verbeterpunten besproken en toegelicht. Samengevat
wordt aan 19 succescriteria nog niet volledig voldaan. Een overzicht staat in de tabel op de
volgende pagina. Na de tabel volgt een samenvatting van de bevindingen.
Overzicht WCAG 2.0
Aan 29 van de 38 succescriteria van de verplichte standaard WCAG 2.0 niveau AA wordt nog niet
voldaan. Deze punten worden in het volgende hoofdstuk besproken.
6
Principes Aantal succescriteria
waaraan nog niet wordt voldaan
Verbeterpunten
(succescriteria)
Principe Waarneembaar
9 van 14
1. 1.1.1 Niet-tekstuele content
2. 1.2.2 Ondertiteling voor doven en slechthorenden
3. 1.2.3 Audiodescriptie of media alternatief (vooraf opgenomen)
4. 1.2.5 Audiodescriptie (vooraf opgenomen)
5. 1.3.1 Info en relaties
6. 1.3.2 Betekenisvolle volgorde
7. 1.4.3 Contrast (minimum)
8. 1.4.4 Herschalen van tekst
9. 1.4.5 Afbeeldingen van tekst
Principe Bedienbaar
6 van 12
1. 2.1.1 Toetsenbord
2. 2.4.1 Blokken omzeilen
3. 2.4.2 Paginatitel
4. 2.4.4 Linkdoel
5. 2.4.6 Koppen en labels
6. 2.4.7 Focus zichtbaar
Principe Begrijpelijk
2 van 10
1. 3.1.1 Taal van de pagina 2. 3.2.2 Bij input
Principe Robuust
2 van 2
1. 4.1.2 Parsen 2. 4.1.2 Naam, rol, waarde
Totaal 19 van 38
7
Samenvatting | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Het volledige overzicht met succescriteria van WCAG 2.0 is te vinden op
http://iacobien.nl/richtlijnen/wcag-2-0. Hierbij kan doorgeklikt worden naar technieken en
achtergrondinformatie.
De issues die zijn aangetroffen, hebben betrekking op wijze waarop code is opgemaakt en
content is ingevoerd. We bespreken in deze samenvatting kort, maar niet uitputtend, een
aantal belangrijke punten per principe van de richtlijnen:
Bij het onderzoeken van de succescriteria van Principe Waarneembaar troffen we nog
afbeeldingen aan zonder alt-attribuut (voor een alternatieve tekst) en afbeeldingen waarbij
het tekstueel alternatief niet of onvoldoende informatie gaf. Ook zagen we afbeeldingen
waarbij het tekstueel alternatief niet alleen visueel verborgen werd maar ook voor
screenreaders. Video’s hadden nog geen ondertiteling of audiodescriptie waarmee
informatie ook begrijpelijk is voor doven, slechthorenden, blinden en slechtzienden.
Informatie is nog niet altijd met de juiste code opgemaakt. Het gebruik van de juiste code is
belangrijk voor begrijpelijkheid en toegankelijkheid voor verschillende mensen met en
zonder hulpapparatuur en voor zoekmachines. De html-formulieren waren nog niet goed
toegankelijk, maar hiervoor wordt inmiddels een nieuwe module gebruikt. Deze nieuwe
module is nog niet getest. Pdf’s zijn nog niet toegankelijk gemaakt. Er zijn nog diverse
toegankelijkheidsproblemen vanwege te laag contrast. Daarnaast zijn er nog
toegankelijkheidsproblemen doordat pagina’s niet overal goed te schalen zijn (de
mogelijkheid tot inzoomen) en er nog afbeeldingen van tekst zijn waardoor die informatie
niet goed bruikbaars voor slechtzienden.
Bij Principe Bedienbaar vonden we nog een klein aantal problemen met
toetsenbordtoegankelijkheid. Niet alle informatie is al goed bruikbaar wanneer geen muis of
touchscreen gebruikt kan worden. Ook is de focusvolgorde nog niet altijd logisch. De pdf’s
zijn nog niet goed te gebruiken doordat koppen en of bladwijzers ontbreken. Nog niet alle
pagina’s in de steekproef hadden een goede paginatitel. Dat gold bijvoorbeeld voor de
zoekresultatenpagina en de pdf’s. Linkteksten zijn niet optimaal bruikbaar voor bezoekers
8
Samenvatting | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
die bijvoorbeeld een linklijst gebruiken, pagina’s scannen of vergrotingssoftware gebruiken.
Dat geldt ook voor koppen en labels.
Bij Principe Begrijpelijk vonden we voornamelijk problemen bij het aangeven van taal bij de
pdf’s.
Tenslotte Principe Robuust. Hier vinden we een enkele parsefout waardoor niet
gegarandeerd kan worden dat pagina’s op een betrouwbare wijze worden weergegeven in
browsers en met hulpapparatuur. Ook vinden we nog verbeterpunten voor de code. Na het
doorvoeren van deze verbeteringen is de site beter toegankelijk voor mensen met
hulpapparatuur.
Bij dit onderzoek is gebruik gemaakt van een steekproef. Voorbeelden van
toegankelijkheidsproblemen worden in dit rapport genoemd en zijn in een gesprek
gezamenlijk besproken op maandag 10 juli 2017. Ook werden oplossingen besproken. In juli
2018 heeft de herinspectie plaatsgevonden.
Een deel van de verbeterpunten zijn op te lossen door de developers. Een aantal andere
aandachtspunten vragen veranderingen of verbeteringen bij invoer van content. We lichten
deze punten en oplossingen graag mondeling toe.
9
Inleiding | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
1 Inleiding
De gemeente Oldambt wil graag inzicht in de toegankelijkheid van de nieuwe website zodat
ze weet of de inhoud en functionaliteit van haar website voor iedereen beschikbaar is. De
site zou voldoen aan Webrichtlijnen versie 2, niveau AA. Of de nieuwe site en de content
voldoende toegankelijk zijn voor iedere bezoeker en of deze voldoen aan de Webrichtlijnen
is nu nog niet onafhankelijk vastgesteld.
Deze rapportage is het verslag van een nulmeting op basis van de internationale
toegankelijkheidsrichtlijnen WCAG 2.0, niveau AA. In dit onderzoek is gekeken naar mogelijke
toegankelijkheidsproblemen en punten die nog niet optimaal zijn. De pagina’s zijn getest in
de periode 5 tot 30 juni 2017.
De resultaten van dit onderzoek zijn verwerkt in deze rapportage met verbeterpunten om
verder te werken aan content die toegankelijk is voor iedereen en goed bruikbaar,
uitwisselbaar en duurzaam is. Daarnaast helpt dit rapport bij het opbouwen van kennis
binnen de organisatie en geeft deze rapportage informatie die verwerkt kan worden in de
toegankelijkheidsverklaring.
We hopen van harte dat dit onderzoek de gemeente Oldambt helpt met het verder
toegankelijk maken van haar website en het verder verbeteren van de bouwkwaliteit.
Deze rapportage is als volgt opgebouwd:
• In hoofdstuk 2 staan de scope en de getoetste pagina’s;
• In hoofdstuk 3 zijn de bevindingen van het onderzoek beschreven, waar mogelijk met
oplossingen;
• In hoofdstuk 4 staat meer informatie over WCAG 2.0;
• In hoofdstuk 5 een kleine toelichting op Firm Ground.
10
2. Scope en steekproef | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
2. Scope en steekproef
2.1 Scope
Naam website www.gemeente-oldambt.nl.
Scope van de website De scope van het onderzoek bestaat uit alle pagina's op
www.gemeente-oldambt.nl.
Buiten de scope van het onderzoek vallen pagina's of content
die gepubliceerd worden buiten het CMS (Drupal) van de
gemeente Oldambt.
Het proces om een afspraak te maken (formulier buiten
www.gemeente-oldambt.nl) is in het onderzoek
meegenomen.
Er is geen testomgeving en testaccount voor het testen van
formulieren met DigiD. Deze formulieren zijn dus niet getest.
Sinds het eerste onderzoek wordt er een nieuwe module
gebruikt voor html-formulieren.
Conformiteitsdoel WCAG 2.0 niveau AA
Basisniveau van
toegankelijkheid
ondersteund
Er is geen te ondersteunen hulptechnologie vastgesteld.
Getest met Firefox 53.0.3 op Windows 10 met NVDA 2017.1
Getest met Firefox 53.0.3 op MacOS Sierra versie 10.12.4
Getest met Safari 10.1 op MacOS Sierra versie 10.12.4
Technologieën waarop
gesteund wordt
HTML5
CSS
ECMAScript 5
DOM
WAI-ARA
11
2. Scope en steekproef | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
2.2 Steekproef
Het onderzoek naar conformiteit met WCAG 2.0 is uitgevoerd met de methode van het W3C,
de 'Website Accessibility Conformance Evaluation Methodology’ (WCAG-EM).
1. Homepage
https://www.gemeente-oldambt.nl/
2. Openingstijden
https://www.gemeente-oldambt.nl/openingstijden
3. Contactformulier
https://www.gemeente-oldambt.nl/gemeentehuis (404-foutmelding, pagina bestaat
niet meer)
4. 404-pagina
https://www.gemeente-oldambt.nl/gemeentehis
5. Pagina met een evenement: Adrillen
https://www.gemeente-oldambt.nl/in-oldambt/recre-ren-en-evenementen/adrillen
6. Inschrijfformulier (pdf)
https://www.gemeente-
oldambt.nl/sites/default/files/legacy/inschrijfformulier_allerheiligenmarkt_2017.pdf
7. Paspoort
https://www.gemeente-oldambt.nl/wonen-en-leven/leven-reizen-en-
papieren/reispapieren/paspoort
8. Afspraak maken paspoort (zonder DigiD)
https://dloket.gemeente-oldambt.nl/oldambt_transacties/formulier/nl-
NL/evDimpact/Sc075_AfspraakMakenAlgemeen.aspx/fOnderwerp075 (503-
foutmelding, pagina bestaat niet meer)
9. Richtlijnen pasfoto (ondersteunende informatie)
https://www.gemeente-oldambt.nl/wonen-en-leven/leven-reizen-en-
papieren/reispapieren/pasfoto-richtlijnen
10. Pagina over afval
https://www.gemeente-oldambt.nl/www.gemeente-oldambt.nl/afval
12
2. Scope en steekproef | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
11. Samenstelling B&W
https://www.gemeente-oldambt.nl/samenstelling (404-foutmelding, pagina bestaat
niet meer)
12. Pagina met video
https://www.gemeente-oldambt.nl/filmpjes-zwemlessen
13. Zoekresultaten
https://www.gemeente-oldambt.nl/search/site/contact
14. Filter zoekresultaten
https://www.gemeente-
oldambt.nl/search/site/contact?f%5B0%5D=bundle%3Asubject_page
15. Ondernemersloket (Carrousel)
https://www.gemeente-oldambt.nl/ondernemersloket
16. Bekendmakingen
https://www.gemeente-oldambt.nl/elektronisch-gemeenteblad
17. Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
https://www.gemeente-
oldambt.nl/sites/default/files/Elektronisch%20gemeenteblad%20gemeente%20Olda
mbt%202017%2C%20week%2025%20nr.%2025.pdf
18. Dorpen en wijken
https://www.gemeente-oldambt.nl/dorpen-en-wijken
19. Vacatures (Meertalige pagina)
https://www.gemeente-oldambt.nl/vacatures-1 (inmiddels niet meertalig meer)
20. Organogram
https://www.gemeente-oldambt.nl/organogram
21. Nevenfuncties (geneste lijst)
https://www.gemeente-oldambt.nl/bestuur-en-organisatie/college-van-
bw/nevenfuncties
22. Besluitenlijst college
https://www.gemeente-oldambt.nl/bestuur-en-organisatie/college-van-
bw/besluitenlijsten-college
13
2. Scope en steekproef | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
23. Besluitenlijst van 14 juni 2017.pdf
https://www.gemeente-
oldambt.nl/sites/default/files/besluitenlijst%20van%2020%20juni%202017.pdf
24. Begroting in beeld (iframes)
https://www.gemeente-oldambt.nl/bestuur-en-organisatie/financi-n/begroting-in-
beeld
25. Verkiezingsuitslagen (tabel)
https://www.gemeente-oldambt.nl/node/1305
26. Hulp in uw omgeving
https://www.gemeente-oldambt.nl/hulp-in-uw-omgeving
27. Vervolgstappen afspraak paspoort
https://dloket.gemeente-oldambt.nl/oldambt_transacties/formulier/nl-
NL/evDimpact/Sc075_AfspraakMakenAlgemeen.aspx/fLocatie075 (503-foutmelding,
pagina bestaat niet meer)
28. Vervolgstap mijn gegevens paspoort
https://dloket.gemeente-oldambt.nl/oldambt_transacties/formulier/nl-
NL/evDimpact/Sc075_AfspraakMakenAlgemeen.aspx/MijnGegevens_DigiD_vooringe
vuld_075 (503-foutmelding, pagina bestaat niet meer)
29. Controleren gegevens paspoort
https://dloket.gemeente-oldambt.nl/oldambt_transacties/formulier/nl-
NL/evDimpact/Sc075_AfspraakMakenAlgemeen.aspx/fControlerenGegevens (503-
foutmelding, pagina bestaat niet meer)
30. Afrondscherm aanvragen paspoort
https://dloket.gemeente-oldambt.nl/oldambt_transacties/formulier/nl-
NL/evDimpact/Sc075_AfspraakMakenAlgemeen.aspx/fAfrondScherm075 (503-
foutmelding, pagina bestaat niet meer)
31. Nieuwspagina
https://www.gemeente-oldambt.nl/in-oldambt/nieuws/actieprogramma-
versterking-binnenstad-winschoten-afgerond
32. Na de begravenis
https://www.gemeente-oldambt.nl/wonen-en-leven/begraafplaatsen/crematie
14
2. Scope en steekproef | Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
33. Ambtelijke organisatie https://www.gemeente-oldambt.nl/bestuur-en-
organisatie/hoe-werkt-de-gemeente/ambtelijke-organisatie
34. Voorkomen van problemen
https://www.gemeente-oldambt.nl/voorkomen-van-problemen
3. Onderzoeksresultaten
De website van de gemeente Oldambt voldoet nog niet volledig aan de internationale
toegankelijkheidsrichtlijnen WCAG 2.0 niveau AA. Pagina’s en processen zijn nog niet goed
toegankelijk voor verschillende bezoekers. Dit rapport geeft inzicht in welke
toegankelijkheidspunten opgepakt moeten worden om de toegankelijkheid van de website te
verbeteren.
WCAG 2.0: principes, richtlijnen en succescriteria
De resultaten worden per principe van WCAG 2.0 besproken. WCAG 2.0 is namelijk
opgedeeld in vier principes waarmee online informatie en diensten toegankelijk gemaakt
kunnen worden, ook voor mensen met een functiebeperking:
1. Waarneembaar
2. Bedienbaar
3. Begrijpelijk
4. Robuust
Onder elk principe vallen richtlijnen en daaronder vallen succescriteria waaraan de content
moet voldoen om goed toegankelijk te zijn. In dit onderzoek is getest op de 38 succescriteria
van WCAG 2.0. De resultaten worden niet uitputtend beschreven: als een
toegankelijkheidsprobleem zich op meerdere pagina’s voordoet, dan wordt niet het issue op
elke afzonderlijke pagina beschreven.
15
3. Onderzoeksresultaten
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
We beschrijven in dit rapport algemene bevindingen en lichten per issue een aantal pagina’s
uit.
Over de opmerkingen
Bij een aantal succescriteria zijn opmerkingen toegevoegd. Opmerkingen zijn issues die niet
fout zijn volgens een succescriterium, maar waarvan we adviseren ze wel op te pakken
vanwege gebruiksvriendelijkheid voor gebruikers of het makkelijker kunnen borgen van
bouwkwaliteit in het proces.
16
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Principe 1 Waarneembaar
Richtlijn 1.1 Tekstalternatieven
Succescriterium 1.1.1 Niet-tekstuele content: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.1.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Met 'niet-tekstuele content' wordt gedoeld op informatie of functionaliteit die niet in tekst
wordt aangeboden. Denk bijvoorbeeld aan afbeeldingen die informatie geven.
Alle niet-tekstuele content moet ook beschikbaar zijn als tekst. Dat hoeft niet altijd tekst in
beeld te zijn, het kan bijvoorbeeld ook een alternatieve tekst zijn bij een afbeelding die je
alleen ziet als je de afbeelding niet kan zien of als de afbeelding niet wordt weergegeven.
Met het voldoen aan dit succescriterium is informatie voor iedereen beschikbaar omdat ze
visueel, auditief of tastbaar kan worden weergeven, of in een combinatie daarvan.
Uitgelichte pagina’s
Homepage
• De vier foto’s op de pagina hebben in de code geen alt-attribuut. Zorg hier voor een
alt-attribuut. De afbeeldingen kunnen gezien worden als decoratief. Laat de inhoud
leeg, dan kunnen ze genegeerd worden door hulpapparatuur.
• Het tekstueel alternatief voor de sociaal media-iconen is verborgen voor
screenreaders.
Inschrijfformulier (pdf)
• Er is geen tekstueel alternatief voor het logo van de gemeente.
17
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Afspraak maken paspoort (zonder DigiD)
• In het formulier staat met een statusbar en een percentage hoe ver je bent met het
invullen van het formulier. Geef ook tekstueel aan dat het hier om voortgang. Anders
is er enkel losse tekst met een percentage.
Ondernemersloket
• De afbeeldingen in de carrousel hebben geen alt-attribuut.
• Laat de alt-attributen bij decoratieve afbeeldingen leeg zodat ze met hulpapparatuur
overgeslagen kunnen worden. Ze geven immers geen informatie. Een afbeelding
heeft nu bijvoorbeeld als alternatieve tekst "Overig ondernemen banner".
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• Voor afbeeldingen in de pdf is geen tekstueel alternatief.
Dorpen en wijken
• Op de pagina staan diverse afbeeldingen zonder alt-attribuut. Een afbeelding moet
een alt-attribuut hebben.
o Bij een decoratieve afbeelding laat je de inhoud leeg. Gewenst gevolg is dat de
afbeelding door hulpapparatuur genegeerd wordt.
o Bij een afbeelding die informatie overbrengt schrijf je in het alt-attribuut kort
de inhoud of het doel van de afbeelding.
• Bij een aantal afbeeldingen staat eronder een korte tekst, maar doordat er geen alt-
attribuut is, leidt dit toch tot toegankelijkheidsproblemen.
Organogram
• Er is geen tekstueel alternatief voor de informatie in het organogram. De afbeelding
heeft wel een alt-attribuut met 'organogram'. Dit geeft echter geen informatie over
de inhoud van het organogram en de verschillende organen in de organisatie.
Besluitenlijst van 14 juni 2017 (pdf)
• Er is geen tekstueel alternatief voor het logo van de gemeente.
18
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Hulp in uw omgeving
• Geef decoratieve afbeeldingen een leeg alt-attribuut. De afbeelding kan dan
genegeerd worden. Een aantal decoratieve afbeeldingen heeft nu een beschrijving
die niet behulpzaam is voor de gebruiker, zoals "plaatje bij rondkomen", "foto's
jeugd", "senioren", "plaatje bij gezondheid" en "foto wonen". Als een afbeelding geen
informatie geeft, zorg dan voor een leeg alt-attribuut.
• Een afbeelding heeft het adres van de afbeelding als alternatieve tekst
(foto_taal_en_educatie.jpg). Dit is een decoratieve afbeelding. Laat het alt-attribuut
leeg.
• Afbeeldingen hebben daarnaast een title-attribuut dat het alt-attribuut dubbelt. Dit is
niet het doel van title-attribuut. Als het title-attribuut wordt ondersteund krijgen
mensen informatie dubbel aangeboden. Gebruik geen title-attribuut bij deze
afbeeldingen.
Richtlijn 1.2 Op tijd gebaseerde media
Succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf
opgenomen): (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.2.1
Uitkomst: Niet van toepassing
Succescriterium 1.2.2 Ondertiteling voor doven en slechthorenden
(vooraf opgenomen): (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.2.2
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
19
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Korte uitleg succescriterium
Ook mensen die doof of slechthorend zijn moeten informatie die wordt gegeven in spraak of
met geluiden in een video kunnen waarnemen. Daarvoor is ondertiteling voor doven en
slechthorenden nodig. Dit heeft als extra voordeel dat video’s ook goed bruikbaar zijn voor
mensen die tijdelijk geen geluid kunnen afspelen.
Uitgelichte pagina’s
Nieuwspagina
• Er is geen goede ondertiteling voor de video. Er is wel automatisch gegeneerde video,
maar deze is niet begrijpelijk.
Om een indruk te geven van wat je opvangt van de gesproken tekst als je niet of niet
goed kan horen geven we hierbij het eerste deel van de huidige (automatisch
gegenereerde) ondertiteling:
"je hij gaat pakken het blijven quote de pakketten u kunt hier ik zie ook de open en
constructieve het luchthavengebied hulpgoederen had gebracht in de categorie
quicktime toont de regionale karakter uit de regio trekken mensen na de introductie
van het afvlakken koken en de uitwerking van de thema's helmi huijbregts ik heb in
2009 en inhoud en 10 kilometer negen op de tien paarden die een grote rol in
hebben gemaakt in totaal kwamen niet tot scoren het gedachtegoed 910 ik kan ik kan
niet wachten het is de tweede categorie moeten niet vergeten dat banken door een
blaastest af eigentijds dichtbij de betrokken partijen het brabants dagblad bezoekers
van de ecoducten martin del potro kwam gesink dit alles wordt hier hoeksche waard
oudenbosch een betalingsregeling het debat ruim dertig jaar op rij met een
knieblessure winkelpanden worden omgebouwd naar woningen het aandeel wordt
opgenomen een benzinepomp het plan komt om de wijk gebouwd oude lts kort door
de bocht op de markt brengt ik besef dat het tempo van contador het product moet
je oefenen de kracht huisartsen 10 de club uit berlijn andere zorgaanbieders de
onderdak te vinden".
20
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Dit is natuurlijk geen goede weergave van de informatie die de video biedt. De
informatie in de video - over het actieprogramma versterking binnenstad Winschoten
- wordt niet toegankelijk aangeboden.
Succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf
opgenomen): (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.2.3
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Als je blind of slechtziend bent, dan moet je ook alle relevante informatie die in beeld
gebracht wordt kunnen waarnemen. Denk bijvoorbeeld aan teksten die in beeld gebracht
worden. Zorg dat deze informatie standaard uitgesproken wordt of bied een extra
geluidsspoor aan met audiodescriptie.
Audiodescriptie is een gesproken alternatief voor zichtbare informatie. Als een site minimaal
toegankelijk is (conformiteit met niveau A), dan wordt gekeken of de video een alternatief is
voor aangeboden tekst.
Voor deze site is echter conformiteit met niveau AA vereist. Daar is de eis dat er altijd een
audiodescriptie moet worden aangeboden.
Bevindingen
Bij video’s is geen audiodescriptie aanwezig. Ook is de video geen alternatief voor informatie
die tekstueel wordt aangeboden. De site moet echter voldoen aan niveau AA, dan is conform
succescriterium 1.2.5 een audiodescriptie vereist. Zie voor de bevindingen daarom
succescriterium 1.2.5.
21
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 1.2.4 Ondertitels voor doven en slechthorenden
(live): (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 1.2.4
Uitkomst: Niet van toepassing
Succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen): (Niveau
AA)
Resultaat van de hele steekproef voor succescriterium 1.2.5
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Als je blind of slechtziend bent, dan moet je ook alle relevante informatie die in beeld
gebracht wordt kunnen waarnemen. Denk bijvoorbeeld aan teksten die in beeld gebracht
worden. Zorg dat deze informatie standaard uitgesproken wordt of bied een extra
geluidsspoor aan met audiodescriptie. Audiodescriptie is een gesproken alternatief voor
zichtbare informatie.
Uitgelichte pagina’s
Pagina met video
• Er is alleen informatie in beeld en ondertiteling. Als je niet kan zien, dan is er geen
informatie. Met audiodescriptie kan deze informatie toegankelijk gemaakt worden.
Nieuwspagina
• Niet alle informatie is beschikbaar als je niet kan zien. Zo is de informatie over wie de
opdrachtgever van deze film is niet beschikbaar.
22
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
23
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Richtlijn 1.3 Aanpasbaar
Succescriterium 1.3.1 Info en relaties: Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.3.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Informatie over en relaties tussen delen content moeten niet alleen visueel duidelijk zijn.
Hulptechnologieën zoals schermlezers, maar bijvoorbeeld ook zoekmachines, moeten ook
toegang hebben tot informatie en moeten relaties tussen contentonderdelen kunnen
begrijpen.
Uitgelichte pagina’s
Homepage
• De informatie in de footer heeft geen (verborgen) kop en valt daardoor onder de
laatste kop die erboven staat. Het gaat om de contactinformatie en de
adresinformatie. Plaats hier een kop boven die beschrijft wat eronder valt. Dit kan
een verborgen kop zijn, maar we adviseren een zichtbare kop zodat er ook makkelijk
op de pagina naar contactinformatie gezocht kan worden.
• Opmerking1: gebruik kopjes om de informatie in de footer te structureren (de
verschillende gemeentehuizen, postadres).
• De zoekknop staat twee keer in de code. Een keer is visueel verborgen door het veld,
maar niet voor bijvoorbeeld screenreaders.
1 Opmerkingen zijn issues die niet fout zijn volgens een succescriterium, maar waarvan we adviseren ze wel op te pakken vanwege gebruiksvriendelijkheid voor gebruikers, toegankelijkheid of het makkelijker kunnen borgen van bouwkwaliteit in het proces.
24
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Openingstijden
• Het em-element wordt gebruikt om nadruk aan te geven. Gebruik het strong-
element voor het markeren van delen tekst die nadruk behoeven.
Inschrijfformulier (pdf)
• De pdf is niet gecodeerd. Dit betekent dat de informatie en het formulier in de tabel
niet toegankelijk zijn.
• Opmerking: het formulier is niet geschikt voor mensen die niet kunnen printen en
mensen die bijvoorbeeld vanwege een motorische of visuele beperking het formulier
niet zelf kunnen invullen of ondertekenen.
25
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Paspoort
• 'Meer informatie' en 'Delen' zijn niet als kop opgemaakt. Gebruik hier kopopmaak.
• Houd koppen kort en beschrijvend zodat ze ook goed bruikbaar zijn in een
koppenlijst. De volgende kop voldoet hier niet aan: 'Wilt u een nieuw reisdocument
aanvragen naar aanleiding van identiteitsfraude?'.
• Kosten: maak de informatie op met kopjes en lijsten.
• Het kopje 'Toeslag bij spoedaanvraag' is opgemaakt met het strong-element. Gebruik
hier kopinformatie.
• Het is niet duidelijk op welke informatie de tekst 'U betaalt dit bij uw aanvraag.'
betrekking heeft.
• Gebruik lijstopmaak voor de links onder 'Meer informatie’.
Richtlijnen pasfoto (ondersteunende informatie)
• De kopjes 'Meer informatie' en 'Delen' zijn in de code niet opgemaakt als koppen.
Samenstelling B&W
• Het element strong voor nadruk is gebruikt voor de opmaak van informatie. Gebruik
hier elementen om deze informatie aan elkaar te koppelen, zoals een description list
of een datatabel. Het gaat om informatie als 'Functie', 'Telefoonnummer', 'E-
mailadres'.
• Het title-attribuut wordt gebruikt om informatie uit de alternatieve tekst te
dubbelen. Dit is niet het doel van dit attribuut. Voor mensen die het title-attribuut
26
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
kunnen gebruiken, wordt informatie nu drie keer achter elkaar aangeboden: h2 Laura
Broekhuizen-Smit alt="laura broekhuizen" title="laura broekhuizen"
Ondernemersloket
• Opmerking: De lijsten met links zijn niet opgemaakt als lijsten, maar als paragrafen
met links en een pipeline ertussen. Maak deze informatie in de code op als lijsten.
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• Het document is weliswaar gecodeerd, maar de header en de footer (informatie over
de editie en afzender) staan niet in de codelaag.
• Niet alle onderdelen zijn goed opgemaakt. Zo staat er een lege kop (h1) in de code en
wordt een koppen op niveau h1 gebruikt voor content zonder onderliggende
content. Niet alle koppen zijn als kop opgemaakt.
• Gebruik voor lijsten liever lijstopmaak of andere betekenisvolle opmaak.
Besluitenlijst college
• Links staan dubbel in de code. Een ervan is telkens verborgen met een class element-
invisible. Visueel zijn ze maar een keer aanwezig, voor hulpapparatuur zijn ze echter
dubbel aanwezig. Bijvoorbeeld: 'parafenbesluit van 20 juni 2017.pdf' gevolgd door
'parafenbesluitenlijst van 20 juni 2017.pdf'. In de code:
<h2 class="element-invisible"><a href="/file/2498">parafenbesluitenlijst van
20 juni 2017.pdf</a></h2>
<div class="content">
<span class="file"><img class="file-icon" alt="PDF"
src="/modules/file/icons/application-pdf.png" /><a
href="https://www.gemeente-
oldambt.nl/sites/default/files/parafenbesluitenlijst%20van%2020%20juni%202017
.pdf" type="application/pdf; length=39743">parafenbesluitenlijst van 20 juni
2017.pdf</a></span>
• De koppen zijn visueel verborgen (class=”element-invisible”) en daarom alleen voor
mensen met hulpapparatuur beschikbaar.
• De kop 'Delen' is niet met de juiste code als kop opgemaakt.
27
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Besluitenlijst van 14 juni 2017 (pdf)
• Het document is niet gecodeerd. Dat betekent dat de informatie niet toegankelijk is
gemaakt en dat er voor sommige gebruikers zelfs helemaal geen informatie is.
Begroting in beeld (iframes)
• De onderdelen in de iframes werden niet weergegeven. Na melding is deze
informatie tijdelijk uit de lucht en kan hier niet verder op onderzocht worden:
"Tijdelijk uit de lucht Wegens technische problemen is dit onderdeel van de website
tijdelijk niet te bekijken. Komt u op een later moment nog eens terug?"
Verkiezingsuitslagen (tabel)
• De tabel is niet toegankelijk opgemaakt. Koppen zijn niet als koppen gemarkeerd.
Daarnaast staan er feiten onder in de tabel die geen onderdeel van deze tabel meer
zijn en niet onder de koppen 'Lijstnr., Partij, Stemmen, Percentage' vallen. Haal deze
informatie uit deze tabel en maak deze apart op.
• Opmerking: de tekst boven de tabel is niet gestructureerd met kopjes. Hiermee kan
de tekst leesbaarder en beter scanbaar worden.
Hulp in uw omgeving
• Opmerking: maak lijsten met links liever op als lijsten. Ook als je niet kan zien weet je
hoeveel links per lijst worden aangeboden en kun je makkelijker navigeren.
Nieuwspagina
• Het iframe-element met de YouTube video is niet voorzien van een title-attribuut
waarin de inhoud van het iframe beschreven wordt.
Ambtelijke organisatie
• Links, zoals 'Bezwaar en beroep' worden gebruikt als kopjes boven informatie. Ze
gaan vooraf aan meer informatie over de onderwerpen. Maak ze ook op als kopjes. In
dit geval op h2-niveau. Het kunnen nog steeds links blijven.
28
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Voorkomen van problemen (link)
• Opmerking: Gebruik kopjes om informatie te structureren. Hiermee wordt informatie
beter leesbaar en scanbaar voor verschillende bezoekers.
Filter zoekresultaten
• De filters om zoekresultaten te filteren worden dubbel aangeboden. Eerst met een
checkbox en een label, vervolgens door een link die niet in de focusvolgorde staat,
maar welk zichtbaar is voor gebruikers van hulpapparatuur. Op het eerste oog zijn er
twee mogelijke oplossingen:
1. Verwijder de checkboxen en plaats de links in de focusvolgorde (verwijder
tabindex=-1.)
2. Verwijder de links en gebruik de checkboxen. Handel dit af met AJAX en
voorkom een page reload. Dat is namelijk ook een fout bij succescriterium
3.2.2 Bij input (Niveau A)
• Opmerking: Visueel gaat het nu ook niet goed met de filters:
o Er staat een checkbox gevolgd door een vakje.
o Als je een keuze maakt zie je een checkbox maar niet meer wat aangevinkt is.
Die tekst ontbreekt dan.
Zie screenshot :
29
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 1.3.2 Betekenisvolle volgorde: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.3.2
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Dit succescriterium gaat over de volgorde van content. Als je content in een andere weergave
gebruikt, bijvoorbeeld doordat je de pagina laat voorlezen of een eigen style sheet gebruikt,
dan moet de content nog steeds begrijpelijk zijn. In pdf’s gebruik je hier een aparte laag van
het document voor, de laag met de leesvolgorde.
Uitgelichte pagina’s
Inschrijfformulier (pdf)
• De volgorde van elementen in het formulier is niet logisch. Zo krijg je eerst de
verschillende labels (teksten over wat je moet invullen) en dan de velden.
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• De 'header' en de 'footer' staan niet in de leesvolgorde. Daarom ontbreekt voor een
groep gebruikers informatie over welke document het betreft, het weeknummer en
editie en de gegevens over de afzender en contactinformatie.
Besluitenlijst van 14 juni 2017 (pdf)
• Er is geen goede laag voor de leesvolgorde. Dat betekent dat de inhoud van het
document niet goed bruikbaar is voor slechtzienden die de weergave van het
document willen aanpassen om het document goed te kunnen gebruiken.
Succescriterium 1.3.3 Zintuiglijke eigenschappen: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.3.3
Uitkomst: Geen problemen aangetroffen
30
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Richtlijn 1.4 Onderscheidbaar
Succescriterium 1.4.1 Gebruik van kleur: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.4.1
Uitkomst: Geen problemen aangetroffen
Succescriterium 1.4.2 Geluidsbediening: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 1.4.2
Uitkomst: Niet van toepassing
Succescriterium 1.4.3 Contrast (minimum): (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 1.4.3
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
In dit succescriterium worden eisen gesteld aan het contrast van tekst met de
achtergrondkleur. De mate van contrast wordt in cijfers uitgedrukt met de
'contrastverhouding'. Goed contrast begint bij een contrastverhouding van 3:1 voor grote of
vette letters en 4,5:1 voor gewone tekst. Als deze contrastverhouding wordt aangehouden is
tekst ook beter leesbaar voor mensen met verminderd zicht en mensen met een afwijking in
het waarnemen van kleuren. Maar ook voor gebruikers zonder beperkingen leest tekst
prettiger als het contrast goed is. Zie ook http://iacobien.nl/artikelen/contrast-van-tekst-met-
achtergrondkleur-op-een-toegankelijke-site/
31
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Bevindingen
Op diverse plekken is het contrast van tekst in verhouding tot de achtergrondkleur te laag.
We adviseren het contrast te vergroten.
Om te voldoen aan de richtlijnen mag ook een hoog contrast-versie worden aangeboden. De
gebruiker moet dan op een hoog contrast-knop klikken. Dit leidt echter tot meer kosten,
extra beheer en verminderde gebruiksvriendelijkheid.
De standaardversie is dan namelijk niet toegankelijk en er wordt een extra drempel
opgeworpen om een toegankelijk versie te gebruiken (Kunnen bijvoorbeeld je schoonmoeder
of achterbuurman deze knop, vaak in een hoekje in beeld, makkelijk vinden en gebruiken om
de toegankelijke versie te veranderen in een beter bruikbare versie? Of de bezoeker die met
een mobieltje op straat loopt en onder andere door het daglicht teksten in te laag contrast
niet kan zien?). Ons advies is om standaard voor voldoende contrast te zorgen.
Uitgelichte pagina’s
Homepage
• Niet alle tekst heeft voldoende contrast:
o de knop met zoeken heeft een contrastverhouding van 3.04:1. De
contrastverhouding zou hier minimaal 4,5:1 moeten zijn. (details: foreground
color: #ffffff, background color: #009de0, font size: 10.5pt, font weight:
normal).
o de items in het menu hebben te laag contrast. De contrastverhouding is
3,04:1. De contrastverhouding zou hier minimaal 4,5:1 moeten zijn. Dit geldt
ook voor de witte tekst op lichtblauw in het linkermenu (details: foreground
color: #ffffff, background color: #009de0, font size: 12.0pt, font weight:
normal).
o de linktekst 'Meer nieuws' heeft een te laag contrast met de witte
achtergrond. De contrastverhouding is 3,04:1, maar zou minimaal 4,5:1
32
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
moeten zijn. (details: foreground color: #009de0, background color: #ffffff,
font size: 9.8pt, font weight: normal)
o de link naar het mailadres van de gemeente heeft te weinig contrast (blauw
op grijs). De contrastverhouding is 3,13:1. Dit zou minimaal 4,5:1 moeten zijn.
(foreground color: #0079ad, background color: #d0d0d0, font size: 9.8pt, font
weight: normal). Dit geldt ook voor de link 'openingstijden’.
Inschrijfformulier (pdf)
• Het contrast van de lichtblauwe tekst op de witte achtergrond in de pdf is niet
afdoende.
Pagina over afval
• Op de onderzochte pagina's waaronder deze komen problemen voor met
onvoldoende contrast. Het gaat om het lichtblauw op wit en het lichtblauw op grijs.
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• Het contrast is niet overal afdoende bij de combinatie blauw-wit.
Succescriterium 1.4.4 Herschalen van tekst: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 1.4.5
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Behalve voor ondertitels voor doven en slechthorenden en afbeeldingen van tekst, kan tekst
zonder hulptechnologie tot 200 procent schalen zonder verlies van content of functionaliteit.
33
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Uitgelichte pagina’s
Nieuwspagina
• Wanneer gezoomd wordt vallen delen over elkaar heen en achter andere delen
content (zie de screenshots op de volgende pagina).
34
3. Onderzoeksresultaten Principe Waarneembaar
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 1.4.5 Afbeeldingen van tekst: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 1.4.4
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Dit succescriterium gaat over het gebruik van tekst in plaats van afbeeldingen van tekst.
‘Echte tekst’ kan door de gebruiker die bijvoorbeeld slechtziend is anders weergegeven
worden om beter bruikbaar te zijn. Bijvoorbeeld in een hoger contrast. Dit is goed mogelijk
met echte tekst, maar niet met afbeeldingen van tekst. Daarom moet informatie ook altijd in
zichtbare tekst worden aangeboden.
Uitgelichte pagina’s
Ondernemersloket
• Er wordt informatie gegeven in afbeeldingen van tekst die niet beschikbaar is in
echte tekst ("Scheemda, Winschoten, Nieuweschans. Kies een plaats voor een
kaveloverzicht").
Dorpen en wijken
• Op de pagina staan afbeeldingen van tekst zonder dat hierbij dezelfde informatie ook
in (aanpasbare) echte tekst wordt aangeboden. Mensen die de weergave van een
pagina aanpassen omdat ze bijvoorbeeld slechtziend zijn, kunnen tekst in
afbeeldingen niet goed aanpassen waardoor deze niet goed toegankelijk is.
35
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Principe 2 Bedienbaar
Richtlijn 2.1 Toetsenbordtoegankelijk
Succescriterium 2.1.1 Toetsenbord: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.1.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Alle functionaliteit op een pagina moet bedienbaar zijn met het toetsenbord. Denk
bijvoorbeeld aan menu’s, knoppen of uitklapbare tekst.
Uitgelichte pagina’s
Pagina met een evenement: Adrilllen
• De uitklap van het menu is niet met het toetsenbord toegankelijk. Deze menuopties
zijn echter ook op de pagina's beschikbaar, wanneer gebruikt wordt van de
hoofdonderdelen van de navigatie.
Besluitenlijst college
• Opmerking: Links met besluitenlijsten worden allemaal dubbel aangeboden. De
koppen die ook links zijn, zijn echter visueel verborgen. Ze komen wel terug in de
tabvolgorde. Je ziet daardoor niet waar je bent, waardoor op de pagina het lastiger is
om met het toetsenbord te navigeren.
36
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 2.1.2 Geen toetsenbordval: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.1.2
Uitkomst: Geen problemen aangetroffen
Richtlijn 2.2 Genoeg tijd
Succescriterium 2.2.1 Timing aanpasbaar: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.2.1
Uitkomst: nog onbekend
Korte uitleg succescriterium
Voor diverse bezoekers met een functiebeperking duurt het afronden van een taak langer.
Bezoekers moeten daarom tijdslimieten die verbonden zijn aan het afronden van een taak
bijvoorbeeld kunnen uitzetten, verlengen of aanpassen. Dit komt bijvoorbeeld voor bij
formulieren met een sessie. Er zijn ook uitzonderingen gedefinieerd: bijvoorbeeld bij een
veiling, een reactietest, of als de limiet al 20 uur is.
Bevindingen
Extern kunnen wij op dit moment niet met zekerheid vaststellen of er formulieren gebruikt
worden waarbij tijdslimieten aan de bezoeker worden opgelegd. De gemeente Oldambt zal
dit in kaart moeten brengen om te beoordelen of aan dit succescriterium wordt voldaan.
Succescriterium 2.2.2 Pauzeren, stoppen, verbergen: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.2.2
Uitkomst: Geen problemen aangetroffen
37
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Richtlijn 2.3 Toevallen
Succescriterium 2.3.1 Drie flitsen of beneden drempelwaarde:
(Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.2.2
Uitkomst: Geen problemen aangetroffen
Richtlijn 2.4 Navigeerbaar
Succescriterium 2.4.1 Blokken omzeilen: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.4.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Een van de manieren om blokken te omzeilen zijn omzeilende links. Omzeilende links zijn
links die iemand kan gebruiken die met het toetsenbord navigeert en door bijvoorbeeld
blinden die de pagina lineair gebruiken. Omzeilende links worden gebruikt om snel naar
bijvoorbeeld de hoofdinhoud van een pagina te springen. Ze worden zichtbaar bij focus.
Bevindingen
Opmerking: Er is een omzeilende link naar de inhoud. We raden aan meer omzeilende linkst
op te nemen, bijvoorbeeld naar zoeken en contact.
38
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Uitgelichte pagina’s
Besluitenlijst van 14 juni 2017 (pdf))
• Er zijn geen koppen en bladwijzers om makkelijk door het document te navigeren.
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• Er zijn geen koppen en bladwijzers om makkelijk door het document te navigeren.
Succescriterium 2.4.2 Paginatitel: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.4.2
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Webpagina's waaronder documenten, hebben een titel die het doel of het onderwerp van de
pagina beschrijft. Dit maakt het voor verschillende groepen gebruikers makkelijker om te
begrijpen wat het onderwerp of doel van de pagina is. Daarnaast is het makkelijker navigeren
tussen verschillende pagina's.
Uitgelichte pagina’s
Inschrijfformulier (pdf)
• De paginatitel van de pdf is niet kort en beschrijvend: 'Microsoft Word - Adrillenmarkt
2017'.
• Aangegeven is dat de bestandsnaam getoond moet worden in plaats van de
documenttitel.
• Opmerking: de auteur is 'renate.kuper' en niet de gemeente.
Zoekresultaten
• De paginatitel is 'Site | Gemeente Oldambt'. Dit is geen beschrijvende paginatitel
voor de zoekresultatenpagina.
39
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Filter zoekresultaten
• De paginatitel is 'Site | Gemeente Oldambt'. Dit is geen beschrijvende paginatitel
voor de zoekresultatenpagina.
Elektronisch gemeenteblad gemeente Oldambt 2017, week 25 nr. 25.pdf
• De pdf heeft geen documenttitel.
• Aangegeven is dat de bestandsnaam getoond wordt.
• Opmerking: de auteur van het document is 'E.M. Knot', niet de gemeente Oldambt.
Besluitenlijst van 14 juni 2017 (pdf)
• Het document heeft geen goede documenttitel. De documenttitel is 'Microsoft Word
- Besluitenlijst van 20 juni 2017'. In bijvoorbeeld tabbladen zie je het eerste deel van
de titel eerst. Dit onderdeel is juist niet beschrijvend voor de inhoud van het
document.
• Er is niet aangegeven dat de documenttitel getoond moet worden bij openen.
• Opmerking: de auteur is 'liane.warntjes', niet de gemeente Oldambt.
Succescriterium 2.4.3 Focus volgorde: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.4.3
Uitkomst: Geen problemen aangetroffen
Succescriterium 2.4.4 Linkdoel (in context): (Niveau A)
Resultaat van de hele steekproef voor succescriterium 2.4.4
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Het doel van elke link kan bepaald worden uit enkel de linktekst of uit de linktekst samen
met de omringende content.
40
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Uitgelichte pagina’s
Homepage
• De linktekst van 'Afvalbrengstation', 'Openingstijden', 'Afspraak maken' et cetera
bestaat uit twee keer deze termen achter elkaar. Dus 'Afvalbrengstation
Afvalbrengstation', 'Openingstijden Openingstijden', 'Afspraak maken Afspraak
maken' et cetera. Dat komt omdat de decoratieve afbeeldingen een alternatieve tekst
hebben die dezelfde term bevat en ook in de linktekst staat. Laat de alt-attributen
leeg zodat de linktekst kort en beschrijvend is.
• De links naar social media hebben geen linktekst. Er staat weliswaar een span-
element in de link met een linktekst. Deze is echter niet alleen visueel verborgen,
maar ook verborgen voor screenreaders. Dit komt omdat er gebruik gemaakt is van
'display:none'. Gebruik een andere methode om tekst te verbergen, maar wel
beschikbaar te maken voor screenreaders.
• Opmerking: De omzeilende link heet 'Overslaan en ga naar content'. De linktekst is
duidelijker bij enkel 'Ga naar inhoud’.
Pagina over afval
• Opmerking: links als 'lees verder' en 'lees meer' zijn niet optimaal. Ze zijn niet fout
volgens de richtlijnen. De eis is dat ze duidelijk zijn binnen de context. Als je echter
kijkt naar de bruikbaarheid van de links dan leveren ze wel wat problemen op. In een
linklijst zijn ze niet eenduidig, en voor de scannende bezoeker, de bezoeker met
vergrotingssoftware en zoekmachines zijn ze niet optimaal. Gebruik liever
beschrijvende linkteksten. Bijvoorbeeld 'Lees meer <start link>informatie over het
laten versnipperen van takken<einde link>'
Ondernemersloket
• De linktekst is nog onvertaald: 'More Nieuws ondernemen'
• Opmerking: Houd linkteksten liever kort en beschrijvend, ook buiten de context. Dan
zijn ze duidelijk voor de gebruiker van hulpapparatuur (linklijst), de scannende
bezoeker, mensen die vergrotingssoftware gebruiken en zoekmachines. Het gaat om
41
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
de linktekst "vul dan het contactformulier in".
Dorpen en wijken
• De linkstekst 'website' is niet duidelijk, ook niet binnen de context. De volledige tekst
is 'Voor meer informatie zie elders op onze gemeentelijke website (volg de link)'.
Voorkomen van problemen (link)
• Opmerking: zorg liever voor linkteksten die duidelijk zijn buiten de context. Er wordt
nu bijvoorbeeld een linktekst 'deze pagina' gebruikt. Als een linktekst beschrijvend is,
dan is deze beter bruikbaar door mensen die de pagina scannen, mensen die een
leeslijst gebruiken, mensen die content vergroten en zoekmachines.
Succescriterium 2.4.5 Meerdere manieren: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 2.4.5
Uitkomst: Geen problemen aangetroffen
Succescriterium 2.4.6 Koppen en labels: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 2.4.6
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Koppen en labels dienen te beschrijven waar de inhoud die eronder valt over gaat.
Uitgelichte pagina’s
Paspoort
• De secties onderaan de pagina hebben een label 'editorial'. Dit beschrijft voor de
bezoeker niet de inhoud van de sectie. Het is niet nodig om hier labels toe te voegen,
gebruik liever koppen.
42
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
In de code: section aria-label="editorial"
Filter zoekresultaten
• De koppen (h3) bevatten de tekst 'Subject_page'. Koppen zijn dan:
o Openingstijden - Subject_page
o Hulp in uw omgeving - Subject_page et cetera.
Zorg voor koppen die beschrijvend zijn voor bezoekers. De aanvullende informatie is
niet in leesbare taal of duidelijk Nederlands.
Succescriterium 2.4.7 Focus zichtbaar: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 2.4.7
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Als je navigeert met het toetsenbord, dan moet zichtbaar zijn waar je op dat moment bent.
Uitgelichte pagina’s
Besluitenlijst college
• Verborgen links krijgen wel de focus, maar je ziet niet waar je bent. Het zijn links die
dubbel in de code voorkomen, zoals ‘parafenbesluitenlijst van 20 juni 2017.pdf’. Als
elke link maar een keer voorkomt is dit probleem opgelost.
Principe 3 Begrijpelijk
43
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Richtlijn 3.1 Leesbaar
Succescriterium 3.1.1 Taal van de pagina: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 3.1.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Dit succescriterium eist dat de taal van de pagina in de code wordt aangegeven. Bijvoorbeeld
Duits, Nederlands of Engels. Browsers en hulptechnologieën kunnen een tekst dan goed
weergeven en tekst kan in de juiste taal worden voorgelezen.
Uitgelichte pagina’s
Inschrijfformulier (pdf)
• Er is geen taal opgegeven voor de pdf. Het is voor software dus niet bekend in welke
taal het document is opgesteld.
Besluitenlijst van 14 juni 2017 (pdf)
• Er is geen taal opgegeven voor het document.
Succescriterium 3.1.2 Taal van onderdelen: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 3.1.2
Uitkomst: Geen problemen aangetroffen
Richtlijn 3.2 Voorspelbaar
Succescriterium 3.2.1 Bij focus: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 3.2.1
Uitkomst: Geen problemen aangetroffen
44
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
45
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 3.2.2 Bij input: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 3.2.2
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Filter zoekresultaten
• Bij input wordt de pagina herladen.
Succescriterium 3.2.3 Consistente navigatie: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 3.2.3
Uitkomst: Geen problemen aangetroffen
Succescriterium 3.2.4 Consistente identificatie: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 3.2.4
Uitkomst: Geen problemen aangetroffen
Richtlijn 3.3 Assistentie bij invoer
Succescriterium 3.3.1 Fout identificatie: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 3.3.1
Uitkomst: Geen problemen aangetroffen
Succescriterium 3.3.2 Labels of instructies: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 3.3.2
Uitkomst: Geen problemen aangetroffen
46
3. Onderzoeksresultaten Principe Begrijpelijk
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Succescriterium 3.3.3 Foutsuggestie: (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 3.3.3
Uitkomst: Geen problemen aangetroffen
Succescriterium 3.3.4 Foutpreventie (wettelijk, financieel,
gegevens): (Niveau AA)
Resultaat van de hele steekproef voor succescriterium 3.3.4
Uitkomst: Geen problemen aangetroffen
47
3. Onderzoeksresultaten Principe Robuust
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Principe 4 Robuust
Richtlijn 4.1 Compatibel
Succescriterium 4.1.1 Parsen: (Niveau A)
Resultaat van de hele steekproef voor succescriterium 4.1.1
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Uitgelichte pagina’s
Openingstijden
• Opmerking: Een document moet een karakteringcodering hebben en dit moet
aangegeven worden met slechts één meta-element waarmee de karakteringcodering
aangegeven wordt. De pagina heeft echter meerdere meta-elementen waarmee de
karaktercodering wordt aangegeven:
<meta charset="utf-8"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
Succescriterium 4.1.2 Naam, rol, waarde: (Niveau A)
Resultaat van de hele steekproef succescriterium 4.1.2
Eén of meerdere pagina’s voldoen nog niet aan dit succescriterium.
Korte uitleg succescriterium
Het doel van dit succescriterium is onder andere dat hulptechnologieën
bedieningselementen, zoals links en knoppen, goed kunnen gebruiken. De bevindingen bij dit
succescriterium gaan over of de code zo is opgebouwd dat de content goed toegankelijk is.
Standaard-HTML is toegankelijk. Als er echter bedieningselementen op maat gemaakt
worden dan is er vaak extra werk nodig om ze voor iedereen bruikbaar te maken.
48
3. Onderzoeksresultaten Principe Robuust
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Uitgelichte pagina’s
Homepage
• Opmerking: Elementen hebben al een rol. Het toevoegen van een rol met aria is
onnodig en kan tot extra beheer leiden:
o De navigation role is onnodig voor het element nav.
o De complementary role is onnodig voor het element aside.
Paspoort
• De tabbladen moeten direct vallen onder de tablist. Ze zitten nu in verschillende li-
elementen waardoor een screenreader niet kan aangeven hoeveel tabelementen er
zijn. Dit is niet conform specificatie. Het is wel duidelijk welk tabblad geopend is.
• Je kunt nu naar elk tabblad tabben, maar volgens specificatie moet je alleen naar de
tabbladen als geheel ('de tablijst') kunnen navigeren met de tabtoets en vervolgens
met de pijltoetsen een tabblad kiezen. Elk tabblad komt nu echter twee keer voor in
de tabvolgorde.
Ondernemersloket
• Elk blokje heeft een label 'Editorial'. Haal dit label weg.
• Er zijn aria labels (in het Engels), terwijl er ook Nederlandstalige labels zijn. Hierbij
speelt het volgende probleem:
o De Nederlandstalige labels worden niet aan de screenreader getoond omdat
er aria labels zijn. Haal deze aria labels weg.
• Let op: op de site wordt tekst voor iedereen verborgen en enkel visueel verborgen
met gebruik van dezelfde class. Hiervoor wordt echter dezelfde class gebruikt. Maak
voor deze twee situaties verschillende classes.
• Op de carrousel zit een rol listbox. Het betreft hier echter geen listbox.
• Deze carrousel veroorzaakt toegankelijkheidsproblemen omdat bij elke verandering
de carrousel automatisch voorgelezen wordt, of de gebruiker hier nu mee bezig is of
niet.
49
3. Onderzoeksresultaten Principe Robuust
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
50
3. Onderzoeksresultaten Principe Universeel
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
Principe Universeel
De website is onderzocht op WCAG 2.0 niveau AA. De site is gebouwd conform
Webrichtlijnen versie 2. Dat betekent dat ook aan Principe universeel zou moeten zijn
voldaan.
Principe Universeel is nu een aanbevolen standaard. We hebben de site niet volledig getoetst
op Principe Universeel, dat was ook niet de opdracht, maar zien wel een aantal
aandachtspunten die we hierbij terugkoppelen.
Afgekeurde en afgeraden eigenschappen
Er wordt nog gebruik gemaakt van verouderde elementen en attributen. Dit gebeurt niet op
de meeste pagina’s van de steekproef, maar het komt nog wel voor.
Bijvoorbeeld op de pagina met de verkiezingsuitslagen wordt gebruik gemaakt van
afgekeurde attributen bij het table-element:
• het width-attribuut
• het cellspacing- attribuut
• het cellpadding- attribuut
• het border- attribuut
• het nowrap- attribuut
Daarnaast wordt gebruikt gemaakt van het afgekeurde align-attribuut bij het p-element en
van afgekeurde attribuut nowrap bij het td-element .
Op de pagina met het filmpje over het versterkingsprogramma van Winschoten wordt
verouderde code gebruikt:
• Het frameborder-attribuut op het iframe-element
• Het scrolling-attribuut op het iframe -element
51
3. Onderzoeksresultaten Principe Universeel
Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
UTF-8
Voor een goede uitwisseling van informatie wordt de karaktercodering UTF-8 gespecificeerd,
zowel in het document zelf als via HTTP headers.
Een document moet een karakteringcodering hebben en dit moet aangegeven worden met
slechts één meta-element waarmee de karakteringcodering aangegeven wordt. De pagina
heeft echter meerdere meta-elementen waarmee de karaktercodering wordt aangegeven
Gebruik ten minste open specificaties (Niveau AA)
• De filmpjes over de zwemlessen worden niet in open standaard aangeboden.
• De informatie in het elektronische gemeenteblad (pdf) wordt niet in open standaard
aangeboden.
• De informatie in het filmpje over het Actieprogramma versterking binnenstad
Winschoten’ wordt niet in open standaard aangeboden.
Duidelijke URI's
Niet alle URI’s zijn niet duidelijk, eenvoudig en beschrijvend, waaronder de volgende URL’s:
• https://www.gemeente-
oldambt.nl/sites/default/files/Elektronisch%20gemeenteblad%20gemeente%20Olda
mbt%202017%2C%20week%2025%20nr.%2025.pdf
• https://www.gemeente-oldambt.nl/node/1305
52
Over Firm Ground Herinspectie WCAG 2.0 gemeente Oldambt
juli 2018
4. Over WCAG 2.0
De internationale toegankelijkheidsrichtlijnen WCAG 2.0 zijn richtlijnen voor het toegankelijk
maken van online informatie en diensten. Digitale informatie en diensten worden hiermee
toegankelijk voor mensen met een functiebeperking, waaronder mensen met een
motorische, visuele, auditieve of cognitieve beperking.
WCAG 2.0 is verplicht voor overheden. Overheden dienen een transparante verantwoording
online te plaatsen over het voldoen aan de richtlijnen. Het ministerie van Binnenlandse
Zaken stelt eisen aan hoe deze verantwoording is opgesteld. Afwijken van standaarden op de
pas-toe-of-leg-uit-lijst mag alleen bij zwaarwegende redenen. Voor hoger
onderwijsinstellingen is digitale toegankelijkheid een eis die is opgenomen is in het
accreditatiestelsel.
Het Europees Parlement heeft een richtlijn voor digitale toegankelijkheid aangenomen. Een
richtlijn bevat doelstellingen waar alle lidstaten van de Europese Unie aan moeten voldoen.
Lidstaten werken de richtlijn uit in nationale wetgeving. In 2018 wordt digitale
toegankelijkheid in de publieke sector een wettelijke verplichting.
5. Over Firm Ground
Firm Ground helpt organisaties met het krijgen van grip op de kwaliteit van online
dienstverlening en informatie. Denk aan gebruiksvriendelijkheid, toegankelijkheid en
bouwkwaliteit. Firm Ground helpt organisaties met het opbouwen van kennis, het
verzamelen van feiten voor goede beslissingen, het professionaliseren van online teams en
het aanpassen van de organisatie om digitaal goed te regelen.
Firm Ground is opgericht door İacobien Riezebosch en Bram Duvigneau. Beiden hebben veel
ervaring op het gebied van informatietechnologie, digitale toegankelijkheid, standaarden en
organisatiestrategieën.