Maak je formulier beter toegankelijk met accesskeys
Vandaag de dag wordt er veel gesproken over de toegankelijkheid van websites voor mensen met beperkingen, maar hoe zit dat nu bij formulieren? Hoe zou je die toegankelijk kunnen maken? Het antwoord op deze vraag is 'accesskeys'.
Een accesskey is een html-attribuut dat gebruikt kan worden als sneltoets. Je kunt hiermee snel navigeren naar de diverse formuliervelden via het toetsenbord. Deze sneltoetsen zijn dus met name geschikt voor bezoekers die afhankelijk zijn van het toetsenbord. Dit kan zijn doordat ze een handicap hebben of simpelweg niet de beschikking hebben over een muis.
Laten we eens naar een aanmeldformulier kijken. Stel, je wilt het naam- en emailveld op je website snel toegankelijk maken. We gaan eerst kijken hoe de HTML-code er uit zou kunnen zien. Hieronder staat het voorbeeld:
<form action="een_script.cgi" method="post">
Naam: <input type="text" name="naam" /><br />
Email: <input type="text" name="email" /><br />
<input type="submit" name="submit" value="Aanmelden" />
</form>
We hebben dus een naam- en email-veld en een knop 'Aanmelden' om het formulier te kunnen verzenden. Willen we deze input-velden toegankelijk maken via het toetsenbord, dan moeten we per veld een accesskey-attribuut toevoegen.
<form action="een_script.cgi" method="post">
Naam: <input type="text" name="naam" accesskey="n" /><br />
Email: <input type="text" name="email" accesskey="e" /><br />
<input type="submit" name="submit" value="Aanmelden" accesskey="s" />
</form>
Wat we nu gedaan hebben is de letter n als sneltoets koppelen aan het naamveld, de letter e hebben we als sneltoets gekoppeld aan het emailveld en de letter s is als sneltoets gekoppeld aan de verzendknop. Om nu toegang te krijgen tot deze velden kun je niet simpelweg op de betreffende letter op het toetsenbord drukken. In de meeste browsers is het een combinatie van een andere toets en de ingestelde accesskey. In Internet Explorer brengt de 'Alt'-toets in combinatie met de betreffende accesskey ons naar het gewenste veld. In FireFox 2 is dit 'Shift Alt' en de accesskey.
Met de Alt- en de n-toets krijgen we in IE dus toegang tot het naamveld en kunnen we beginnen met typen. Nu ontstaat er wel een probleem. In de meeste browsers hebben bepaalde toetscombinaties al een functie. Zo opent in IE (Engelse versie) de toetscombinatie 'Alt f' het 'File'-menu en 'Alt e' het 'Edit-menu'. In ons formulier hebben we ook gebruikgemaakt van de letter e als accesskey om met de toetscombinatie 'Alt e' toegang te krijgen tot het emailveld. Door deze toetscombinatie te gebruiken, verminder je dus de toegankelijkheid van de browser voor mensen die afhankelijk zijn van het toetsenbord. Dit moet je dus zien te voorkomen. Je zou bijvoorbeeld in plaats van letters, cijfers kunnen gebruiken.
Een ander nadeel van accesskeys is dat er geen standaard is over het gebruik hiervan. Het gebruik van accesskeys verschilt dus per website. De één maakt gebruik van letters, de ander van cijfers of ze worden helemaal niet gebruikt. Maak je wel gebruik van sneltoetsen, probeer dan de bezoeker hierop attent te maken. Als ze eerst al moeten uitzoeken welke sneltoetsten er gekoppeld zitten aan de diverse elementen van een website, is het voordeel van tijdwinst al snel weer weg.
Probeer het maar eens uit.
Succes!


