SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Guru Rebirth Studios's Avatar
    Join Date
    Mar 2003
    Posts
    621
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Form Field Label Position

    I was just reading some research on form labels and wanted to know if anyone here has documented their own improvements in form conversions by putting the form labels above the fields?

    I'm also curious how this method compares to having them inside the form field itself (the text disappears, when entering text).

  2. #2
    SitePoint Wizard bronze trophy C. Ankerstjerne's Avatar
    Join Date
    Jan 2004
    Location
    The Kingdom of Denmark
    Posts
    2,692
    Mentioned
    7 Post(s)
    Tagged
    0 Thread(s)
    I prefer placing the label on top of the form field, as it allows both a more compact form and easier styling. I'm glad to find that this is also apparently the most user-friendly (although I'm a bit surprised that the label shouldn't be bold).

    There are many disadvantages to placing the label inside the field. These are:
    • Unless you code the label properly in the HTML, and then use Javascript to remove the text from it and populate the form field with the contents, screen reader users and users without Javascript will not be able to read the label.
    • Unless set up as above, users without Javascript will have to manually delete the text from the form field.
    • It will not be possible to change the font size of the text.
    • If the user does not fill out the form field, the form field will have to be re-populated with the label, or it will be impossible to know what it's for.
    • If the user does fill out the form field, and wish to review the form before submitting it, it will be impossible to know what the original label was. This will especially be a problem if you do client-side form validation, and the user has accidentally switched two fields.
    • Having the text disappear (and possibly reappear) is especially a problem to users with poor vision and elder people.
    • Some users with poor vision use their cursor to mark text, optimizing the contrast. This will be impossible for the labels.

    There are probably more, but these are the most specific ones I can think of. The most important argument, however, is that it is non-standard behaviour for no other reason than to look flashy. Sacrificing familiarity for appearance is a mortal sin of usability.
    Christian Ankerstjerne
    <p<strong<abbr/HTML/ 4 teh win</>
    <>In Soviet Russia, website codes you!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •