Tips on designing inclusively for cognitive disabilities
Their problems, behaviours, needs & tools, plus design guidelines for building accessible products
In my article “The three levels of accessibility”, I mention the importance of designing for clarity and inclusivity. Not only to ensure everybody regardless of ability is able to access your site but so that developers can implement accessible code.
I will be discussing the various problems people face, their unique behaviours and needs, the tools they use, and how we can better accommodate them in our digital products. I’ve broken it into 5 sections across 5 articles:
- Cognitive/Neurological
- Auditory/Hearing
- Visual
- Physical
- Speech
Cognitive/Neurological
The first group includes mental, psychological, and medical problems that may cause a decreased mental function or slowly deteriorate it. We may all suffer from cognitive issues at some point in our lives, including as we age, or feeling anxious when filling out an important form, “have I filled it out correctly?”, how many of us have double or even tripled checked a form?
It is important to consider all extremes when we design, especially when persuading other stakeholders. All too often people look at the extreme, for example, Dementia or Alzheimers and say “oh those types of users will never use our products…”, end of the conversation. It is important to point out that actually designing for the extreme means we also include those with medium-to-low cognitive issues which are a far higher majority. Those with Anxiety, Autism, Dyslexia, Migraines, Vertigo, and so many more. All of these affect people to varying degrees and no matter what industry you’re in these users exist.
Here are some more:
- Anxiety — a feeling of unease, such as worry or fear.
- Attention deficit hyperactivity disorder (ADHD) — trouble paying attention, controlling impulsive behaviours or be overly active.
- Autism spectrum disorder (ASD) — challenges with social skills, repetitive behaviours, speech and nonverbal communication.
- Delirium — difficult to think, remember, sleep, pay attention, and more
- Dementia & Alzheimers — loss of thinking, remembering, and reasoning
- Depression — low mood that lasts for weeks or months
- Dyslexia, dysgraphia, dyscalculia — Difficulty word reading and spelling, writing down thoughts on paper, and understanding numbers
- Epilepsy — electrical activity in the brain cause seizures or fits
- Learning disabilities — reduced ability to understand new or complex information, to learn new skills, and to cope independently
- Migraines — severe headache and increased sensitivity to light or sound
- Multiple sclerosis — tiredness, vision problems and problems with walking or balance
- Schizophrenia — hard to recall previous experiences and understanding object relationships
- Vestibular balance disorder (VBD) — dizziness, blurred vision, disorientation
- And more…
Behaviours & needs
Users with cognitive problems can easily feel overwhelmed and they expect the interface to be predictable. They need more time to complete tasks including typing and are more likely to make mistakes. Therefore they need assistance completing words and sentences with minimal typing. They also like being reassured and reminded throughout their journey.
Problems
The problems they are likely to come across are difficulty in focusing, reading and understanding information especially long paragraphs and pages full of text. This is amplified by complex unusual words/sentences and complex navigation and layouts. Visual flickering or audio at certain frequencies/patterns can trigger some of the above conditions and create distractions for others. Finally, medication for some of the above conditions can have side effects that include blurred vision, hand tremors and more.
Tools
So, what tools do these users use to try and assist their experience?
- Word prediction software
- Text-to-speech software
- Grammar and spelling tools
- Touch screens
- Keyboard only
- Pop-up and animation blockers
Inclusive design tips & tricks
Here is some advice on designing inclusively for anyone with cognitive/neurological issues:
Titles, paragraphs, and text
- Keep instructions and language simple and clear, remove jargon and acronyms
- Make sure links are descriptive (no ‘Click Here!’, ‘Next’, ‘Back’, ‘Submit’ etc.)
- Use words alongside numerical information, for example, temperature as cold, warm, & hot
Page structure
- Use headings properly for clearly structured content to provide orientation and scan-ability
- Make content and pages linear
- Be consistent with labelling, targets, functionality, and overall patterns/interactions (predictability)
- Try to avoid using parallax when scrolling
- Hide less used functionality
- Use progressive disclosure to prevent overwhelming users
- Provide the ability to hide/unhide parts of the interface (side panels, chat windows, etc. to focus on a specific task)
Images & iconography
- Use icons in combination with text (represent words or concepts)
- Supplement textual content with images, graphs, and other illustrations
Forms
- Don’t hide placeholders on form fields
- Don’t animate or move form field labels (it’s unpredictable)
- Use clear helpful error messages and options for correcting inputs
- Use help text to explain why certain information is required
- Alternate methods for ReCaptcha puzzle (like multi-factor authentication)
- Don’t require users to create an account to access content (guest checkout, etc.)
- Alternative methods to memorising passwords for user authentication (biometric, password managers, etc.)
- Avoid or allow users to turn-off/adjust time limits, provide warnings at the very least
- Support multiple input formats for dates, times, currency, etc.
Navigation
- Add sitemaps and search functionality as alternatives to a hierarchical navigation
- Provide spell checkers and similarity search on search inputs
- Use progress/step indicators to remind users where they are in a process
Videos & animations
- Be careful with animations and video (avoid flickering, fade is better than slide, warn of flashes 3 times per second or more)
- Include the ability to turn off animations, blinking, flickering, flashing, etc. (the iPhone has this ability)
- Don’t rely on animations (ensure the process can still be completed)
- Make sure carousels can be paused on individual slides/images
Audio
- Ensure audio is not auto-played (distracting and can interfere with text-to-speech)
- Combine audio and visual content to make information easier to understand
- Provide an online chat feature, not just a phone number (too anxious or depressed to talk verbally)
This list scratches the surface on designing inclusively for cognitive disabilities. You can find a wealth of information on the subject at W3.org:
This course on LinkedIn learning is also well worth watching:
As are these articles & videos:
- https://www.w3.org/WAI/fundamentals/accessibility-intro/
- https://www.nngroup.com/articles/accessible-design-for-users-with-disabilities/
- https://webaim.org/articles/cognitive/design
- https://thenextweb.com/growth-quarters/2020/04/06/designing-for-cognitive-accessibility-where-to-begin/
- https://alistapart.com/article/designing-for-cognitive-differences/
- https://youtu.be/3f31oufqFSM
Up next
I’ll be discussing how to design inclusively for Auditory/Hearing disabilities. The problems they face, their behaviours and needs, the tools they use, and how we can design to include them. If you found this article helpful and are interested in the next 4 articles on the various disabilities, press Follow and stay tuned.
What design tips do you have when designing for cognitive disabilities? Let’s all share our knowledge and help each other out in the comments!
