Design Pattern: Use Clear Visible Labels
User Need
I need clear labels, step-by-step instructions, and clear error messages.
What to Do
Use clear labels. Labels should:
- use common words and easy to understand language,
- be visible and next to the relevant control, and
- be readable by assistive technologies, including those used by people with cognitive and learning disabilities.
How it Helps
When labels are missing or unclear, users often do not know that the feature is available or what the control is. Although many users can guess what a control is for users with cognitive and learning disabilities with impaired memory or executive function are less likely to be able to remember the design pattern or work out what it is. A clear label that uses familiar terms and is located next to the control, helps people with cognitive and learning disabilities.
Similarly, if a label is not next to a control it is confusing for some users. When a label cannot be next to a control, there should be clear visual indicators that visibly and unambiguously associate the label with the control. This will need user testing with users who have learning and cognitive and learning disabilities to ensure it is usable.
For example, a user living with early stage dementia is using an application. Some controls do not have visual labels. A caregiver shows them what the control is for and they can use the application. The next day they try to use it again, but cannot remember what the control is for. This application is not usable for them.
In another example, the label disappears when the focus is removed. The user cannot remember what the control is and does not know how to make it reappear.
Labels need to be visible, readable by assistive technology, and be nearby the labeled content.
More Details
Many people with cognitive and learning disabilities use web extensions and simple text-to-speech. These assistive technologies often do not read WAI-ARIA [[wai-aria-1.2]] or titles. Until that changes, or an extension displays them, labels should not rely on these attributes for people with cognitive and learning disabilities.
Examples
Use:
-
Visible labels that use simple common words and are next to the control.
For example:
- first name ____________________
Avoid:
-
Hidden labels or labels that use uncommon words that are not easy to
understand. It is unclear what action is needed. For example:
- given name ___________________
Related Information
User Story
Personas
- Alison: An Aging User with Mild Cognitive Impairment
- George:
- Gopal: A Retired Lawyer with Dementia
- Jonathan: A Therapist with Dyscalculia
- Kwame: A Traumatic Brain Injury Survivor
- Maria: A User who has Memory Loss
- Sam: A Librarian who has a Hemiplegia and Aphasia
- Tal: A Student who has Dyslexia and Impaired Eye Hand Coordination
- Yuki: A Yoga Teacher who has AD(H)D