Content-audit digitale toegankelijkheid van website metamersfoort.nl

Uitkomst: Onvoldoende

Bevindingen:

Bovenaan de pagina https://www.metamersfoort.nl/default.aspx staat een carrousel. In deze carrousel staan afbeeldingen met lege alt-attributen. Afbeeldingen in een caroussel moeten tekstalternatieven hebben, anders weet een bezoeker met een schermlezer niet wat er staat. Voeg een beschrijvende alternatieve tekst toe aan het alt-attribuut. Dezelfde caroussel staat op https://www.metamersfoort.nl/contact/default.aspx, https://www.metamersfoort.nl/shortcuts/search_search.aspx?search=amersfoort, https://metamersfoort.nl/projecten/vanstortnaarstart/default.aspx en op https://www.metamersfoort.nl/gelote+burgerraad/nieuws-gelote-burgerraad/3070534.aspx?t=Dag-4-aan-de-slag-met-de-adviezen onder de kop “Afbeeldingen”.

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/default.aspx staat een logo met de volledige tekst: “Gelote Burgerraad Amersfoort”. Het tekstalternatief is “Beeldlogo van getekende poppetjes met op de achtergrond de stadshorizon van Amersfoort”. In het tekstalternatief staat niet alle tekst die in de afbeelding te zien is. De volledige tekst uit de afbeelding moet worden opgenomen in het tekstalternatief, zodat bezoekers die het plaatje niet kunnen zien precies weten wat er staat. Verander het tekstalternatief.

Op pagina https://metamersfoort.nl/projecten/vanstortnaarstart/default.aspx staan twee logo’s: “Medegefinancierd door de Europese Unie” en “van stort naar start – Hergebruik van Amersfoorts afval”. Deze logo’s hebben geen tekst alternatieven; de alt-attributen zijn leeg. Informatieve afbeeldingen zoals een logo moeten altijd een alt-tekst hebben. In die alt-tekst moet de volledige tekst staan die in het logo te zien is. Zo weten bezoekers die de afbeelding niet kunnen zien, ook wat er staat. Voeg een alt-tekst toe die de volledige tekst van het logo bevat. Als het logo geen link is, voeg dan ook het woord ‘Logo’ toe aan de alternatieve tekst.

Onderaan de pagina https://metamersfoort.nl/projecten/vanstortnaarstart/default.aspx is een complexe afbeelding aanwezig met het tekstalternatief "Praatplaat Stadssysteem Hoogwaardig Hergebruik Amersfoort". Complexe afbeeldingen zoals infographics en schema’s bevatten veel informatie die niet toegankelijk is voor iemand die de afbeelding niet kan zien. Deze informatie kan gegeven worden via een uitgebreide alt-tekst of een uitgeschreven tekst die op de pagina zelf geplaatst kan worden, maar deze mag ook op een andere pagina of in een downloadbaar bestand staan. Als auteur van de pagina weet je zelf beter welke informatie je aan je lezer wil geven.

In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 staat op pagina 3 een informatieve afbeelding van een grafiek zonder tekstalternatief. Afbeeldingen die met de figure-tag zijn geplaatst, moeten altijd een beschrijving (alt-tekst) hebben. Schermlezers lezen de alt-tekst voor, zodat gebruikers van schermlezers ook alle informatie tot zich kunnen nemen. Omdat de alt-tekst nu ontbreekt, lezen schermlezers alleen “afbeelding” voor. Gebruikers van schermlezers kunnen hierdoor het gevoel krijgen dat ze inhoud missen. Voeg alt-teksten toe.

Uitkomst: Niet van toepassing

Uitkomst: Niet van toepassing

Uitkomst: Niet van toepassing

Uitkomst: Niet van toepassing

Uitkomst: Niet van toepassing

Uitkomst: Onvoldoende

Bevindingen:

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/nieuws-gelote-burgerraad/3070534.aspx?t=Dag-4-aan-de-slag-met-de-adviezen is het strong-element onjuist gebruikt voor opmaakdoeleinden. De hele zin “Dag 4 Start met adviezen.” is in een strong-element geplaatst om deze vetgedrukt weer te geven. Het strong-element heeft een semantische waarde en geeft aan dat de tekst extra nadruk moet krijgen. Dit element mag niet worden gebruikt voor een puur visueel effect. Gebruik hiervoor CSS. Op pagina https://www.metamersfoort.nl/projecten/parkeerbeleid/default.aspx is hetzelfde probleem te zien bij de tekst die begint met: “In een groot deel van Amersfoort wordt betaald parkeren ingevoerd…”. Ook hier is het strong-element gebruikt voor visuele opmaak, wat niet de bedoeling is. Op pagina https://www.metamersfoort.nl/gelote+burgerraad/3014653.aspx?t=Repareren-in-de-buurt-geef-spullen-een-tweede-leven staat een vergelijkbaar probleem onder de kop “Locaties en openingstijden van Repair Cafés in Amersfoort” bij teksten zoals “Hoogland – De Neng”, “Kruiskamp/Koppel – buurthuiskamer BijBosshardt”, “Leusderkwartier – Huis Miereveld” en andere soortgelijke voorbeelden. Ook hier is het strong-element gebruikt om tekst vet te maken zonder semantische noodzaak.

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/nieuws-gelote-burgerraad/3070534.aspx?t=Dag-4-aan-de-slag-met-de-adviezen zijn de teksten “7 thema’s”, “Wat ligt er eigenlijk al vast over minder afval en een prijsprikkel?” en “Democratie- spel” onjuist gemarkeerd met het strong-element in plaats van een juist kop-element. Het element strong is niet bedoeld om koppen mee te markeren. Hiervoor moeten altijd kop-elementen zoals h2 worden gebruikt. Koppen zijn bedoeld om structuur aan te brengen in de inhoud van een pagina. Alleen als deze teksten gemarkeerd zijn met een h-element, kunnen hulpsoftware en bezoekers die structuur begrijpen. Het strong-element is alleen geschikt om nadruk te geven aan enkele woorden of een zinsdeel. Op pagina https://www.metamersfoort.nl/gelote+burgerraad/nieuws-gelote-burgerraad/3037578.aspx?t=Dag-2-Experts-nemen-ons-mee-in-de-wondere-wereld-van-afval komt hetzelfde probleem voor bij de teksten “Experts ronde 1” en “Experts ronde 2”. Deze teksten zijn opgemaakt met strong-elementen in plaats van een kop-element. Op pagina https://www.metamersfoort.nl/gelote+burgerraad/3014653.aspx?t=Repareren-in-de-buurt-geef-spullen-een-tweede-leven is hetzelfde probleem te zien bij de teksten “Repair Cafés” en “Locaties en openingstijden van Repair Cafés in Amersfoort”. Op pagina https://metamersfoort.nl/projecten/vanstortnaarstart/default.aspx is hetzelfde probleem aanwezig bij de tekst “Nieuwsbrief”. Ook deze teksten zijn gemarkeerd met het strong-element terwijl dit koppen zijn.

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/3014653.aspx?t=Repareren-in-de-buurt-geef-spullen-een-tweede-leven wordt onder de kop “Locaties en openingstijden van Repair Cafés in Amersfoort” het em-element onjuist gebruikt voor opmaakdoeleinden. Een voorbeeld is de tekst “Elke 2e zaterdag van de maand, 10.00 – 13.00 uur”. Het em-element heeft een semantische waarde en geeft aan dat de tekst extra nadruk moet krijgen. Dit element mag niet worden gebruikt voor een puur visueel effect zoals cursieve tekst. Gebruik hiervoor CSS. Op pagina https://www.metamersfoort.nl/projecten/parkeerbeleid/default.aspx is hetzelfde probleem aanwezig bij de tekst “- Wethouder Mobiliteit Tyas Bijlholt”. Ook hier wordt het em-element gebruikt om een visueel effect te bereiken.

Op pagina https://www.metamersfoort.nl/met+amersfoort/default.aspx staat onder de kop “Huisregels Met Amersfoort” een lijst met acht items. Het laatste item bevat een sublijst die niet als zodanig is opgemaakt. Hierdoor wordt de gehele tekst als één enkel lijstitem voorgelezen door schermlezers, wat het voor bezoekers moeilijk maakt om de structuur en onderlinge samenhang van de punten te begrijpen. De sublijst moet worden gemarkeerd als een aparte lijst binnen het laatste lijstitem, met behulp van ul- of ol-elementen. Op die manier wordt de structuur van informatie duidelijker voor bezoekers met schermlezers.

Op pagina https://www.metamersfoort.nl/projecten/fiets+veilig+westzijde+amersfoort/default.aspx staat onder de kop “Gegeven reacties” een aantal teksten zoals “Ideeën en antwoorden: Aanleg tweerichtingsfietspad zijde Bos Birkhoven – Bokkeduinen” die ook links zijn. Deze teksten zijn onjuist gemarkeerd met een h3-element, terwijl het geen echte koppen zijn. Er staat namelijk geen inhoud direct onder deze tekst. Door het gebruik van het h-element krijgen deze teksten ten onrechte de betekenis van een kop. Kop-elementen zijn bedoeld om structuur te geven aan de informatie op een pagina. Mensen die schermlezers gebruiken, gebruiken koppen om te navigeren en de structuur van de pagina te begrijpen. Zorg dat alleen teksten die echt de functie van kop of tussenkop hebben, worden gemarkeerd met een h-element. Verwijder het h-element bij deze teksten.

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/3025522.aspx?t=peuken-en-afval-na-een-marktdag- staat een opsomming met twee items die niet correct is gemarkeerd als een lijst. Tekst die eruitziet als een opsomming, moet ook zo in de code worden gemarkeerd. Hiervoor moeten de HTML-elementen ol of ul worden gebruikt. Meestal is hier een knop voor beschikbaar in de content-editor van het CMS. Door deze markering begrijpt hulpsoftware hoe de tekst is opgebouwd. Schermlezers kondigen dan aan hoeveel items er in de lijst staan voordat ze die gaan voorlezen. Zo weet een gebruiker van schermlezer hoeveel informatie er nog komt.

In het PDF-document op https://www.metamersfoort.nl/besloten+omgeving+burgerraad/presentaties+en+documenten/HandlerDownloadFiles.ashx?idnv=3091543 staan meerdere koppen die niet zijn gemarkeerd als kop. Voorbeelden hiervan zijn “Monumentale aftrap in bijzondere sfeer”, “De vraag”, “Prijsprikkel of bezuiniging?” en andere. Hierdoor komt de visuele informatiestructuur niet overeen met de structuur van het document in de tags. Vervang de p-tag door een h-tag, zodat de tag-structuur gelijk is aan de visuele structuur. In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 komt hetzelfde probleem voor bij de tekst “Betalen naar hoeveelheid afval (Diftar)” op pagina 1. Ook hier moet de p-tag vervangen worden door een h-tag.

In het PDF-document op https://www.metamersfoort.nl/besloten+omgeving+burgerraad/presentaties+en+documenten/HandlerDownloadFiles.ashx?idnv=3091543 is op pagina 3 een kop-tag gebruikt voor gewone tekst die geen kop is. Een voorbeeld hiervan is de tekst die begint met: “Op 28 juni hebben we na 5 dagen informatie verzamelen en dialoog met elkaar …”. Ook bij andere teksten op deze pagina, zoals “Diftar is gekoppeld aan andere belastingen en dat de gemeente wil bezuinigen”, is ten onrechte een kop-tag gebruikt. Deze tekst moet worden gemarkeerd met een p-tag in plaats van een kop-tag. Op andere pagina’s in het document komt hetzelfde probleem voor.

In het PDF-document op https://www.metamersfoort.nl/besloten+omgeving+burgerraad/presentaties+en+documenten/HandlerDownloadFiles.ashx?idnv=3091543 staat op pagina 4 onder de kop “Hoe willen we dat bereiken? Welke aanpak/maatregelen stellen we voor?” een lijst met vier items. Deze lijst is niet correct gemarkeerd in de tags. Inhoud die eruitziet als een lijst, moet ook in de tags als lijst gemarkeerd worden. Alleen dan krijgen gebruikers van schermlezers dezelfde informatiestructuur als ziende bezoekers. Een extra voordeel is dat schermlezers het aantal items aankondigen voordat ze gaan voorlezen. Markeer deze lijst met L- en Li-tags. In hetzelfde document komt dit probleem ook voor bij andere lijsten onder dezelfde kop. In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 is hetzelfde probleem te zien bij de lijst met drie items onder de kop “Algemeen”. Ook hier ontbreekt de juiste lijststructuur in de tags.

In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 staat op pagina 4 een datatabel. De juiste opmaak ontbreekt. De cellen met jaartallen fungeren als kolomkoppen, maar zijn gemarkeerd als gewone datacellen met de td-tag. Bij een datatabel moeten speciale tags worden gebruikt voor de tabelkoppen (th-tags), zodat schermlezers de relatie tussen koppen en bijbehorende gegevens kunnen begrijpen. Markeer deze cellen als kolomkoppen met de th-tag.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Onvoldoende

Bevindingen:

In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 staat op pagina 3 een grafiek waarin kleur wordt gebruikt om informatie over te brengen. In de legenda en de balken in de grafiek wordt uitsluitend kleur gebruikt om categorieën van elkaar te onderscheiden. Alleen mensen die kleuren kunnen zien en goed van elkaar kunnen onderscheiden, kunnen zien welke balk of lijn bij welke categorie hoort. Dit probleem kan worden opgelost door naast kleur ook andere visuele kenmerken te gebruiken, zoals verschillende soorten arcering.

Uitkomst: Niet van toepassing

Uitkomst: Onvoldoende

Bevindingen:

Op pagina https://www.metamersfoort.nl/default.aspx staat blauwe tekst met kleurcode (#448EB3) op een witte achtergrond. De contrastratio tussen deze kleuren is 3,6:1. Dit is te laag. Het gaat bijvoorbeeld om de tekst van de links onder de koppen “Denk nu mee over...”, “Hoe werkt het?”, “Inloggen of niet?” en “Jouw gegevens”. Deze tekst is kleiner dan 19px, daarom moet de contrastratio minimaal 4,5:1 zijn. Dezelfde kleurencombinatie wordt gebruikt voor links op andere pagina’s van de website: https://www.metamersfoort.nl/contact/default.aspx, https://www.metamersfoort.nl/Beheer/Registraties/1657922.aspx en anderen.

Op pagina https://www.metamersfoort.nl/default.aspx staat de link “Over 'Met Amersfoort'” met oranje tekst (#EF7C00) op een witte achtergrond. De contrastratio is 2,8:1, wat te laag is. Omdat de tekst kleiner is dan 19px, moet de contrastratio minimaal 4,5:1 zijn. Hetzelfde probleem doet zich voor op pagina https://www.metamersfoort.nl/besloten+omgeving+burgerraad+1+over+afval/presentaties+en+documenten/default.aspx in de link “Presentaties en documenten” en op pagina https://metamersfoort.nl/besloten+omgeving+burgerraad+1+over+afval/basisinformatie-1/ default.aspx in de link “Basisinformatie”.

Op pagina https://www.metamersfoort.nl/shortcuts/search_search.aspx?search=amersfoort hebben de links in de zoekresultaten grijze tekst (#EF7C00) op een lichtgrijze achtergrond (#FAFAFA). De contrastratio is 4,4:1, wat te laag is. Het gaat bijvoorbeeld om de links “Pdf's” en “Floor C. Hoekman Behoefte aan zwemwater in de gemeente Amersfoort.pdf” onder de kop “Floor C. Hoekman Behoefte aan zwemwater in de gemeente Amersfoort.pdf”. Omdat de tekst kleiner is dan 19px, moet de contrastratio minimaal 4,5:1 zijn.

Onderaan de pagina https://metamersfoort.nl/projecten/vanstortnaarstart/default.aspx staat een afbeelding met infographics. Teksten in de kleuren oranje (#FCB046) en groen (#92B250) hebben onvoldoende contrast ten opzichte van de witte, blauwe (#DFF1FB) of lichtgroene (#E0EAC8) achtergrond: van 1,5:1 tot 2,4:1. Zorg ervoor dat de contrastverhouding minimaal 3,0:1 is voor grote teksten en 4,5:1 voor kleine teksten.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Onvoldoende

Bevindingen:

In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 bevindt zich op pagina 3 een afbeelding met grafieken. De lijnen hebben onvoldoende contrast ten opzichte van de witte achtergrond: de oranje lijn (#ED7D31) heeft een contrastverhouding van 2,8:1, de grijze lijn (#A5A5A5) heeft een verhouding van 2,5:1 en de blauwe lijn (#5B9BD5) heeft een verhouding van 2,96:1. Het contrast tussen informatieve elementen van een grafiek moet minimaal 3,0:1 zijn, zodat bezoekers ze van elkaar kunnen onderscheiden. Controleer of alle kleuren in de grafiek voldoende contrast hebben.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Niet van toepassing

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Onvoldoende

Bevindingen:

In het PDF-document op https://metamersfoort.nl/besloten+omgeving+burgerraad/basisinformatie/HandlerDownloadFiles.ashx?idnv=3015629 is geen titel ingesteld in de bestandsinstellingen. Zelfs als er een titel op de eerste pagina staat, moet ook in de PDF-instellingen een documenttitel worden ingesteld. Wanneer een PDF wordt geopend in een PDF-lezer zoals Adobe Acrobat of een browser, wordt meestal de bestandsnaam bovenaan in de titelbalk weergegeven, bijvoorbeeld document123.pdf. Als er een documenttitel in de metadata van de PDF is ingesteld, wordt die titel in plaats van de bestandsnaam getoond. Dit maakt het document toegankelijker voor bezoekers met verschillende beperkingen, omdat zij dan snel en gemakkelijk kunnen beoordelen of het document relevant is. Dit kan aangepast worden in de bestandseigenschappen van het bronbestand of van het PDF-document.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Onvoldoende

Bevindingen:

Op pagina https://www.metamersfoort.nl/gelote+burgerraad/default.aspx staan onder de kop “Inzendingen op thema” meerdere links met dezelfde linktekst: “Bekijk alle inzendingen”, terwijl deze naar verschillende bestemmingen verwijzen. Dit kan verwarrend zijn voor bezoekers. Zorg dat links met dezelfde tekst ook naar dezelfde bestemming verwijzen. Als het om een andere bestemming gaat, moet de linktekst ook anders zijn. Op pagina https://www.metamersfoort.nl/projecten/fiets+veilig+westzijde+amersfoort/default.aspx is hetzelfde probleem te zien bij de links met de tekst “Bekijk de plannen”, die ook naar verschillende bestemmingen verwijzen.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet van toepassing

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Niet van toepassing

Uitkomst: Niet van toepassing

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Voldoende

Uitkomst: Niet van toepassing

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.

Uitkomst: Niet getoetst

Bevindingen:

Dit onderzoek richt zich op de content van de website, zodoende is dit succescriterium niet onderzocht.