I'm designing a long form that requires users to complete multiple fields and upload various documents. I'm considering where to place assistive text—either alongside the label or beneath the field. Which option is more effective for text fields, dropdowns, and document upload sections, both in this specific scenario and in general?
Add a comment
|
2 Answers
This is not grounded in research, but: I find the first option rather strange, because it separates label and field (value).
My rationale would be that tyically (either by being knowledgable in the field, or by previous usage) users know what to put into the field given the label. The assistive text is rarely needed, and thus needs to be "out of the way" of regular processing.
Only when the user has read the label (and potentially, the field prompt) and understood the data type (indicated by the input control: free text, selection, date, ...) and still does not know what to enter, he looks for further information, which should be somewhere near.
Not knowing what the overall layout of the form is (multiple columns?), I might even think about moving the assistive text to the right side of the form, to allow a smooth reading and entering of information on the left side (label above field weakly suggests it's a one-column layout).
-
As a possible counter to this - having the help information available before the field is useful for screenreader users. Otherwise they just get told there a field and if they need more info they won't find out about it until they've tried entering something and then move out of the field.– JonW ♦Commented Sep 5 at 12:12
One solution is to include assistive text inside the label tag to convey important information e.g.
<label>
Password (Minimum 8 characters)
</label>
<input ...>
