Aan de slag met de Accessibility Widget van iubenda: Een stap-voor-stap gids

De European Accessibility Act (EAA) werd op 28 juni 2025 volledig van kracht en bracht nieuwe eisen met zich mee voor de toegankelijkheid van websites. Voor bedrijven die actief zijn binnen de EU of die EU-klanten bedienen, is het van cruciaal belang om de toegankelijkheid te verbeteren en zich aan te passen aan deze nieuwe normen. Met iubenda’s Accessibility Widget is het toegankelijker maken van je website heel eenvoudig.

De nieuwe Accessibility Widget van iubenda maakt gebruik van AI-gestuurde aanpassingen om je website automatisch toegankelijker te maken voor gebruikers met verschillende beperkingen. De oplossing ondersteunt een reeks toegankelijkheidsfuncties, waardoor het voor gebruikers eenvoudiger wordt om door je site te navigeren en ermee te werken.

Wat is de Accessibility Widget van iubenda?

iubenda’s Accessibility Widget is een volledig geautomatiseerde widget om de toegankelijkheid van je website te verbeteren. Het past je website in realtime aan om tegemoet te komen aan de behoeften van gebruikers met een beperking, inclusief toegankelijkheidsprofielen, tekstgrootte aanpassen, modi met hoog contrast, beter leesbare lettertypen en meer. De belangrijkste functies zijn:

  • 🎧 AI-alt-tekst en paginastructuur: Voegt alt-tekst toe aan afbeeldingen en herkent koppen en landmarks terwijl bezoekers surfen. Dat helpt mensen die een schermlezer gebruiken.
  • 🔳 Contrast en tekstgrootte: Hiermee kunnen gebruikers het contrast en de lettergrootte aanpassen aan hun behoeften.
  • ⌨️ Sneltoetsen: Bezoekers drukken op Alt+0 om het paneel te openen of te sluiten, en op Alt+9 om de aanpassingen te pauzeren of te herstellen.
  • 🌀 Controle over dynamische content: Hiermee kunnen gebruikers met epilepsie of andere aandoeningen animaties of dynamische inhoud stoppen die schadelijk zouden kunnen zijn.

Met een eenvoudig installatieproces kun je meteen aan de slag zonder dat je de code van je website hoeft te veranderen.

Stap 1: De Accessibility Widget activeren

  1. Ga naar het iubenda-dashboard: Op je iubenda-dashboard vind je de Accessibility Widget-tegel onder je beschikbare producten.
  2. De widget activeren: Klik op de knop Activeren om de Accessibility Widget te gaan gebruiken.
  3. accessibility solution

Stap 2: De Accessibility Widget aanpassen

Zodra je de Accessibility Widget hebt geactiveerd, kun je hem laten aansluiten bij de stijl van je website met de configurator van de Accessibility Widget. Deze tool is beschikbaar in zowel de nieuwe als de oudere abonnementen.

  1. Ga naar je iubenda-dashboard.
  2. Zoek de tegel Accessibility Widget.
  3. Klik op de knop Instellingen om de configurator te openen.

Zo ziet de configurator eruit:

In de configurator vind je verschillende opties om de widget helemaal eigen te maken:

  • Positie van de widgetknop: Kies waar de knop van de widget op het scherm verschijnt: linksboven, linksonder, rechtsonder of rechtsboven

👉 Het paneel van de widget opent altijd vanaf de onderkant van het scherm.

  • Kleuren van het paneel: Kies een primaire kleur voor het paneel die past bij het ontwerp van je site. Met het Standard-abonnement kun je ook een secundaire kleur kiezen voor geselecteerde onderdelen. Doe je dat niet, dan gebruikt de widget de primaire kleur. Is het contrast te laag, dan zie je een waarschuwing, maar je kunt nog steeds opslaan.
  • Uiterlijk van de widgetknop: Pas zowel de kleur van het pictogram als de achtergrondkleur van de knop aan.
  • Standaardtaal: De widget toont het paneel in de taal van elke pagina. Ontbreekt de taal van een pagina of is die niet beschikbaar, dan gebruikt de widget de taal die je hier instelt.

💡 Het paneel van de widget linkt niet naar een toegankelijkheidsverklaring. Heb je er een? Link er dan naar vanuit de footer van je site, zodat bezoekers hem op elke pagina vinden. Moet je er nog een schrijven? Lees onze gids voor de toegankelijkheidsverklaring.

💡 Alle wijzigingen die je in de configurator maakt, worden automatisch toegepast op je Accessibility Widget, ook als die al op je website is ingesloten.

Stap 3: De Accessibility Widget op je website installeren

Zodra je de widget hebt geactiveerd en ingesteld, kun je hem op je site insluiten.

  1. De Widget insluiten: Kopieer het bijgeleverde codefragment voor de toegankelijkheidswidget en plak het helemaal aan het begin van de head-sectie van je website (direct na de <head>-tag) om de widget te installeren.
  2. accessibility solution
  3. De werking van de widget controleren: Vernieuw na het insluiten je website om er zeker van te zijn dat de widget zichtbaar is en goed werkt. Je moet nu een klein toegankelijkheidspictogramzien:
  4. accessibility solution

Hoe de widget werkt voor eindgebruikers

Zodra de Accessibility Widget is ingesloten en actief is op je website, kunnen eindgebruikers ermee werken om hun surfervaring aan te passen. Als gebruikers hun instellingen wijzigen via de widget, worden realtime aanpassingen gedaan aan de lay-out van de website, zodat de inhoud direct wordt geoptimaliseerd op basis van de geselecteerde voorkeuren. Dit is hoe de widget werkt en welke functies de widget heeft:

  1. Uiterlijk van de widget: De toegankelijkheidswidget verschijnt als een klein pictogram. Als gebruikers op het pictogram klikken, wordt een menu met toegankelijkheidsopties geopend, zodat de lay-out van de website naadloos kan worden aangepast.
  2. Gebruikersvoorkeuren: Met de widget kunnen gebruikers hun toegankelijkheidsvoorkeuren selecteren, zoals:
    • Tekstgrootte: Gebruikers kunnen de grootte van de tekst aanpassen voor een betere leesbaarheid.
    • Contrastinstellingen: Het contrast kan worden aangepast om content duidelijker naar voren te laten komen, vooral voor mensen met een visuele beperking.
    • Leesbare lettertypen: Bezoekers kunnen overschakelen naar lettertypen die makkelijker lezen, zoals Atkinson Hyperlegible en OpenDyslexic.
    • Profielen (Standard-abonnement): Voorinstellingen met één klik voor Slechtziendheid, Epilepsie en aanvallen, Motorische beperking, Dyslexie, Cognitie en leren, ADHD, Schermlezer en Kleurenblindheid. Ze veranderen wat de bezoeker ziet, niet de code van je site.
    • Tekstgrootte en -stijl: De tekst kan worden vergroot of aangepast op een manier die de tekst leesbaarder maakt zonder dat de pagina opnieuw hoeft te worden geladen.
    • Contrast: Hiermee kan de gebruiker wijzigingen toepassen op achtergrond- en tekstkleuren om de zichtbaarheid voor gebruikers met kleurenblindheid of slechtziendheid te verbeteren.
  3. Dynamische content-controle: Voor gebruikers die gevoelig zijn voor animaties of knipperende content, biedt de widget de optie om animaties uit te schakelen of het gedrag van dynamische content aan te passen. Dit is vooral gunstig voor mensen met aandoeningen zoals epilepsie.
  4. Paginastructuur: Een tabblad met de koppen, landmarks en links van de pagina, zodat bezoekers meteen naar het deel springen dat ze nodig hebben. Bezoekers kunnen ook op Alt+0 drukken om het paneel te openen of te sluiten, en op Alt+9 om de aanpassingen te pauzeren of te herstellen.
  5. AI-alt-tekst en landmarks: De widget voegt alt-tekst toe aan afbeeldingen en herkent koppen en landmarks terwijl bezoekers surfen, binnen de maandelijkse limieten van je abonnement. Dat helpt mensen die een schermlezer gebruiken.
  6. Handig en toegankelijk: De toegankelijkheidsinstellingen blijven op elk moment gemakkelijk toegankelijk, omdat de widget op een vaste plaats op de site zweeft, zodat gebruikers wijzigingen kunnen aanbrengen wanneer dat nodig is.
  7. accessibility solution

Met iubenda’s Accessibility Widget kun je de toegankelijkheid van je website verbeteren en alle gebruikers een betere, inclusievere ervaring bieden.

Begin vandaag nog en verbeter de toegankelijkheid van je website!

Nu activeren

How can we help?