1. Design the application around the critical tasks.
As described in the last usability article “Developing Usable Products,” users typically spend 80% of their time completing 3-4 critical tasks. The remaining functionality is rarely used. By optimizing the application for the critical tasks, you will be helping your users immensely.
2. Reduce the number of fields.
Having a large number of fields on a page, few of which are regularly used, is daunting. Think through which fields are truly needed. Hide the remaining fields – or make a new view for your casual users that contain only the critical options. If you’re not sure which fields matter and which do not, ask your users. Often you can reduce the number of address fields (city, state, country, zip) by simply having a drop-down menu of your company’s locations.
3. Group and label the fields.
By grouping like fields and labeling those groups, you will help your user to complete the form and you will remove much of the “huh?” factor. Common groupings of fields and their labels include: Address, Costs, Dates, and Employee Information. Be sure to label your table fields as well.
4. Put the most important fields at the top.
Within a particular grouped section (e.g., Address), put the most important fields at the top. Typically, the most important fields will be the required fields. Put the most important grouped sections at the top of the form as well.
5. Place your buttons after the fields on which they act.
Buttons should be placed below the area upon which they act. If you are saving the entire form, put “Save” at the bottom of the form. If you are simply saving one field, put the “Save” button to the right of the field that you are saving. The location of the button indicates to the user what will be saved. Make sure that the indication provided by the button location is correct!
6. Align fields and field labels.
Forms will look cleanest if the field labels are left justified, and the fields themselves are of identical length and aligned on both the left and right sides. Be careful to make the vertical distance between fields in a section identical. |
