Issues:
Content-audit digitale toegankelijkheid Kennisbank Sociale Innovatie
(Alleen de bevindingen)
Scope van de evaluatie
Naam website | Kennisbank Sociale Innovatie |
---|---|
Scope van de website |
Binnen de scope van dit onderzoek vallen:
|
Conformiteitsdoel | WCAG 2.1 niveau AA |
Uitgebreide toetsresultaten
1. Waarneembaar
1.1 Tekstalternatieven
1.1.1 Niet-tekstuele content (Niveau A)
Informatie over succescriterium 1.1.1 Niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 1: Het logo in de header op pagina www.kennisbanksocialeinnovatie.nl/ heeft geen alternatieve tekst. Doordat het logo geen alternatieve tekst heeft weten screenreadergebruikers niet wat er op de afbeelding staat. Geef de afbeelding een tekstalternatief waarin alle tekst van het logo in staat.
Deze afbeelding staat op elke pagina in de header, bijvoorbeeld op www.workplaceinnovation.org/.
Bevinding 2: Op de pagina www.kennisbanksocialeinnovatie.nl/ staat in de HTML-code voor de footer een afbeelding. Deze afbeelding heeft op het img-element geen alt-attribuut staan. Zonder leeg alt-attribuut weten screenreader niet dat ze deze afbeelding kunnen negeren. Plaats daarom een leeg alt-attribuut op het img-element van de afbeelding.
Dezelfde afbeelding staat ook op andere pagina's bijvoorbeeld op www.kennisbanksocialeinnovatie.nl/over-ons/ en op www.workplaceinnovation.org/.
1.2 Op tijd gebaseerde media
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)
Uitkomst: Onvoldoende
Bevinding 3: Op de pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… staat een video die een automatisch gegenereerde ondertiteling heeft. De ondertiteling komt niet overal overeen met de audio, bijvoorbeeld rond 0:48 waar 'Alles relatie' staat maar 'Arbeidsrelatie' wordt gezegd. Daarnaast heeft de automatisch gegenereerde ondertiteling geen hoofdletters en punterpunctie waardoor de tekst moeilijk is te lezen. Los dit op door een eigen ondertiteling toe te voegen aan de video.
Bevinding 4: De video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… heeft geen ondertiteling. Hierdoor kunnen mensen die slechthorend of doof zijn niet de informatie in de video tot zich nemen. Zorg ervoor dat een ondertiteling wordt toegevoegd aan de video.
Bevinding 5: Advies:
Op de pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… staat een video die een automatisch gegenereerde ondertiteling heeft. Het vlak waar de video in wordt getoond is klein en de mogelijkheid om de video in fullscreen te bekijken staat uit. Hierdoor is de ondertiteling erg klein en amper leesbaar.
1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) (Niveau A)
Informatie over succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 6: In de video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… komen meerdere keren teksten in beeld te staan, bijvoorbeeld rond 1:32 en 1:44. Ook komen er aan het begin en eind van de video logo's in beeld te staan. Deze teksten en logo's staan niet in een platte tekst buiten de video en worden ook niet uitgesproken door een voiceover. Mensen die afhankelijk zijn van bijvoorbeeld screenreaders weten niet wat er in beeld staat als de teksten en logo's worden getoond. Voeg daarom een transcript toe aan de pagina waarin alle informatie en geschreven teksten uit de video in staan. Of maak gebruik van een audiodescriptie om ook te voldoen aan SC 1.2.5 Audiodescriptie.
Dit probleem komt ook voor bij de video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-….
1.2.5 Audiodescriptie (vooraf opgenomen) (Niveau AA)
Informatie over succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen)
Uitkomst: Onvoldoende
Bevinding 7: In de video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… komen teksten en logo's in beeld te staan, bijvoorbeeld rond 0:04 en 2:16. De teksten en logo's worden niet uitgesproken door een voiceover. Mensen die het beeld niet kunnen zien missen hierdoor belangrijke informatie, zoals wie er aan het woord is en welke organisatie de video heeft gemaakt. Los dit probleem op door de teksten en logo's in de video uit te laten spreken door een voiceover of voeg een extra audiospoor aan de video toe.
Dit probleem komt ook voor bij de video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-….
1.3 Aanpasbaar
1.3.1 Info en relaties (Niveau A)
Informatie over succescriterium 1.3.1 Info en relaties
Uitkomst: Onvoldoende
Bevinding 8: De kop 'TNO' op pagina www.kennisbanksocialeinnovatie.nl/contact/ is opgemaakt met het strong-element. Het strong-element is niet bedoeld om teksten dikgedrukt mee te maken, omdat het element aan hulpsoftware aangeeft dat daar een belangrijke tekst staat. Daarnaast heeft het strong-element niet dezelfde betekenis als een kopelement (h1, h2, h3, etc.). Los dit probleem op door het strong-element te verwijderen en de kop in een kopelement te plaatsen.
Koppen die zijn opgemaakt met het strong-element komen ook voor op andere pagina's, bijvoorbeeld op www.kennisbanksocialeinnovatie.nl/kennis/jonge-honden/.
Bevinding 9: Op pagina www.kennisbanksocialeinnovatie.nl/ staan visueel verborgen koppen. Deze koppen zijn hetzelfde als de visuele koppen op de pagina. Hierdoor wordt bijvoorbeeld de tekst 'Spillover effects of workplace innovation on social innovation' twee keer voorgelezen door screenreaders. Dit is verwarrend voor screenreadergebruikers. Verwijder de visueel verborgen koppen of zorg ervoor dat deze koppen ook verborgen zijn voor screenreaders.
Bevinding 10: In de lopende tekst op pagina www.kennisbanksocialeinnovatie.nl/kennis/anders-inclusie-… staan koppen die alleen zijn opgemaakt met het em-element, bijvoorbeeld de kop 'Onderzoeksvragen'. Het em-elementen is niet bedoeld om teksten schuingedrukt te maken. Het elementen geeft aan hulpsoftware aan dat de tekst binnen het element belangrijk is. Ook heeft het em-element niet dezelfde betekenis als een kopelement (H1, H2, etc). Los dit probleem op door de koppen op deze pagina in een kopelement te plaatsen en het em-element te verwijderen. Het i-element mag wel worden gebruikt om teksten schuingedrukt te maken.
Dit probleem komt ook voor op andere pagina's, bijvoorbeeld op www.workplaceinnovation.org/kennis/moneypenny-shaping-the-….
Bevinding 11: De PDF "Anders inclusief ondernemen" is niet gecodeerd (van tags voorzien). Dit betekent dat er de documentstructuur niet is te bepalen. Er kan daardoor bijvoorbeeld niet worden bepaald wat koppen zijn, de alternatieve tekst bij afbeeldingen en wat de leesvolgorde is. Omdat tags ontbreken kan de PDF niet volledig onderzocht worden (alle succescriterium met betrekking tot de PDF code laag zoals semantische koppen en alt teksten bij afbeeldingen). Let daarom op dat bij het oplossen van dit probleem nieuwe toegankelijkheidsproblemen kunnen ontstaan.
Bevinding 12: De koppen in de PDF "Jonge Honden" zijn niet geplaatst in tags voor koppen maar in p-tags, bijvoorbeeld de kop 'Sociale innovatie'. Zorg ervoor dat koppen in een tag voor koppen (<H1>, <H2>, etc.) staan.
Bevinding 13: In de PDF "Jonge Honden" staat de referentie '... kantoor*'. De referentie is niet opgemaakt in een Reference-tag, ook is de voetnoot waar de referentie niet naar verwijst niet opgemaakt in een Note-tag. Zorg ervoor dat deze elementen zijn opgemaakt in de juiste tags.
Bevinding 14: Advies:
Op pagina www.workplaceinnovation.org/kennis/shaping-industry-4-0/ ontbreekt een kop 1 (H1-element). Het is geen eis om een h1-element op een pagina te hebben maar het helpt verschillende mensen met navigeren en geeft aan wat het onderwerp van de pagina is. Voeg daarom een H1-element toe met daarin het onderwerp van de pagina, gebruik bijvoorbeeld de paginatitel.
1.4 Onderscheidbaar
1.4.3 Contrast (minimum) (Niveau AA)
Informatie over succescriterium 1.4.3 Contrast (minimum)
Uitkomst: Onvoldoende
Bevinding 15: Het contrast van de witte tekst op de groene achtergrond (#a9efdf) op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is hier 1,3:1, waar dit minimaal 4,5:1 moet zijn.
Dit probleem komt ook voor op pagina's www.workplaceinnovation.org/.
Bevinding 16: Het contrast van de placeholdertekst (#9e9e9e) in het zoekveld op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is hier 2,6:1, waar dit minimaal 4,5:1 moet zijn.
Dit probleem komt ook voor op pagina www.workplaceinnovation.org/.
Bevinding 17: Het contrast van de witte tekst op de bruine achtergrond (#ce7c57) in de footer op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is hier 3,1:1, waar dit minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt voor op alle geteste pagina's, bijvoorbeeld op www.workplaceinnovation.org/.
Bevinding 18: Het contrast van de links in de footer (#8eefd6) op de bruine achtergrond (#ce7c57) op pagina www.kennisbanksocialeinnovatie.nl/ is te laag als je er met je muis overheen gaat (hover). De contrastverhouding is hier 2,3:1, waar dit minimaal 3:1 moet zijn.
Dit contrastprobleem komt voor op alle geteste pagina's, bijvoorbeeld op www.workplaceinnovation.org/.
Bevinding 19: Het contrast van de oranje tekst '1' (#ff9213) op de witte achtergrond op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is 2,2:1, waar dit minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt ook voor op pagina www.workplaceinnovation.org/.
Bevinding 20: Het contrast van de witte tekst 'Download paper' op de blauwe achtergrond (#576ef7) op pagina www.kennisbanksocialeinnovatie.nl/kennis/anders-inclusie-… is te laag. De contrastverhouding is hier 4,2:1, waar dit minimaal 4,5:1 moet zijn.
Dit contrastprobleem komt voor op meerdere pagina’s, bijvoorbeeld op www.workplaceinnovation.org/kennis/shaping-industry-4-0/ en op www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-….
Bevinding 21: Het contrast van de blauwe koppen (#576ef7) op de witte achtergrond op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is hier 4,2:1, waar dit minimaal 4,5:1 moet zijn. Sommige links op deze pagina krijgen ook dezelfde blauwe kleur wanneer je met de muis erover heen gaat, deze links hebben dan ook een te laag contrast.
Dit contrastprobleem komt ook voor op andere pagina's, zoals op www.workplaceinnovation.org/.
Bevinding 22: In de PDF "Anders inclusief ondernemen" staat witte tekst op een blauwe achtergrond (#0094ab) en blauwe tekst op een witte achtergrond. Het contrast van de kleurencombinatie is te laag. De contrastverhouding is hier 3,6:1, waar dit minimaal 4,5:1 moet zijn.
In de PDF komen meer kleurencombinaties met een te laag contrast voor:
- Witte tekst op een rode achtergrond (#e9423b) met een contrastverhouding van 3,9:1.
- Witte tekst op een oranje achtergrond (#f09e02) met een contrastverhouding van 2,1:1.
- Grijze tekst (#898888) op een witte achtergrond met een contrastverhouding van 3,5:1.
- Grijze tekst (#898888) op een lichtgrijze achtergrond (#dad8d8) met een contrastverhouding van 2,4:1.
- Oranje tekst (#f09e02) op een lichtoranje achtergrond (#fcf3e4) met een contrastverhouding van 1,9:1.
- Blauwe tekst (#0094ab) op een lichtblauwe achtergrond (#e1edf1) met een contrastverhouding van 3:1.
- Rode tekst (#fbede8) op een lichtrode achtergrond (#dc3f38) met een contrastverhouding van 3,8:1.
1.4.11 Contrast van niet-tekstuele content (Niveau AA)
Informatie over succescriterium 1.4.11 Contrast van niet-tekstuele content
Uitkomst: Onvoldoende
Bevinding 23: Het contrast van witte pijltjes op de lichtblauwe achtergrond (#d9ebf9) in de paginering op pagina www.kennisbanksocialeinnovatie.nl/ is te laag. De contrastverhouding is 1,2:1, waar dit minimaal 3:1 moet zijn.
Dezelfde links staan ook op pagina www.workplaceinnovation.org/.
Bevinding 24: Het contrast van de selectievakjes wanneer deze zijn aangevinkt (#e28966) op de witte achtergrond op pagina www.workplaceinnovation.org/ is te laag. De contrastverhouding is hier 2,5:1, waar het minimaal 3:1 moet zijn.
Dit contrastprobleem komt ook voor op pagina www.kennisbanksocialeinnovatie.nl/.
2. Bedienbaar
2.1 Toetsenbordtoegankelijk
2.1.4 Enkel teken sneltoets (Niveau A)
Informatie over succescriterium 2.1.4 Enkel teken sneltoets
Uitkomst: Onvoldoende
Bevinding 25: Op de pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-… wordt gebruik gemaakt van de videospeler van YouTube. Deze videospeler maakt gebruik van bediening door enkele tekentoetsen, bijvoorbeeld f voor fullscreen. Deze functionaliteit is iets wat mensen die afhankelijk zijn van spraaksoftware in de weg kan staan. Deze mensen zijn juist afhankelijk van die korte commando's om met spraaksoftware hun computer te bedienen. Los dit op door de embedcode van de YouTube video aan te passen zodat de bediening met tekentoetsen uit staat. De eigenschap die toegevoegd moet worden aan de embedcode is 'disablekb=1'. Met deze aanpassing zorg je ervoor dat je voldoet aan dit succescriterium.
Dit probleem komt ook voor bij de video op pagina www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-….
2.2 Genoeg tijd
2.2.2 Pauzeren, stoppen, verbergen (Niveau A)
Informatie over succescriterium 2.2.2 Pauzeren, stoppen, verbergen
Uitkomst: Onvoldoende
Bevinding 26: Op pagina www.kennisbanksocialeinnovatie.nl/ staat naast 'Recent toegevoegd' bewegende content. Door de bewegende content, hebben sommige bezoekers moeite met het lezen en bekijken van de stilstaande content. Zorg ervoor dat bezoekers de bewegende content kunnen stoppen of pauzeren, of verwijder de bewegende content.
Dit komt ook voor op pagina www.workplaceinnovation.org/ .
2.4 Navigeerbaar
2.4.2 Paginatitel (Niveau A)
Informatie over succescriterium 2.4.2 Paginatitel
Uitkomst: Onvoldoende
Bevinding 27: De PDF "Anders inclusief ondernemen" heeft geen titel in de eigenschappen. Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond.
Bevinding 28: De PDF "Jonge Honden" heeft geen titel in de eigenschappen. Zorg voor een titel die de inhoud van het document beschrijft en dat niet de bestandsnaam maar de titel van het document wordt getoond.
2.4.4 Linkdoel (in context) (Niveau A)
Informatie over succescriterium 2.4.4 Linkdoel (in context)
Uitkomst: Onvoldoende
Bevinding 29: Onderstaande bevindingen zijn waarschijnlijk technisch van aard, maar hebben invloed op hoe sommige bezoekers de content van de website ervaren:
Bevinding 30: Op pagina www.kennisbanksocialeinnovatie.nl/kennis/anders-inclusie-… staan drie social media iconen die als links dienen. Visueel is het linkdoel van deze links duidelijk maar de links hebben geen toegankelijke naam met linkdoel. Hierdoor weten screenreadergebruikers niet waar de links naar verwijzen. Zorg dat de links een toegankelijke naam met linkdoel krijgen.
Bevinding 31: Advies: Op de pagina www.kennisbanksocialeinnovatie.nl/ zijn zowel de afbeelding, kop en tekst van elke zoekresultaat opgemaakt in a-element. Hierdoor is de toegankelijke naam van deze link moeilijk te begrijpen voor screenreadergebruikers. Wij raden aan om het a-element alleen op de kop te plaatsen en het klikgebied met Javascript te vergroten. Zo krijgt de link een goede toegankelijke naam die het linkdoel duidelijk aangeeft.
Dit probleem komt ook voor op pagina www.workplaceinnovation.org/.
3. Begrijpelijk
3.1 Leesbaar
3.1.1 Taal van de pagina (Niveau A)
Informatie over succescriterium 3.1.1 Taal van de pagina
Uitkomst: Onvoldoende
Bevinding 32: Op pagina www.kennisbanksocialeinnovatie.nl/ is de taalaanduiding van de hele pagina Engels. De pagina is echter in het Nederlands. Zorg voor de juiste taalcodering in de HTML. Wanneer de taalkaanduiding van de pagina is aanpast hebben de Engelse teksten op de pagina een Engelse taalaanduiding nodig en moeten de alternatieve teksten van elementen worden vertaalt naar het Nederlands.
Dit probleem komt voor op alle geteste pagina's van de URL www.kennisbanksocialeinnovatie.nl/.
Bevinding 33: In de eigenschappen van PDF "Anders inclusief ondernemen" is de taal niet goed ingevuld. Deze staat op Engels in plaats van Nederlands. Zorg ervoor dat de taalinstelling overeenkomt met de taal die gebruikt wordt in de PDF.
4. Robuust
4.1 Compatibel
4.1.2 Naam, rol, waarde (Niveau A)
Informatie over succescriterium 4.1.2 Naam, rol, waarde
Uitkomst: Onvoldoende
Bevinding 34: Onderstaande bevinding zijn waarschijnlijk technisch van aard, maar hebben invloed op hoe sommige bezoekers de content van de website ervaren:
Bevinding 35: Op pagina www.kennisbanksocialeinnovatie.nl/ staan meerdere knoppen met het label 'Toon meer'. Deze knoppen zijn niet opgemaakt als knop maar staan in een p-element. Hierdoor lezen screenreaders dit als platte tekst voor en weten screenreadergebruikers niet dat hier een knop staat. Los dit probleem op door bijvoorbeeld native HTML te gebruiken bij het opmaken van deze knop of gebruik het role-attribuut.
Dit probleem komt ook voor op pagina www.workplaceinnovation.org/.
Deze bevinding is waarschijnlijk technisch van aard maar heeft invloed op hoe sommige bezoekers de content van de website ervaren.
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
- Home:
https://www.kennisbanksocialeinnovatie.nl/ - Contact:
https://www.kennisbanksocialeinnovatie.nl/contact/ - Zoekfunctie:
https://www.kennisbanksocialeinnovatie.nl/?s=%20innovatie - Over ons:
https://www.kennisbanksocialeinnovatie.nl/over-ons/ - Artikel Anders inclusief ondernemen:
https://www.kennisbanksocialeinnovatie.nl/kennis/anders-inclusie-ondernemen/ - PDF:
https://wp.kennisbanksocialeinnovatie.nl/wp-content/uploads/2021/12/Anders-inclusief-ondernemen-2021.pdf - PDF:
https://wp.kennisbanksocialeinnovatie.nl/wp-content/uploads/2021/05/JongeHonden2021_versie2.pdf - Artikel Jonge honden:
https://www.kennisbanksocialeinnovatie.nl/kennis/jonge-honden/ - Video:
https://www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-bij-advies-en-ingenieursbureau-movares/ - Home Engels:
https://www.workplaceinnovation.org/ - Zoekresultaten Engels:
https://www.workplaceinnovation.org/?s=%20&post_type%5B0%5D=kennis - Artikel Engels:
https://www.workplaceinnovation.org/kennis/moneypenny-shaping-the-future-of-work/ - Sociale innovatie bij Villeroy & Boch:
https://www.kennisbanksocialeinnovatie.nl/kennis/sociale-innovatie-bij-villeroy-boch/ - Shaping Industry 4.0:
https://www.workplaceinnovation.org/kennis/shaping-industry-4-0/
Ondersteunende technieken
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.