Scoor met uw website.

Usability van webforms

Ik had onlangs een pittige discussie met P. (lees trouwens zijn zeer interessante site Usersense) over de uitlijning van webformulieren.

Een webformulier bestaat typisch uit een linkerkolom met labels (Naam, Adres...) en een rechterkolom met invulvelden.

Moeten die labels links uitgelijnd worden (zodat er ongelijke gaten ontstaan tussen label en invulveld) of moeten ze rechts uitgelijnd worden, tegen het bijhorende invulveld?

Zoals altijd in usability, is het juiste antwoord: het hangt er van af. Meer specifiek, het hangt af van het gedrag van de bezoeker, en de taak die hij wil uitoefenen. (Pas op! Buzzword! Behavioural.)

Als het formulier slechts één maal of zeer beperkt door de bezoeker moet ingevuld worden (de meeste webformulieren vallen hieronder, bv. een contactformulier), dan ga ik voor linkse uitlijning.
De gebruiker moet dan elke regel volledig lezen, omdat hij niet met het formulier vertrouwd is. Zijn eerste aandacht gaat dan naar het label, pas daarna naar het invulveld. Bij het verderlezen naar de volgende regel, zoeken zijn ogen het beginpunt weer op, met het volgende label.
Dan is een linkse uitlijning het meest geschikt.

Als het formulier bij wijze van spreken dagelijks door de bezoeker gebruikt wordt (bij een veelgebruikte webapplicatie), dan kent hij de plaats van de invulvelden. De focus in het gebruik moet dan op de data (de invulvelden) liggen, niet op de labels. Door de labels rechts uit te lijnen, en de invulvelden er links tegenaan, ligt die focus op het begin van het invulveld.
Rechtse uitlijning lijkt hier het beste.

Het grote nadeel bij een rechtse uitlijning van de labels is dat je een zeer onrustig pagina-beeld creëert. De linkerkant van de pagina 'danst' nogal.

Wat is jullie overtuiging? Links of rechts?

Dit artikel gaat over: - - .
Usability van webforms werd geschreven door Bart op 11-04-2006 (836 dagen geleden) - Share!

Reacties:

Re: Usability van webforms

Gravatar beeld van Roel
Voor een gebruiker die schermgroting gebruikt, zijn rechts uigelijnde labels minder geschikt: als je met een schermvergroting van pakweg 16x werkt, zie je maar één of twee woorden van een tekstregel tegelijk op het scherm. Als je dan het formulier wil 'scannen' met je ogen (door er doorheen te scrollen), dan moet je een stuk vaker ook van links naar rechts scrollen om de inhoud van het label te kunnen lezen (en in een oogopslag te begrijpen). Je kan de 'viewport' van je schermvergrotingsprogramma natuurlijk ook rechts positioneren, zodat je steeds het laatste stukje van het label in beeld hebt, maar dat is in de praktijk een stuk vervelender. Dat komt (uiteraard) doordat wij, 'Westerlingen', van links naar rechts lezen. Om het verschil helemaal te begrijpen, zou je het eens moeten proberen.

Voor wie schermvergroting gebruikt, is een formulier waarbij de velden onder de labels gepostioneerd zijn, eigenlijk nog het handigst van al. Ook formulieren waarbij de velden meteen aan de labels geplakt worden (zonder nette kolommen dus), wordt door gebruikers van schermvergroting als handiger ervaren.

Maar je moet natuurlijk een compromis vinden waar alle gebruikers goed bij varen. Vanuit usability-standpunt, vind ik dat je labels daarom liefst links uitlijnt, maar daarnaast ook voor een 'oogliniaal' zorgt (bijvoorbeeld een alternerende grijze/witte achtegrond) zodat je ogen naar het bijbehorende invoerelement geleid worden als de afstand tussen het laatste woord in het label en het invoerveld nogal ver is. Dat is ook een niet te onderschatten hulp voor gebruikers van schermvergroting.

Over checkboxes en radiobuttions: naar analogie met formulieren op papier, vind ik het beter om labels rechts van deze formulierelementen te plaatsen. Zo kan je in de linkerkolom bijvoorbeeld de instructietekst 'Geslacht' plaatsen, en rechts een groep met radiobuttons die er zo uitziet.

() Man
() Vrouw

Mijn gedacht.

Roel , 11-04-2006 (835 dagen geleden)

 

Re: Usability van webforms

Gravatar beeld van VincentLukeW heeft daar een tijdje geleden al iets over geschreven: http://www.lukew.com/ff/entry.asp?144

Met een even degelijke follow-up hier: http://www.lukew.com/ff/entry.asp?155

Vincent , 11-04-2006 (835 dagen geleden)

 

Reageer:

Naam
Jouw website adres
Jouw e-mail adres
Titel
Reactie
Ben jij een mens?

Hoeveel is twee plus zes (in cijfers) ?

Scoor met uw website.
© Netlash Webdesign en Grafisch Ontwerp