Dropdown menu’s zijn op text inputs na mijn favoriete elementen in een formulier. Ze nemen weinig schermruimte in maar kunnen ontzettend veel gegevens bevatten. Bovendien zijn ze behoorlijk gebruikersvriendelijk door handige kenmerken zoals het snel selecteren van een optie door de beginletter in te toetsen, zelfs op mobiele apparaten. Helaas worden dropdown menu’s niet altijd even goed gebruikt. Vijf tips voor een gebruiksvriendelijker formulier:

1) Bewaar functionaliteit

Dropdown menu’s hebben de onhebbelijkheid dat ze lastig zijn te stylen. Veel webdevelopers hebben dit ‘opgelost’ door gebruik te maken van Javascript of Flash. Vaak werkt de basis functionaliteit dan prima (een lijst met opties en de mogelijkheid om deze te selecteren) maar handige opties zoals scrollen, het snel naar de juiste keuze springen door de eerste letter in te toetsen of het form element te selecteren met de ‘tab’ toetst werken dan niet meer. Zorg dat deze functionaliteit bewaard blijft. Dankzij conventies als deze kunnen we het web bruikbaar houden.

Usability fail: Ovi Maps

Een mooi voorbeeld van hoe het niet moet is de Nokia Ovi Maps header (in Flash). Allereerst werkt het scrollwheel niet, daarnaast kan er alleen gescrolled worden door op de scrollbar te klikken (en dus niet door in het lege gedeelte onder de scrollbar te klikken). Tot slot is het ook niet mogelijk om snel naar de gewenste optie te springen door de beginletter in te toetsen (had overigens ook in HTML niet goed gewerkt, aangezien voor elk model ‘Nokia’ is toegevoegd).

Lees de andere 4 tips!