WCAG Radar: 45 toegankelijkheidschecks in je eigen browser
WCAG Radar is gratis gereedschap van auditbureau Proper Access: 28 van de 45 WCAG-checks op de pagina die je open hebt staan, ook achter een login en op localhost. Snap je een bevinding niet, dan zit er bij elke check een link naar een auditor.
Daar beheer je je licentie, deel je plekken uit aan collega's en stel je je vraag aan een auditor.
- draait lokaal
- geen account
- werkt op localhost
- verstuurt niets
Installeer de Radar
- WCAG Radar
Sleep hem naar je bladwijzerbalk
- Installeren voor Chrome (opent in een nieuw tabblad)
Ook Edge, Brave en Vivaldi
- Installeren voor Firefox (opent in een nieuw tabblad)
Windows, macOS en Linux
Safari
Ingediend bij Apple, in beoordeling
Klik hem niet aan, sleep hem. Zie je je bladwijzerbalk niet? Druk op CtrlShiftB op Windows, of ⌘⇧B op Mac. Daarna klik je hem aan op elke pagina die je wilt testen.
Vier manieren om de Radar te installeren
Alle vier draaien dezelfde checks en dragen hetzelfde versienummer. De bookmarklet installeert niets en werkt daardoor ook op een computer waar je niets mag installeren. De drie extensies zetten een knop naast je adresbalk en werken ook op sites die een bookmarklet blokkeren, zoals Google Docs. Je mag ze naast elkaar installeren.
Bookmarklet
Bladwijzerbalk
- installeert niets, dus ook goed op een werkcomputer waar dat niet mag
- werkt op de computer van iemand anders, bijvoorbeeld tijdens een workshop
- een site met een strenge Content Security Policy blokkeert hem; neem daar een extensie
WCAG RadarSleep hem naar je bladwijzerbalk. Aanklikken werkt hier niet.
Chrome
Chrome Web Store
- werkt ook in Edge, Brave en Vivaldi
- Windows, macOS en Linux
- de browser werkt hem zelf bij
Firefox
Firefox Add-ons
- Windows, macOS en Linux
- de browser werkt hem zelf bij
Safari
App Store
- alleen macOS
- zonder de betaalde checks: Apple eist In-App Purchase voor betaalde functies, en dan kunnen we een organisatie geen factuur meer sturen
Ingediend bij Apple en in beoordeling. Zodra hij goedgekeurd is, staat de knop hier.
De winkels lopen soms een versie achter: Chrome, Firefox en Apple beoordelen elke nieuwe versie eerst. De bookmarklet haalt zijn bundle bij ons op en is dus altijd bij.
Kom je er niet uit? Vraag het aan een auditor.
Onder elke check in het paneel staat een link naar een expert. Je komt uit in het auditportaal van Proper Access, met het tabblad, het thema, de check en de pagina waar je op zat al ingevuld. Daar antwoordt de auditor die de checks ook geschreven heeft.
- Eén strip is één vraag over één onderwerp. Vervolgvragen in datzelfde gesprek kosten niets extra.
- Je krijgt binnen 3 tot 5 werkdagen antwoord.
- De strip gaat er pas af als wij antwoorden. Valt je vraag buiten wat wij kunnen beantwoorden, dan kost hij niets.
- Je hebt er geen licentie voor nodig. Iedereen kan strippen kopen, ook zonder audit bij ons.
Een vraag kost een strip. Hoe je strippen koopt, zie je in het portaal.
Stel je vraag in het portaal (opent in een nieuw tabblad)Je logt in met je eigen e-mailadres.
Eén tool. Je licentie bepaalt hoeveel checks draaien.
Alle 45 checks zitten erin. Zonder licentie draaien er 28, verdeeld over alle drie de tabbladen. Die 28 blijven gratis, ook als er later checks bij komen. Checks met Pro erachter blijven zichtbaar, zodat je ziet wat er nog meer is. In de extensie voer je je sleutel één keer in bij de opties; je krijgt hem per mail van degene die de licentie beheert.
Bekijk de prijzen28/ 45
checks gratis, zonder account
gratismet licentie
Elke maand komen er checks bij. Alles wat erbij komt zit in de licentie.
Bookmarklet met alle checks
Plak je licentiesleutel, dan zetten we hier een bookmarklet voor je klaar waarin alle checks aanstaan. Handig op een werkplek waar je geen extensies mag installeren.
Je sleutel gaat hier nergens heen: hij wordt in je eigen browser in de bookmarklet gezet. Trek je de plek later in en krijg je een nieuwe sleutel, dan sleep je de knop opnieuw.
Eén tool, drie tabbladen
Bovenin het paneel wissel je tussen Redactie, Designer en Developer. Elk tabblad heeft zijn eigen set checks, afgestemd op wat jij doet.
Redactie: wat WCAG Radar laat zien
Alt-teksten, koppen, linkteksten, tabellen en taal. En “Opmaak uit”: alle vormgeving weg, zodat je je eigen pagina leest in de volgorde waarin voorleessoftware hem doorloopt.
- Paginatitel
- WCAG Radar toont de titel van de pagina. Een duidelijke, unieke titel helpt bezoekers om tabbladen en zoekresultaten uit elkaar te houden.
- Opmaak uit (leesvolgorde)
- Met één klik zet je alle opmaak uit: geen kleuren, geen kolommen, geen plaatjes op hun plek. Je houdt de kale tekst over, in de volgorde waarin voorleessoftware hem doorloopt. Lees hem zo eens door. Loopt je verhaal nog, of staat de uitleg ineens vóór de vraag?
- Leesvolgorde (overzicht) Pro
- De pagina als klikbare lijst, precies zoals voorleessoftware hem doorloopt: de koppen, de links, de knoppen en de invoervelden, in de volgorde waarin ze in de pagina staan. Lees die lijst van boven naar beneden. Snap je zo waar de pagina over gaat en wat je er kunt doen? Klik op een regel om naar dat stuk op de pagina te springen.
- Verborgen onderdelen tonen Pro
- Sommige stukken staan wel in de pagina, maar zie je niet. Vaak klopt dat, bijvoorbeeld een menu dat pas opengaat als je erop klikt. Soms is het per ongeluk, en dan leest voorleessoftware iets voor dat er niet meer hoort te staan, of twee keer hetzelfde. WCAG Radar maakt die verborgen stukken zichtbaar en zet erbij op welke manier ze verstopt zijn. Kijk of er iets tussen staat dat allang weg had gemoeten.
- Koppen en structuur
- WCAG Radar tekent alle koppen met hun niveau en waarschuwt als je een niveau overslaat. Een logische koppenstructuur helpt iedereen die de pagina scant of hem laat voorlezen.
- Kwaliteit van kopteksten Pro
- WCAG Radar markeert lege koppen en koppen met een nietszeggende tekst zoals “Ga naar” of “Lees meer”. Wie op koppen navigeert, moet aan de koptekst kunnen zien waar de sectie over gaat.
- Verwijzingen naar plek, kleur of vorm
- WCAG Radar markeert verwijzingen naar positie, kleur of vorm, zoals “links”, “rechtsboven” of “de rode knop”, ook in alt-teksten. Wie de pagina niet ziet, heeft daar niets aan. Controleer of je de instructie ook zonder die verwijzing kunt begrijpen.
- Regeleinden als opmaak Pro
- Twee lege regels achter elkaar zien eruit als ruimte tussen twee alinea's. Voor voorleessoftware is het één lange alinea: je kunt er niet per alinea doorheen springen en de korte pauze tussen alinea's valt weg. Regels die met een streepje of een bolletje beginnen zijn een nagemaakte lijst, en tellen dus niet als lijst. WCAG Radar markeert allebei. Losse regeleinden, zoals in een adres of een gedicht, laat hij met rust.
- Sterke nadruk (strong) Pro
- WCAG Radar markeert elk stukje tekst met sterke nadruk, het strong-element. Sterke nadruk betekent: dit is belangrijk. Het is niet bedoeld om letters dikker te maken, dat is een kwestie van vormgeving. Staat er een hele zin of een hele alinea in, dan ligt de nadruk op alles en dus op niets; die krijgen een markering. Gebruik nadruk voor het woord of de paar woorden waar het echt om draait.
- Nadruk (em) Pro
- WCAG Radar markeert elk stukje tekst met nadruk, het em-element. Nadruk legt de klemtoon op een woord, zoals je dat in een gesprek met je stem doet. Het is niet bedoeld om letters schuin te zetten, dat is vormgeving. Een hele zin of een hele alinea met nadruk wordt gemarkeerd, want dan hoor je niet meer waar de klemtoon ligt.
- Lijststructuur
- WCAG Radar markeert echte lijsten, zodat je ziet of opsommingen ook echt als lijst zijn opgemaakt en niet als losse regels met streepjes.
- Afbeeldingen en alt-tekst
- Bij elke afbeelding hoort een alt-tekst: de tekst die iemand hoort of leest in plaats van het plaatje. WCAG Radar laat per afbeelding zien wat er staat. Er zijn drie mogelijkheden: er staat een alt-tekst, de alt-tekst is met opzet leeg omdat het plaatje alleen versiering is, of er staat helemaal niets. Dat laatste is een fout. Je krijgt ook een waarschuwing als je alt-tekst begint met “afbeelding van”; dat hoeft niet, want voorleessoftware zegt zelf al dat het een afbeelding is. Wat er precies moet staan bepaal jij: alleen jij weet of het plaatje iets vertelt of alleen mooi staat. Tekeningen die in de pagina zelf zitten (svg) doen ook mee.
- Klikbare afbeeldingen
- Soms is een afbeelding zelf een link of een knop, bijvoorbeeld een logo waarmee je naar de homepage gaat. Dan hoort er een naam bij die zegt waar je terechtkomt of wat er gebeurt, niet hoe het plaatje eruitziet. Dus “Naar de homepage” en niet “blauw rond logo”. WCAG Radar toont die naam bij elke klikbare afbeelding en markeert het rood als er geen naam is.
- Afbeeldingen uit
- Alle beeld wordt vaag gemaakt: foto's, tekeningen, video's en achtergrondplaatjes. Op de plek waar ze stonden blijft een gekleurde stippellijn staan, zodat je ziet wat je mist. Lees de pagina nu opnieuw. Snap je het verhaal nog zonder beeld? Zo niet, dan staat er informatie in het plaatje die ook in de tekst hoort. Let op: een logo is vaak een tekening in de pagina zelf, dus die vervaagt mee.
- Tabellen Pro
- WCAG Radar markeert tabellen zonder kopcellen of bijschrift. Kopcellen vertellen voorleessoftware welke rij of kolom bij een cel hoort, zodat een bezoeker een tabel kan volgen.
- Namen van links en knoppen
- Elke link, knop en elk invoerveld heeft een naam die voorleessoftware hardop noemt. Meestal is dat gewoon de tekst die je ziet, maar niet altijd: bij een knop met alleen een pictogram, bijvoorbeeld een vergrootglas, zit de naam in de code. WCAG Radar zet bij elk element die naam in beeld. Zo zie je of iemand die de pagina niet ziet dezelfde informatie krijgt als jij. Links, knoppen en velden zonder naam worden rood gemarkeerd.
- Linkteksten
- WCAG Radar markeert vage links zoals “lees meer” en links zonder tekst. Een goede linktekst vertelt op zichzelf waar je terechtkomt.
- Alle links Pro
- Alle links op de pagina in één lijst in het paneel, zoals voorleessoftware ze voorleest: alleen de linktekst, zonder context eromheen. Lege en vage teksten springen eruit. Klik op een regel om naar de link op de pagina te springen.
- Titels bij ingesloten video's en kaarten Pro
- Een video van YouTube of een kaart van Google staat in een kadertje dat van een andere website komt. Zo'n kader hoort een titel te hebben, zodat iemand die de pagina laat voorlezen weet wat erin zit. Zonder titel hoort die persoon alleen dat er “een kader” staat. WCAG Radar markeert de kaders zonder titel.
- Pagina in grijstinten
- Met één klik wordt de pagina grijs. Zo controleer je of informatie zoals links of foutmeldingen ook zonder kleur te herkennen is.
- Tekstcontrast
- Tekst moet genoeg verschillen van de achtergrond, anders is hij niet te lezen voor wie minder scherp ziet of buiten in de zon op een scherm kijkt. WCAG Radar markeert vanzelf de tekst die te weinig verschilt van een effen achtergrond. Staat de tekst op een foto of op een kleurverloop, dan meet je zelf: klik eerst de kleur van de letters aan en daarna de kleur van de achtergrond. Je ziet meteen of het genoeg is. Voor grote tekst geldt een lagere eis dan voor kleine tekst; dat rekent de Radar voor je uit.
- Contrast van invoervelden en focus
- Dit gaat niet over tekst, maar over de dingen eromheen: de rand van een invoerveld, en het kadertje dat verschijnt als je met de Tab-toets door de pagina loopt. Ook die moeten genoeg verschillen van de achtergrond, anders zie je niet waar je moet typen of waar je bent. WCAG Radar loopt de pagina langs en meldt het als het verschil te klein is, of als er helemaal geen kadertje verschijnt. Oplossen doet meestal de vormgever of de developer, maar het is goed om te weten dat het speelt.
- Taal van de pagina
- Je ziet of de paginataal is ingesteld en welke onderdelen een andere taal hebben. De juiste taal zorgt dat voorleessoftware de woorden goed uitspreekt.
- Automatisch invullen van gegevens Pro
- Een browser kan velden zoals naam, adres en e-mailadres vanzelf invullen met gegevens die de bezoeker eerder heeft bewaard. Daarvoor moet in de code staan wat voor gegeven er in het veld hoort. Staat dat er, dan scheelt dat typwerk, en dat helpt vooral mensen die moeilijk typen of die dingen snel vergeten. WCAG Radar laat per veld zien of het er staat en waarschuwt als het ontbreekt. Aanpassen doet een developer.
- Labels bij invoervelden
- Bij elk invoerveld hoort een label: het woord ernaast dat vertelt wat je moet invullen, zoals “E-mailadres”. Voorleessoftware noemt dat label zodra iemand in het veld komt. Ontbreekt het, dan hoort die persoon alleen “invoerveld” en weet hij niet wat er moet komen. WCAG Radar markeert die velden rood. Let ook op velden waar de tekst alleen ín het veld staat, als lichtgrijs voorbeeld: die tekst verdwijnt zodra je begint te typen, dus je kunt niet meer nalezen wat er ook alweer gevraagd werd. Die krijgen een waarschuwing. Zichtbare tekst naast een veld telt trouwens niet vanzelf mee; die moet in de code aan het veld vastzitten. Ziet het er dus goed uit maar staat er toch een markering, geef het dan door aan een developer.
- Foutmeldingen bij formuliervelden
- Vul een formulier eerst verkeerd in en klik op verzenden. WCAG Radar markeert daarna elke foutmelding die op de pagina verschijnt en zet ze op een rij, zodat je ze naast elkaar kunt lezen. Jij beoordeelt de tekst: staat er wat er misgaat en wat de bezoeker moet doen, of alleen “ongeldige invoer” of een foutcode? Zet in de melding waar het over gaat, bijvoorbeeld “Je postcode heeft vier cijfers en twee letters, zoals 1234 AB” in plaats van “Formaat onjuist”. Meldingen die niet aan hun veld gekoppeld zijn krijgen een rode markering: die krijgt iemand die de pagina laat voorlezen niet te horen, hoe goed je tekst ook is. Dat oplossen is werk voor een developer, maar geef het wel door.
Designer: wat WCAG Radar laat zien
Contrast meten, kleur wegnemen, focus zichtbaar maken, doelen kleiner dan 24 bij 24 pixels aanwijzen, en kijken wat er misgaat bij 200 procent tekst.
- Tekstcontrast
- WCAG Radar markeert automatisch tekst op een effen achtergrond die te weinig contrast heeft. Voor tekst op een foto of gradient meet je zelf twee kleuren met de twee pipetten. Je ziet meteen de contrastverhouding en of die voldoet aan de eis voor normale en grote tekst. Een glyph uit een icoonfont is een tekening, geen tekst: die meet de Radar apart tegen de eis van 3:1.
- Contrast van randen en focus
- Meet het contrast van de randen van invoervelden en van de focusstijl (WCAG 1.4.11). WCAG Radar zet daarvoor kort focus op elk element en waarschuwt onder 3:1, of als een zichtbare focusstijl helemaal ontbreekt.
- Links alleen in kleur
- Vindt links in lopende tekst die alleen door kleur van de tekst te onderscheiden zijn (geen onderstreping) en toont het kleurverschil met de omringende tekst. Onderstrepen is de veiligste oplossing.
- Grijswaarden (kleurblind-check)
- Met één klik wordt de pagina grijs. Zo controleer je of informatie zoals links of foutmeldingen ook zonder kleur te herkennen is.
- Donkere modus Pro
- Past de donkere modus van de site geforceerd toe (de prefers-color-scheme: dark-stijlen), zodat je contrast en leesbaarheid in dark mode kunt controleren. Heeft de site geen dark-mode-stijlen, dan zegt de Radar dat gewoon.
- Focus zichtbaar maken
- WCAG Radar forceert een duidelijke focusrand. Tab door je ontwerp om te zien of elke interactieve laag een zichtbare focus heeft.
- Doelgrootte (24px) Pro
- Elk klikbaar element toont zijn afmetingen; elementen kleiner dan 24 bij 24 pixels krijgen een oranje markering. Let op: een klein doel kan toch voldoen, bijvoorbeeld een link midden in een tekst of een doel met genoeg ruimte eromheen. Gebruik de markering als startpunt om te controleren.
- Gebaren en muis-only bediening Pro
- Markeert elementen die alleen met de muis of aanraking te bedienen zijn: script-klikbare elementen zonder toetsenbordfocus, drag-en-drop zonder duidelijk alternatief en nep-knoppen met alleen een muiscursor.
- Alleen tekst vergroten (200%)
- WCAG Radar zet alle tekst op 200% en laat de viewport even breed staan, zoals de instelling “Alleen tekst zoomen” in Firefox en de lettergrootte-instelling van het besturingssysteem. Kijk of er tekst wegvalt, overlapt of buiten beeld raakt en of alles nog te bedienen is.
- Pagina-zoom 200%
- Toont de pagina zoals iemand hem ziet die zijn browser op 200% zet. In een venster van normale grootte staat een kader van de halve breedte, twee keer zo groot geschaald. Daarin gelden dezelfde mediaquery's en dezelfde reflow als bij echte browserzoom, en de tekst heeft ook echt het formaat dat je bezoeker krijgt. Je hoeft zelf niets te zoomen, dus de Radar blijft staan waar hij staat.
- Zoom geblokkeerd in de code Pro
- Leest de viewport-metatag van de pagina. Staat daar user-scalable=no of een maximum-scale onder de 2, dan kan een bezoeker op zijn telefoon niet naar 200 procent inzoomen (WCAG 1.4.4). De check zegt welke waarde het blokkeert; die mag weg, de tag zelf mag blijven.
- Tekstafstand (1.4.12)
- WCAG Radar past de WCAG-tekstafstanden toe. Kijk of er tekst wegvalt, overlapt of wordt afgekapt als een bezoeker meer ruimte tussen letters en regels instelt.
- Reflow (320 px)
- Controleert op horizontale scroll op paginaniveau, markeert de elementen die buiten beeld steken en opent de pagina in een venster van 320 pixels breed (WCAG 1.4.10).
- Afbeeldingen uit
- Afbeeldingen worden vervaagd. Kijk of je ontwerp zonder beeld nog te begrijpen is en of de tekst het verhaal alleen kan dragen.
- Automatische beweging Pro
- Vindt beweging die vanzelf start en langer dan 5 seconden duurt: CSS-animaties, autoplay-video's en marquees. WCAG Radar kijkt ook 5 seconden mee naar scriptgestuurde beweging zoals carrousels en tickers.
- Liniaal en hulplijnen
- Een horizontale en verticale hulplijn volgen je muis en tonen de x- en y-positie in pixels, zodat je uitlijning en afstanden nauwkeurig kunt nalopen.
Developer: wat WCAG Radar laat zien
ARIA, toegankelijke namen, tabvolgorde en iframes.
- Element-info bij hover
- Beweeg met de muis over de pagina en krijg per element een kaartje met wat hulpsoftware ervan maakt: de toegankelijke naam en waar die vandaan komt, de rol, het kopniveau, of je er met Tab kunt komen, de toestand zoals verborgen, uitgeschakeld of verplicht, en waar de achtergrond betrouwbaar te meten is het tekstcontrast met de kleurstalen erbij. Classes en id's laat de kaart bewust weg: die zeggen niets over toegankelijkheid en duwen de regels die er wel toe doen uit beeld. Werkt ook in ingesloten kaders van hetzelfde domein; kaders van andere domeinen zijn technisch niet bereikbaar.
- Toon toegankelijke naam
- Elk interactief element (links, knoppen, formuliervelden) toont zijn toegankelijke naam: de naam die een screenreader voorleest. Elementen zonder naam worden als fout gemarkeerd.
- ARIA-rollen en -attributen
- WCAG Radar toont alle rollen en aria-attributen en markeert vier soorten fouten: gebroken referenties naar id's die niet bestaan, onbekende rollen (typfouten), rollen zonder verplicht attribuut (zoals checkbox zonder aria-checked) en aria-hidden op focusbare inhoud. Onder de uitkomst staan links naar de ARIA-referentie, om op te zoeken wat een rol verlangt, en naar de quiz voor developers.
- Iframes (titel)
- Iframes zonder title of aria-label springen eruit. Een titel is nodig zodat een screenreadergebruiker weet wat er in het kader zit.
- Autocomplete bij persoonlijke gegevens Pro
- Velden die om persoonlijke gegevens vragen horen een autocomplete-attribuut met een geldige waarde te hebben (WCAG 1.3.5). WCAG Radar toont de waarde per veld en waarschuwt bij ontbrekende of onbekende waarden.
- Groepen en zichtbare labels
- Fieldsets zonder legend en groepen (role=group) zonder naam worden als fout gemarkeerd. Daarnaast zie je welke velden alleen een aria-label hebben en dus geen zichtbaar label. Dat mag soms, bijvoorbeeld een vergrootglas-icoon bij een zoekveld, maar meestal hoort er zichtbare tekst bij.
- Toegankelijke naam bij formuliervelden
- WCAG Radar markeert invoervelden zonder toegankelijke naam en velden die alleen een placeholder hebben. Zichtbare tekst naast een veld telt alleen als hij via <label for>, aria-label of aria-labelledby aan het veld is gekoppeld.
- Verplichte velden
- Toont welke velden als verplicht zijn gemarkeerd voor hulpsoftware (required of aria-required) en waarschuwt bij velden met een sterretje of 'verplicht' in het label die deze markering missen.
- Foutmeldingen bij formuliervelden
- WCAG Radar zoekt zichtbare foutmeldingen op vier manieren: role=alert of aria-live, een class of id als error/invalid, een veld dat er zelf naar wijst (aria-errormessage, of aria-describedby bij een veld op aria-invalid="true"), en rode tekst vlak bij een invoerveld. Die laatste manier vangt sites waarvan het framework genummerde klassen uitspuugt en helemaal geen ARIA gebruikt; de samenvatting vertelt hoeveel meldingen alleen aan de kleur herkend zijn. Ongekoppelde meldingen zijn een fout: een screenreader kondigt ze niet aan. Gekoppelde meldingen zonder aria-invalid="true" op het veld krijgen een waarschuwing, en een veld dat wél op aria-invalid="true" staat zonder gekoppelde melding krijgt een fout.
- Plakken geblokkeerd Pro
- WCAG Radar markeert elementen die plakken, kopiëren of slepen blokkeren via inline code (onpaste, oncopy, oncut, ondrop). Geblokkeerd plakken dwingt overtypen af en is een drempel, bijvoorbeeld bij wachtwoorden en e-mailbevestigingen. Blokkades via scripts kan de Radar niet zien; test het plakken ook zelf.
- Focus zichtbaar maken
- WCAG Radar forceert een duidelijke focusrand op elk element. Tab door de pagina om te zien of de focus altijd zichtbaar is en logisch verspringt.
- Tabvolgorde Pro
- Elk focusbaar element krijgt een nummer in de volgorde waarin je er met Tab doorheen gaat. Positieve tabindex-waarden springen vóór de rest en worden als fout gemarkeerd, want die verstoren de logische toetsenbordvolgorde.
- Doelgrootte (24px) Pro
- Elk klikbaar element toont zijn afmetingen; elementen kleiner dan 24 bij 24 pixels krijgen een oranje markering. Een klein doel kan toch voldoen, bijvoorbeeld een link midden in een tekst.
- Gebaren en muis-only bediening Pro
- Markeert elementen die alleen met de muis of aanraking te bedienen zijn: script-klikbare elementen zonder toetsenbordfocus, drag-en-drop zonder duidelijk alternatief en nep-knoppen met alleen een muiscursor.
- Alleen tekst vergroten (200%)
- WCAG Radar zet alle tekst op 200% en laat de viewport even breed staan, zoals de instelling “Alleen tekst zoomen” in Firefox en de lettergrootte-instelling van het besturingssysteem. Controleer of er tekst wegvalt, overlapt of buiten beeld raakt en of alles nog te bedienen is.
- Pagina-zoom 200%
- Toont de pagina zoals iemand hem ziet die zijn browser op 200% zet. In een venster van normale grootte staat een kader van de halve breedte, twee keer zo groot geschaald. Daarin gelden dezelfde mediaquery's en dezelfde reflow als bij echte browserzoom, en de tekst heeft ook echt het formaat dat je bezoeker krijgt. Je hoeft zelf niets te zoomen, dus de Radar blijft staan waar hij staat.
- Zoom geblokkeerd in de code Pro
- Leest de viewport-metatag van de pagina. Staat daar user-scalable=no of een maximum-scale onder de 2, dan kan een bezoeker op zijn telefoon niet naar 200 procent inzoomen (WCAG 1.4.4). De check zegt welke waarde het blokkeert; die mag weg, de tag zelf mag blijven.
- Tekstafstand (1.4.12)
- WCAG Radar past de WCAG-tekstafstanden toe: regelhoogte, letter- en woordafstand en alinea-afstand. Zo zie je meteen of er tekst wegvalt, overlapt of wordt afgekapt.
- Reflow (320 px)
- Controleert op horizontale scroll op paginaniveau, markeert de elementen die buiten beeld steken en opent de pagina in een venster van 320 pixels breed (WCAG 1.4.10).
- Tekstcontrast
- WCAG Radar markeert automatisch tekst op een effen achtergrond die onder 4,5:1 (normale tekst) of 3:1 (grote tekst) zakt. Een teken uit een icoonfont staat wel in een tekstknoop, maar is een tekening: daarvoor geldt 3:1 (niet-tekstuele content) en de samenvatting telt die pictogrammen apart. Voor tekst op een afbeelding of gradient meet je zelf twee kleuren met de twee pipetten.
- Contrast van randen en focus
- Meet het contrast van de randen van invoervelden en van de focusstijl (WCAG 1.4.11). WCAG Radar zet daarvoor kort focus op elk element en waarschuwt onder 3:1, of als een zichtbare focusstijl helemaal ontbreekt.
Waar deze checks op gebaseerd zijn
Elke check meet één of meer succescriteria uit WCAG 2.2 op niveau A en AA. In het paneel staat bij elke check waar hij over gaat en een link naar de uitleg. De norm zelf is openbaar en gratis te lezen, en voor Nederlandse overheden en voor de European Accessibility Act geldt hij via de Europese norm EN 301 549.
Vragen over WCAG Radar
Wat kost WCAG Radar?
28 van de 45 checks zijn gratis en blijven gratis, zonder account en zonder proefperiode. De overige 17 en de rapport-export zitten in een licentie: € 119 per jaar of € 11,95 per maand voor één persoon, exclusief btw. Voor een team geldt een staffel per plek, die goedkoper wordt naarmate je er meer afneemt.
Werkt de Radar achter een login of op localhost?
Ja. Alle checks rekenen in de browser die je al open hebt staan, op de pagina die daar op dat moment in staat. Er is geen server die jouw pagina moet kunnen bereiken, dus een acceptatieomgeving, een testomgeving en localhost werken net zo goed als een live site.
Gaat er iets van mijn pagina naar jullie toe?
Nee. De checks draaien lokaal en het rapport wordt in je eigen browser gemaakt. Wij tellen alleen hoe vaak de bundle per dag opgehaald wordt, zonder IP-adres en zonder cookie. Wat je test blijft bij jou, en dat is ook de reden dat hij achter een login bruikbaar is.
Wat is het verschil tussen WCAG Radar en de scan?
De Radar test één pagina tegelijk, in je eigen browser, en markeert de problemen in de pagina zelf terwijl je eraan werkt. De scan loopt tot 10 pagina's van een openbaar adres na en mailt je een rapport met een score. De Radar is voor tijdens het maken, de scan voor een eerste beeld van een hele site.
In welke browsers werkt hij?
De extensie staat in de Chrome Web Store en bij Firefox Add-ons; een Safari-versie is in voorbereiding. De bookmarklet werkt in elke browser met een bladwijzerbalk, dus ook in Safari en Edge, en is de weg voor wie op zijn werk niets mag installeren.
Vervangt de Radar een handmatige audit?
Nee, en dat is ook niet het idee. Een automatische check vindt 30 tot 40 procent van de problemen op een pagina. De Radar helpt je dat deel zelf op te lossen voordat een auditor ernaar kijkt, zodat een auditrapport over de moeilijke gevallen gaat en niet over knoppen zonder naam.
Wat het kost
De browser-extensie en de bookmarklet blijven gratis, met 28 checks, zonder account en zonder dat er iets verstuurd wordt. Wil je alle 45 checks of een rapport uit je testsessie, dan is er een licentie.
Alle bedragen zijn exclusief btw. Dit is gereedschap dat je voor je werk gebruikt, dus de btw krijg je terug. Koop je als particulier, dan zie je bij het afrekenen de prijs inclusief btw.
Waar we nu staan
28 checks zijn gratis en blijven dat. 17 checks vragen een licentie: je ziet ze wel in het paneel staan, met een link hierheen. Je sleutel invoeren doe je in de extensie; de bookmarklet voor licentiehouders krijg je erbij. Op 4 augustus 2026 hebben we iets rechtgezet dat mis was: de extensie wiste je sleutel zodra onze server één keer nee zei, en dat gebeurde ook als een abonnement een dag te laat verlengd was. Eén administratieve vertraging en iedereen op dat kantoor was zijn sleutel kwijt, zonder herstel, want wij bewaren van een sleutel alleen een afdruk. Nu blijft de sleutel staan en werkt alles vanzelf weer zodra het opgelost is.
Gratis, en dat blijft zo
De browser-extensie voor Chrome, Firefox en straks Safari. Dit deel gaat nooit op slot.
€ 0
- 28 checks voor redactie, ontwerp en code
- Geen account, geen registratie
- Alles rekent in je eigen browser, er wordt niets verstuurd
- Vraagt geen toegang tot de sites die je bezoekt
Persoonlijke licentie
Voor de zelfstandige auditor, ontwikkelaar of redacteur.
€ 119per jaar
€ 11,95 per maand
Maandelijks betalen kost per jaar meer dan in één keer. Twaalf incasso's kosten ons nu eenmaal meer dan één.
- Alle checks in de extensie
- Dezelfde bookmarklet, maar met alle checks erin
- Rapport-export van je testsessie
- Support: werkt iets niet goed, dan passen we de tool aan
- Op je eigen naam, betalen met iDEAL of kaart
Wat er niet bij zit
- Geen factuur op rekening en geen inkoopordernummer
- Geen btw-verlegging
- Geen plekken uitdelen aan collega's
- Niet overdraagbaar aan iemand anders
Organisatie-abonnement
Voor teams. Vanaf twee plekken, je deelt ze zelf uit in het portaal.
vanaf€ 350per jaar
- Alles uit de persoonlijke licentie, voor iedereen met een plek
- Plekken uitdelen en intrekken wanneer je wilt
- Support geldt per plek, dus je collega's kunnen zelf mailen
- Eén factuur per jaar, met inkoopordernummer
- Btw verlegd bij een geldig btw-nummer buiten Nederland
De staffel
Prijs per plek per jaar. Hoe meer plekken, hoe lager het tarief.
| Plekken | Per plek per jaar | Voorbeeld |
|---|---|---|
| 2 tot 4 | € 175 | 3 plekken: € 525 |
| 5 tot 9 | € 150 | 8 plekken: € 1.200 |
| 10 tot 19 | € 130 | 12 plekken: € 1.560 |
| 20 tot 49 | € 110 | 25 plekken: € 2.750 |
| 50 of meer | € 90 | 60 plekken: € 5.400 |
- Je betaalt nooit meer dan het instaptotaal van een hogere trede. Negen plekken kosten daarom hetzelfde als tien.
- Plekken bijkopen kan tussendoor, naar rato van de tijd die nog over is van je jaar. Dat regel je zelf in het portaal.
- Opzeggen kan per verlenging. Minder plekken gaat ook per verlenging.
- Heb je een persoonlijke licentie en wil je collega's toevoegen? Dan gaat wat je nog tegoed hebt van je jaar van de prijs af.
Wat kost het voor jou?
€ 1.200per jaar, exclusief btw
Dat is € 150 per plek.
Wat je met een licentie krijgt
De gratis extensie blijft precies doen wat hij nu doet. Een licentie zet dit erbij open.
- Alle checks
- De extensie geeft 28 checks gratis. Met een licentie krijg je alle 45. En het blijft daar niet bij: de Radar is in actieve ontwikkeling, we bouwen er elke maand checks bij, en elke check die erbij komt zit in de licentie.
- De bookmarklet met alles erin
- Een knop in je bladwijzerbalk die op elke pagina werkt, ook achter een login en op localhost. Bedoeld voor beheerde werkplekken waar IT geen extensies toestaat, wat bij provincies, ministeries en grote retail eerder regel dan uitzondering is. Let op: op sites met een strenge Content Security Policy wordt de bookmarklet juist geblokkeerd en de extensie niet.
- Rapport-export
- Je testsessie als rapport, per element: welke checks je aan had staan, de samenvatting per check, en per bevinding de status, een verwijzing naar het element en de tekst die erin staat. Eén HTML-bestand dat overal opent en te printen is naar PDF, gemaakt in je eigen browser. Het is geen conformiteitsverklaring. Je team kan er wel meteen mee verder.
- Support van de mensen die hem bouwen
- Werkt een check niet goed, geeft hij iets aan dat niet klopt, of mis je iets? Laat het weten, dan passen we de tool aan. Je praat met de auditors die de Radar geschreven hebben. Meldingen van gratis gebruikers lezen we ook, en de Radar is er groot mee geworden. Het verschil met een licentie: je krijgt antwoord, en jouw melding gaat voor.
Workshops
Een dag met je team, met je eigen site erbij. Maximaal twaalf deelnemers. Staat los van de licentie.
€ 1.950 per dag
Een licentie bestellen
Log in met je e-mailadres, vul de gegevens van je organisatie in en kies je licentie. Je betaalt met iDEAL of kaart en krijgt de factuur meteen per mail. Liever op rekening of met een inkooporder? Mail ons, dan regelen we dat.
Wat is er nieuw
v2.32.2 · 18 augustus 2026Onder elke check staat nu een link "Vraag aan expert". Die brengt je naar het auditportaal, waar een auditor van Proper Access je vraag beantwoordt. Het formulier daar is al half ingevuld: het tabblad, het thema, de check, de versie van de Radar en de pagina waar je op zat. Wat er meegaat zie je staan voordat je verstuurt, en er gaat niets weg zonder dat je klikt. Van het adres gaat alleen het pad mee en niet de queryreeks, want daar staan tokens en sessie-id's in. De regel "Bevinding onduidelijk? Laat het een expert checken" is weg: die ging naar de offertepagina en las alsof je hulp kreeg bij die ene bevinding. Onderin, bij de regel over Proper Access, staat nu waar hij over gaat: de hele site laten onderzoeken.
De Radar draait nu op versie 2.32.2, uitgebracht op 18 augustus 2026. Je hoeft niets opnieuw te installeren: de bookmarklet haalt de nieuwste versie zelf op, uiterlijk een uur na een update. Welke versie je draait staat onderin het paneel.
Bekijk alle wijzigingen per versieWCAG Radar vervangt geen audit.
WCAG Radar helpt je de meest voorkomende problemen zelf te vinden en op te lossen. Voor een volledige audit met bevindingen per element, user stories en concrete oplossingen kom je bij Proper Access uit.
Van hier neemt Proper Access het over
Gratis toegankelijkheidsscan
Geef een URL en krijg binnen 90 seconden een rapport terug. axe-core 4.11 in een echte Chromium-browser, multi-page crawl, overlay-detectie.
Ook op deze site
Laatst bijgewerkt: