Issues:
Systeem-audit digitale toegankelijkheid Systeem Archiefweb en Sitearchief

(Alleen de bevindingen)

Scope van de evaluatie

Uitgebreide toetsresultaten

1. Waarneembaar

1.1 Tekstalternatieven

1.1.1 Niet-tekstuele content (Niveau A)

Informatie over succescriterium 1.1.1 Niet-tekstuele content

Bevinding 1: In Archiefweb op pagina amsterdam.archiefweb.eu/# staat een Nederlandse vlag. Het img-element van deze vlag heeft als alternatieve tekst 'lang-nl'. Dit omschrijft de functie van de vlag onvoldoende. Om het img-element staat een a-element met het title-element 'Taal Nederlands', maar bij sommige browser en hulpsoftware combinaties overschrijft de alternatieve tekst van het img-element het title-attribuut op het a-element. Geef deze afbeelding daarom een goede alternatieve tekst, bijvoorbeeld door de waarde 'Taal Nederlands' in het alt-attribuut te plaatsen.
Dezelfde afbeelding komt ook voor in het Sitearchief venster op pagina rijksoverheid.sitearchief.nl/.

Bevinding 2: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop verschillende invoervelden staan. Op deze pagina staat een sluitknop die visueel gelabeld is met een X-icoon. Er is geen alternatieve tekst voor dit icoon, waardoor de sluitknop de toegankelijke naam 'x' heeft. Zorg ervoor dat dit X-icoon een alternatieve tekst krijgt. Dat kan bijvoorbeeld door gebruik te maken van een screenreader only tekst of een aria-label op het a-element.

Bevinding 3: In het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/ staat het logo van de Rijksoverheid. Dit logo heeft de alternatieve tekst 'Archiefweb, professionele webarchivering voor organisaties', dit omschrijft het logo niet. Zorg ervoor dat de alternatieve tekst ministens de organisatienaam 'Rijksoverheid' bevat.

Bevinding 4: Wanneer bezoekers inzoom bij een schermbreedte van 1280 pixels op rijksoverheid.sitearchief.nl/, verdwijnt van 150% het venster van Sitearchief. Het enige wat hiervan overblijft is een banner aan de onderkant van het scherm waarin twee pijlknoppen staan. Deze knoppen zijn visueel gelabeld met pijliconen zonder een alternatieve tekst. Ook zijn deze iconen via CSS op de pagina geplaatst. Als bezoekers eigen CSS toepassen op de website of de CSS wordt niet correct geladen, kunnen deze iconen wegvallen. Daarom mag CSS niet gebruikt worden om informatieve content op een pagina te plaatsen. Los dit probleem op door de iconen via HTML en met een alternatieve tekst op de pagina te plaatsen, bijvoorbeeld door gebruik te maken van een img-element met een alt-attribuut. Zie ook succescriterium 4.1.2.
Dit komt ook voor op amsterdam.archiefweb.eu/.

1.2 Op tijd gebaseerde media

1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen)

Bevinding 5: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen)

Bevinding 6: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)

Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)

Bevinding 7: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.2.4 Ondertitels voor doven en slechthorenden (live) (Niveau AA)

Informatie over succescriterium 1.2.4 Ondertitels voor doven en slechthorenden (live)

Bevinding 8: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)

Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)

Bevinding 9: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.3 Aanpasbaar

1.3.1 Info en relaties (Niveau A)

Informatie over succescriterium 1.3.1 Info en relaties

Bevinding 10: In de Archiefweb op pagina amsterdam.archiefweb.eu/ heeft het zoekveld een toegankelijke naam gekregen op meerdere manier. Er is een label-element aanwezig wat via for en id-attributen is gekoppeld aan het input-element maar dat onzichtbaar is gemaakt ook voor hulpsoftware door de style display:none. Ook staat er een title-attribuut op het input-element en is er een placeholdertekst aanwezig. Door deze verschillende methodes kan er bij sommige browsers en hulpsoftware combinaties geen goede toegankelijke naam aanwezig zijn voor dit zoekveld. De beste manier om het veld een toegankelijke naam te geven is door een correcte waarde in te vullen in het label-element en deze te koppelen aan het input-element. Verwijder in dat geval ook het title-attribuut van het input-element.
Dit geldt ook voor het zoekveld in het venster Sitearchief op rijksoverheid.sitearchief.nl/.

Bevinding 11: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop verschillende groepen keuzerondjes en selectievakjes staan. Al deze groepen hebben een bijschrift, bijvoorbeeld 'Soort document'. Dit bijschrift is niet gelabeld aan de bijbehorende selectievakjes of keuzerondjes. Hierdoor is het voor gebruikers van hulpsoftware moeilijk om een correcte keuze te maken. Zorg ervoor dat het bijschrift gekoppeld is aan de selectievakjes of keuzerondjes, bijvoorbeeld door gebruik te maken van een fieldset of legend combinatie.
Dit komt ook voor op de website rijksoverheid.sitearchief.nl/.

1.3.2 Betekenisvolle volgorde (Niveau A)

Informatie over succescriterium 1.3.2 Betekenisvolle volgorde

Bevinding 12: Op pagina amsterdam.archiefweb.eu/ is de pagina opgedeeld in twee onderdelen, het Archiefweb venster en een iframe-element dat de homepage van de website van gemeente Amsterdam toont. In de HTML code is de volgorde van deze elementen niet correct. Als eerste is de content dat in de het roze vlak van het Archiefweb venster staat in de code geplaatst, daarna volgt het iframe-element, en daarna pas alle andere content in het Archiefweb venster (zoals de kalender). Door deze volgorde in de HTML code moeten gebruikers van hulpsoftware eerste navigeren over de hele pagina voordat bijvoorbeeld de kalender wordt voorgelezen door een screenreader. Sommige screenreadergebruikers zullen hierdoor de kalender missen. Zorg voor een logische volgorde van content in de HTML code. In dit geval is het beter om alle content in het Archiefweb venster eerste voor te laten komen in de HTML code en daarna pas het iframe.
Dit probleem komt ook voor in het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/.

1.3.3 Zintuiglijke eigenschappen (Niveau A)

Informatie over succescriterium 1.3.3 Zintuiglijke eigenschappen

Bevinding 13: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.4 Onderscheidbaar

1.4.3 Contrast (minimum) (Niveau AA)

Informatie over succescriterium 1.4.3 Contrast (minimum)

Bevinding 14: In de Archiefweb op pagina amsterdam.archiefweb.eu/ wordt gebruik gemaakt van grijze tekst (HEX #EBEBEB) '© GWCrossmedia' op een roze achtergrond (HEX #E51564). Deze tekst heeft een contrastverhouding van 3,8:1, waar dat minimaal 4,5:1 moet zijn.

Bevinding 15: In de Archiefweb op pagina amsterdam.archiefweb.eu/ staan witte teksten (de dagen van de week) op een grijze achtergrond (HEX #A4A4A4). Deze kleurencombinatie heeft te weinig contrast. De contrastverhouding is hier 2,4:1, waar dat minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt ook voor in het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 16: In de Archiefweb op pagina amsterdam.archiefweb.eu/ staat grijze tekst (HEX #DCDCDC) 'Beschikbare archieven' op een grijze achtergrond (HEX #7A7A7A). Deze kleuren hebben een contrastverhouding van 3,1:1, waar dat minimaal 4,5:1 moet zijn.

Bevinding 17: In de kalender in Archiefweb op pagina amsterdam.archiefweb.eu/ staan witte cijfers op een grijze achtergrond (HEX #7A7A7A). Deze kleuren hebben te weinig contrast. De contrastverhouding is hier 4,2:1, waar dat minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt ook voor in het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 18: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop de roze tekst 'Geavanceerd zoeken' (HEX #E51564) staat. Op de lichtgrijze achtergrond (HEX #F1F1F1) heeft deze tekst onvoldoende contrast. De contratsverhouding is hier 4:1, waar da minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt ook voor in het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 19: In het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/ staan grijze teksten (HEX #DCDCDC) zoals 'Dit is het webarchief van...', op een grijze achtergrond (HEX #7A7A7A). Deze kleurencombinatie heeft onvoldoende contrast. De contrastverhouding is hier 3,1:1, waar dat minimaal 4,5:1 moet zijn.

Bevinding 20: In het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/ staat de grijze tekst (HEX #EBEBEB) '© GWCrossmedia' op een blauwe achtergrond (HEX #007BC7). Deze kleuren hebben onvoldoende contrast. De contrastverhouding is hier 3,7:1, waar dat minimaal 4,5:1 moet zijn.

1.4.5 Afbeeldingen van tekst (Niveau AA)

Informatie over succescriterium 1.4.5 Afbeeldingen van tekst

Bevinding 21: Dit onderzoek richt zich op de techniek van de website, zodoende is dit succescriterium niet onderzocht.

1.4.10 Reflow (Niveau AA)

Informatie over succescriterium 1.4.10 Reflow

Bevinding 22: Wanneer bezoekers inzoom bij een schermbreedte van 1280 pixels op rijksoverheid.sitearchief.nl/, verdwijnt van 150% het venster van Sitearchief. Het enige wat hiervan overblijft is een banner aan de onderkant van het scherm waarmee bezoekers naar vorige data kunnen navigeren. Bij het inzoomen gaan verschillende functionaliteiten en content verloren, zoals de zoekfunctie en informatie over Sitearchief. Zorg ervoor dat het voor bezoekers mogelijke is om bij een schermbreedte van 1280 pixels in te zoomen tot 400% zonder verlies van content en functionaliteiten.
Dit komt ook voor op pagina amsterdam.archiefweb.eu/# .

1.4.11 Contrast van niet-tekstuele content (Niveau AA)

Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content

Bevinding 23: Onder de kalender in de Archiefweb op pagina amsterdam.archiefweb.eu/ staan twee knoppen, één om een jaar terug te gaan en één om naar het laatste archief te gaan. De iconen die deze knoppen labelen (HEX #534741) hebben te weinig contrast op de grijze achtergrond (HEX #8D8D8C). De contrastverhouding is hier 2,6:1, waar dat minimaal 3:1 mag zijn.
Deze knoppen komen ook voor in het Sitearchief venster op rijksoverheid.sitearchief.nl/.

2. Bedienbaar

2.1 Toetsenbordtoegankelijk

2.1.1 Toetsenbord (Niveau A)

Informatie over succescriterium 2.1.1 Toetsenbord

Bevinding 24: In het Archiefweb venster op pagina amsterdam.archiefweb.eu/ staan links om te navigeren naar het laatste archief, een jaar terug te navigeren en om een jaar verder mee te navigeren. Deze links zijn niet te bedienen met het toetsenbord. Dit geldt ook voor de klikbare tekst 'Verberg opties'. Hierdoor kunnen toetsenbordgebruikers geen gebruik maken van deze functionaliteiten. Zorg ervoor dat het voor toetsenbordgebruikers mogelijk is om focus te plaatsen op deze links, en dat ze te bedienen zijn via het toetsenbord.
Dezelfde elementen zijn ook niet te bedienen met het toetsenbord in het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 25: Wanneer bezoekers inzoom bij een schermbreedte van 1280 pixels op rijksoverheid.sitearchief.nl/, verdwijnt van 150% het venster van Sitearchief. Het enige wat hiervan overblijft is een banner aan de onderkant van het scherm waarmee bezoekers naar vorige data kunnen navigeren. De pijlknoppen in deze banner zijn niet te bedienen met het toetsenbord. Zorg ervoor dat het voor toetsenbordgebruiker mogelijk is om focus te plaatsen op alle bedienbare elementen.
Dit probleem komt ook voor op pagina amsterdam.archiefweb.eu/ wanneer hier wordt ingezoomd.

2.4 Navigeerbaar

2.4.3 Focus volgorde (Niveau A)

Informatie over succescriterium 2.4.3 Focus volgorde

Bevinding 26: Archiefweb op pagina amsterdam.archiefweb.eu/ is niet makkelijk te bedienen voor toetsenbordgebruikers. Toetsenbordgebruikers moeten eerst navigeren over de hele pagina van gemeente Amsterdam voordat zijn bij de kalender en het zoekveld kunnen komen. Dit zit de bediening van het Archiefweb venster in de weg. Zorg ervoor dat toetsenbordfocus als eerst op het Archiefweb venster wordt geplaatst en daarna pas op de achterliggende pagina.
Een soortgelijk probleem komt ook voor in het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 27: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop verschillende invoervelden staan. Om deze pagina goed te kunnen bedienen als toetsenbordgebruiker is het belangrijk dat toetsenbordfocus direct na de link 'Geavanceerd zoeken' op het eerste bedienbare element op de pagina wordt geplaatst. Op dit moment gaat de toetsenbordfocus eerst nog over de adresbalk van de browser en de combobox van het Archiefweb venster voordat deze op de invoervelden terecht komt.
Een soortgelijk probleem komt ook voor in het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/.

2.4.4 Linkdoel (in context) (Niveau A)

Informatie over succescriterium 2.4.4 Linkdoel (in context)

Bevinding 28: Opmerking: Wanneer bezoekers inzoom bij een schermbreedte van 1280 pixels op rijksoverheid.sitearchief.nl/, verdwijnt van 150% het venster van Sitearchief. Het enige wat hiervan overblijft is een banner aan de onderkant van het scherm waarin twee pijlknoppen en een datum staan. De datum is opgemaakt met een a-element, maar deze link verwijst naar de huidige pagina. Dit kan verwarrend zijn voor sommige bezoekers. Het zou beter zijn om de datum niet op te maken als link.
Deze link staat ook op amsterdam.archiefweb.eu/ wanneer wordt ingezoomd.

2.4.6 Koppen en labels (Niveau AA)

Informatie over succescriterium 2.4.6 Koppen en labels

Bevinding 29: Op pagina amsterdam.archiefweb.eu/# is de website van de gemeente Amsterdam via een iframe-element op de pagina geplaatst. Dit iframe heeft de toegankelijke naam 'site-frame' gekregen via een title-attribuut. Dit omschrijft de inhoud van het iframe onvoldoende. Zorg ervoor dat de toegankelijke naam van het iframe duidelijk maakt dat de website van de gemeenste Amsterdam binnen het iframe staat.
Op pagina rijksoverheid.sitearchief.nl/ staat ook een iframe met dezelfde toegankelijke naam. Hier omschrijft de toegankelijke naam ook niet de inhoud van het iframe.

2.4.7 Focus zichtbaar (Niveau AA)

Informatie over succescriterium 2.4.7 Focus zichtbaar

Bevinding 30: Wanneer in het Archiefweb op pagina amsterdam.archiefweb.eu/ focus wordt geplaatst op de taalwisselknop wordt dat niet aangegeven met een visuele indicator. Hierdoor weten ziende toetsenbordgebruikers mogelijk niet welk element focus heeft. Zorg ervoor dat focus altijd wordt aangeven met een visuele indicator, het is voldoende om een focusrand te gebruiken.
Dit probleem komt ook voor bij de taalwisselknop in het venster van Sitearchief op pagina rijksoverheid.sitearchief.nl/.

2.5 Input modaliteiten

2.5.3 Label in naam (Niveau A)

Informatie over succescriterium 2.5.3 Label in naam

Bevinding 31: In Arhiefweb op pagina amsterdam.archiefweb.eu/# staat het zoekveld met het visuele label 'Vul hier uw zoekveld in...'. Vanwege het title-attribuut dat op het input-element van dit zoekveld staat kan de toegankelijke naam van het veld in sommige gevallen 'zoeken in het archief' zijn. Doordat het visuele label dan niet volledig voorkomt in de toegankelijke naam, kan het veld moeilijk te bedienen zijn met spraakgestuurde bediening. Zorg ervoor dat het visuele label van dit veld voorkomt in de toegankelijke naam, het liefs vooraan. een oplossing voor dit probleem is het geven van een toegankelijke naam met de methode die staat omschreven bij succescriterium 1.3.1.
Hetzelfde geldt voor het zoekveld op in het Sitearchief venster op pagina rijksoverheid.sitearchief.nl/.

3. Begrijpelijk

3.1 Leesbaar

3.1.2 Taal van onderdelen (Niveau AA)

Informatie over succescriterium 3.1.2 Taal van onderdelen

Bevinding 32: Opmerking: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop de tekst 'woorden die u don't wilt weergeven, bijvoorbeeld: receptie' staat. Bezoekers die de Engelse taal niet machtig zijn kunnen moeite hebben met het begrijpen van deze zin, ook wordt de zin met een aparte uitspraak voorgelezen door screenreader. Het is beter om het woordje 'don't' te vertalen naar 'niet'.
Dit komt ook voor op pagina rijksoverheid.sitearchief.nl/.

3.3 Assistentie bij invoer

3.3.2 Labels of instructies (Niveau A)

Informatie over succescriterium 3.3.2 Labels of instructies

Bevinding 33: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop verschillende invoervelden staan. Naast het veld 'geen van deze woorden:' staat de instructie 'woorden die u don't wilt weergeven, bijvoorbeeld: receptie'. Dit is geen duidelijke instructie, zorg ervoor dat bezoekers weten wat er ingevuld moet worden.

4. Robuust

4.1 Compatibel

4.1.2 Naam, rol, waarde (Niveau A)

Informatie over succescriterium 4.1.2 Naam, rol, waarde

Bevinding 34: Via de link 'Geavanceerd zoeken' in het Archiefweb venster op pagina amsterdam.archiefweb.eu/# kunnen bezoekers een pagina openen waarop verschillende invoervelden staan. Alle invoervelden op deze pagina hebben geen toegankelijke naam. Hierdoor kunnen bezoekers die gebruikmaken van hulpsoftware moeite hebben met het invullen van deze velden. Zorg ervoor dat alle invoervelden een toegankelijke naam hebben. De beste methode om de velden een toegankelijke naam te geven is ervoor zorgen dat het visuele label van het veld in een label-element staat, en koppel deze aan het bijbehorende input-element via for- en id-attributen. Er mag ook gebruik worden gemaakt van aria-label.
Dit probleem komt ook voor in het venster Sitearchief op pagina rijksoverheid.sitearchief.nl/.

Bevinding 35: Wanneer bezoekers inzoom bij een schermbreedte van 1280 pixels op rijksoverheid.sitearchief.nl/, verdwijnt van 150% het venster van Sitearchief. Het enige wat hiervan overblijft is een banner aan de onderkant van het scherm waarin twee pijlknoppen staan. Deze twee elementen hebben geen toegankelijke naam omdat de pijliconen geen alternatieve tekst hebben, zie ook succescriterium 1.1.1. Zorg ervoor dat deze elementen een goede alternatieve tekst krijgen, bijvoorbeeld door gebruik te maken van een aria-label op de a-elementen.
Dit geldt ook voor pagina amsterdam.archiefweb.eu/.

Onderbouwing van de evaluatie

Het onderzoek is uitgevoerd op basis van de evaluatiemethode van het W3C, WCAG-EM. Dit gebeurt grotendeels handmatig door een steekproef te nemen. Voor een quickscan geldt dat we slechts delen uit deze methodiek gebruiken. Ondanks alle zorgvuldigheid en ervaring van de onderzoeker kan het voorkomen dat een probleem niet gesignaleerd is. Houd er rekening mee dat in een volgend onderzoek bepaalde onderdelen anders worden beoordeeld omdat technologieën en hulpsoftware worden doorontwikkeld. Bij het handmatig onderzoek wordt gebruik gemaakt van tools.

Steekproef getoetste webpagina's

• Archiefweb:
  https://amsterdam.archiefweb.eu/#archive
• Sitearchief:
  https://rijksoverheid.sitearchief.nl/#archive

Ondersteunende technieken

• HTML5
• WAI-ARIA
• CSS
• ECMAScript 5
• DOM
• SVG

Bronnen

• Evaluatiedocument WCAG 2.0
  www.drempelvrij.nl/over-het-waarmerk
• Web Content Accessibility Guidelines (WCAG) 2.0 (Geautoriseerde Nederlandse vertaling)
  www.w3.org/Translations/WCAG20-nl
• Website Accessibility Conformance Evaluation Methodology (WCAG-EM)
  www.w3.org/WAI/eval/conformance
• Web Content Accessibility Guidelines (WCAG)
  www.w3.org/WAI/intro/wcag
• How to Meet WCAG 2.1 Quick Reference
  www.w3.org/WAI/WCAG21/quickref/

Deze rapportage is grotendeels gemaakt met de online evaluatietool van W3C.