dd006_Labels are placed ontop of fields. Labels are not in bold

Question 1: For inputs in a form which is in edit mode should labels be placed on top of fields or to the left? should the labels be bold?

List of options

  1. Labels to the left of fields and in bold

Label to the left

  1. Labels placed on top of fields and not bold.

Label on top

Option 1#

For

  • Consistent with old (v1) Hub practices

Against

  • Alignment issues in forms when labels are of different lengths.
    • old Hub solved this problem by providing a lot of space between labels and fields. An option that inefficiently uses space.
  • Format will take too much space in two column page layouts.
  • Format doesn't work well when we want to have two closely related fields next to each other. Too much space is used.
  • Bolded labels provide very limited value to the user. We are wasting this visual weightage by using it on such a common default setup.

Option 2#

For

  • Label and field combo is always consistenly laid out no matter the label length
  • Format works with use space well with two column page layouts
  • Format works for related fields presented next to each other. (Screenshot of first name and last name fields next to each other)
  • The close proximity of the label to the field makes the need to bold the labels even more rendundant. We can put visual weightage to better use.

Against

  • Goes against practices of old (v1) Hub. Creates inconsistency between older apps and newer ones.

Decision#

Option 2 This field/label format can be consistently applied across different page layouts. The inconsistency it creates between new apps and old apps is acceptable due to the flexibility it offers.

Last updated on by Paulo Andrade