Keuze

Maandag, 25 maart 2002
Wat is de beste widget voor een enkelvoudige selectie? Dropdownbox, listbox, radio buttons, hyperlinks, buttons of entry veld?

Dropdown box

De dropdown box is de favoriet van designers omdat die weinig ruimte op het scherm inneemt. Dropdownboxen zijn echter lastig en tijdrovend voor gebruikers (useit.com/alertbox...). Gebruikers hebben geen onmiddellijk overzicht over de keuzes en moeten veel acties doen om een keuze te maken.
Actie Tijd volgens GOMS
(standford.edu/...)
The Humane Interface

GOMS tijden uit Jef Raskin's boek:
The Humane Interface
hoofdstuk 4.2.1 Interface Timings

Wisselen van toetsenbord naar muis 0,40 sec
Mentale voorbereiding 1,35 sec
Met de muis naar de dropdownbutton 1,10 sec
Klikken om het menu te openen 0,20 sec
Muizen naar de gewenste keuze 1,10 sec
Klikken om te selecteren 0,20 sec
Totaal 4,35 sec
Gebruikers zijn veel trager met de muis dan veel ontwerpers beseffen. De meeste ontwerpers zullen dan ook met ongeloof op de 4,35 seconden reageren. Advies: Pak nu een stopwatch. Doe een praktijktest. Selecteer Entry veld in de dropdown box hierboven.

De dropdown box is geschikt voor

  • laag frequent gebruik, minder dan 1 keer per dag.
  • met een beperkt aantal keuzes, maximaal 7.

Listbox

Een list box neemt meer schermruimte in dan de dropdownbox. Daar staat een groot voordeel tegenover: De listbox toont altijd een behoorlijk aantal keuzes. Scrollen is makkelijker omdat de scrollbar onmiddellijk beschikbaar is.

Nadeel: Het is niet duidelijk of de lijst single of multiple selection biedt. Had u al opgemerkt dat u in de lijst hiernaast meerdere keuzes kunt selecteren?

De listbox is geschikt voor

  • lange lijsten met variabele inhoud
  • medium frequent gebruik, diverse keren per dag.

Radio buttons

Standaard radio buttons

Dropdown
Lijst
Radio buttons
Hyperlinks
Buttons
Entry veld

Verbeterde radio buttons

Dropdown
Lijst
Radio buttons
Hyperlinks
Buttons
Entry veld
Een lijst van radio buttons biedt onmiddellijk een volledig overzicht van alle mogelijkheden. Dat toont gelijk het nadeel: de radio buttons nemen nogal wat ruimte in.

Aan de andere kant is de radio button zelf erg klein. Fitts's law (asktog.com/...). werkt in het nadeel van de standaard radio button. De gebruiker moet heel precies mikken om een keuze te maken.

De standaard radio buttons zijn geschikt:

  • voor een bewuste keuze uit een beperkt set (maximaal 7),
  • in laag frequente functies waar duidelijkheid belangrijker is dan snelheid,
  • in combinatie met andere input widgets op een form.
Een stukje javascript, toegezonden door de heer Verseput zelve (verseput.com) maakt ook de tekst klikbaar. De verbeterde radio buttons zijn geschikt voor hoogfrequent gebruik.

Hyperlinks

Hyperlinks zijn, net als radiobuttons, onmiddellijk duidelijk. Gebruikers zijn gewend om op links te klikken om van scherm naar scherm te gaan. De klikbare ruimte is groot, makkelijk te raken.

Hyperlinks zijn geschikt voor:

  • hoog frequente functies,
  • lange lijsten (de gebruiker kan snel zoeken met de standaard scrolling en de browser zoekfunctie),
  • navigatie naar een ander scherm.
Tip: Gebruik links voor 'ongevaarlijke' acties. Een hyperlink naar een update scherm is prima.

Buttons

Buttons hebben dezelfde voordelen als hyperlinks. Ze bieden een compleet overzicht van mogelijke keuzes, bieden een grote klikbare ruimte. Ze nodigen zelfs uit tot klikken.

Buttons zijn ideaal om

Advies: Gebruik uitsluitend links voor navigatie en buttons uitsluitend voor beslissingen.

Entry veld

Grote verrassing: Een entry veld is sneller dan een dropdown box.
Actie Tijd
Mentale voorbereiding 1,35 sec
11 toetsaanslagen voor entry veld[Enter] 2,20 sec
Totaal 3,55 sec
Typen is verbazingwekkend efficiënt. Een entry veld is voor een gebruiker vaak de snelste oplossing, zeker indien:
  • het aantal mogelijkheden groot is
  • het aantal toetsaanslagen gering is
  • de gebruiker de juiste mogelijkheid uit het hoofd weet
  • de kans op fouten laag is
Advies: Gebruik entry velden voor hoog frequente input van datums, postcodes, etcetera.

Tot de volgende week,
Henk Jan Nootenboom