Hoe maak je een ADA-vriendelijk aanmeldingsformulier

Wat je leert

Leer hoe je de functies van de toegankelijkheidsassistent op het tabblad Formulierwaarschuwingen van de aanmeldingsformuliereditor kunt gebruiken om een aantal van de meest voorkomende problemen met de richtlijnen voor toegankelijkheid van webinhoud (WCAG) compliance te vermijden. Bedrijven die hun websites ADA-vriendelijk willen maken, moeten de WCAG-normen raadplegen en volgen. De toegankelijkheidsassistent helpt je bij het maken van aanmeldingsformulieren die toegankelijk zijn voor alle bezoekers van je site. 

Voordat je van start gaat

Hieronder staat een lijst met problemen waar de toegankelijkheidsassistent op zal controleren. Houd er rekening mee dat de onderstaande fouttypen zijn hoe Klaviyo's toegankelijkheidsassistent ze identificeert, niet specifieke invoerveldnamen in de formulierbouwer. Als er een fout wordt gedetecteerd, verschijnt er een waarschuwing met een beschrijving en een herstelprompt op het tabblad Formuliermeldingen.

Maak een ADA-vriendelijk aanmeldingsformulier

Of je nu je eerste aanmeldingsformulier maakt of een formulier bijwerkt, de toegankelijkheidsassistent helpt je bij het identificeren en oplossen van toegankelijkheidsproblemen.

Om een formulier te maken dat voldoet aan de bovenstaande WCAG-standaarden:

1. Maak een nieuw aanmeldingsformulier of open de formuliereditor voor een van je bestaande aanmeldingsformulieren.
2. Gebruik de editor om inhoud toe te voegen en het formulier te stylen zodat het bij je merk past.
   

   De toegankelijkheidsassistent zal tijdens het bouwen van je formulier in de gaten houden welke formulierelementen niet voldoen aan de WCAG-normen en deze als actieve meldingenregistreren. Een bestaand formulier logt alle problemen in het gedeelteactieve waarschuwingen.

3. Klik op de Formulierwaarschuwingen linksonder om de geïdentificeerde toegankelijkheidsproblemen te bekijken.
   
   Onder actieve waarschuwingen zie je verschillende kaarten met een beschrijving van de elementen die niet voldoen aan de WCAG-normen die de toegankelijkheidsassistent in je formulier heeft geïdentificeerd, naast andere geïdentificeerde problemen met de inhoud of het ontwerp. Elke kaart bevat een beschrijving van het probleem en een aanwijzing om het op te lossen of te negeren. Als je bijvoorbeeld een afbeelding toevoegt aan je aanmeldingsformulier, zal de toegankelijkheidsassistent je waarschuwen om alt-tekst aan de afbeelding toe te voegen. Alt-tekst geeft een beschrijving van de afbeelding, zodat winkelend publiek dat je site bekijkt met een schermlezer toegang heeft tot de digitale inhoud.
   
   
4. Om een probleem op te lossen, volg je de suggesties op de kaart en los je het ontbrekende element op of voeg je het toe. Klik op Fixals je tevreden bent met je wijzigingen.
   

   Sommige problemen zul je moeten oplossen in de instellingen van het betreffende blok (bijvoorbeeld een knopblok) of in de stijlensectie, in plaats van direct op het tabblad Formulierwaarschuwingen. Om deze problemen op te lossen, noteer je de probleembeschrijving op de waarschuwingskaart en klik je vervolgens op Blok bewerken (of Stijlen bewerken) om de voorgestelde wijzigingen door te voeren. Navigeer terug naar het tabblad Formuliermeldingen zodra je het probleem hebt opgelost.

   
5. Als je een of meer toegankelijkheidssuggesties wilt negeren, klik je op Dismiss. Als je een probleem afwijst, verschijnt er een modal waarin je wordt gevraagd je keuze te annuleren of te bevestigen.
   
   

   Je kunt op een later moment terugkeren naar genegeerde problemen door de assistent te openen en je eerder genegeerde waarschuwingen te bekijken. Het wordt aanbevolen om alle problemen op te lossen die in de toegankelijkheidsassistent naar voren komen. compliance Als je niet voldoet aan de WCAG-standaarden, kan je bedrijf juridische risico's lopen.

   Als je alle geïdentificeerde problemen hebt opgelost of afgewezen, zie je een bericht "Geen actieve waarschuwingen" op het tabblad Formuliermeldingen.
   
6. Klik op Publiceren om je aanmeldingsformulier live te zetten op je site met je toegankelijkheidsupdate.
   

   Merk op dat wanneer je op publiceren klikt, je wordt gevraagd om actieve formulierwaarschuwingen te repareren. Je kunt ervoor kiezen om de fouten op te lossen in het tabblad Formulierwaarschuwingen of toch te publiceren.

JAWS toegankelijkheidsrapporten

Houd er rekening mee dat JAWS, een schermleesprogramma voor Microsoft Windows, aanmeldingsformulieren op je website die zijn gemaakt in Klaviyo mogelijk niet detecteert. Om ervoor te zorgen dat bezoekers die JAWS gebruiken nog steeds met het aanmeldingsformulier op je website kunnen werken, raden we aan een extra stukje code aan je site toe te voegen dat de site toegankelijker maakt voor JAWS. 

Kopieer het volgende codefragment en plak het in het hoofd themabestand van je site, zodat JAWS je Klaviyo aanmeldingsformulier detecteert en leest:

Volgende stappen

Het is belangrijk om de WCAG-standaarden te handhaven op al je Klaviyo aanmeldingsformulier. Eerder gepubliceerde aanmeldingsformulieren kunnen nog steeds toegankelijkheidsproblemen bevatten die je moet oplossen, maar houd er rekening mee dat Klaviyo niet automatisch WCAG niet-compliant problemen zal oplossen. 

Navigeer naar het tabblad Formulierwaarschuwingen in de editor voor elk van je bestaande formulieren om eventuele toegankelijkheidsproblemen op te lossen om te helpen met WCAG-compliance op je website.

Extra hulpbronnen

• lijst van Axe HTML 4.5 regels
• Best practices voor toegankelijkheid in e-mails en formulieren
• Aan de slag met aanmeldingsformulieren