Kallidus experts, Lucinda Hensley and Justine Swain, share their insights about the do's and don'ts of accessible design.

1. WITH
LUCINDA
HENSLEY
Welcome!
Accessible design
Minimum effort, maximum impact
April 25, 2024
AND
JUSTINE
SWAIN

2. Agenda
• Why accessible design matters
• Transforming an example
• Clean screens
• Visual design
• Text and formatting
• Multi-optionality
• Tools to make accessible design simple
• Q&A

3. 16%
of the global population (that’s 1 in
6!)
1.3 billion*
People globally experience and live with
some type of disability or impairment.
* Statistics from the World Health Organisation.
This figure is estimated, based on those who have declared their disability either through their GP or other routes.
Why it’s
important

4. Why it’s
important
Permanent Temporary Situational
A life-long disability or impairment.
Examples: Blind, neurodiverse, brain
injury.
A disability or impairment that will
impact the user for a period of time.
Examples: Broken arm, concussion,
eye infection.
Where the need to adapt is based
on your current situation.
Examples: Noisy background, slow
broadband, new children or pets.

5. An example of inaccessible design

6. Clean screens

7. Why it’s
important
• Cluttered screens divert learner attention and dimmish
engagement
• Excessive information creates cognitive overload, impeding
learner’s ability to process that information
• Busy screens convolute and disrupt the intended learner
journey
Particularly key for:
• Visually impaired
• Neurodiverse individuals
• Screen reader users

8. What it
is
Ensuring there is an obvious and
natural reading order to the screen: Top
to bottom (columns) or left to right
(paragraphs).
Not having too much going on, only the
critical information needed is on each
screen.
Making use of whitespace to prevent
overloading the screen .

9. Cleaning up the example

10. Keep in
mind
• What is the key purpose of the screen?
Is that the most obvious part?
• Where is the eye naturally drawn first?
Is this where you want it to be?
• Everything on the screen should support the learning in
some way; if it doesn’t, it’s likely just a distraction

11. Visuals

12. Why it’s
important
• Poor contrasting can render text illegible
• Any graphics included in an experience have an
intended learning purpose, if they’re imperceptible,
we risk learners missing parts of the experience.
Particularly key for:
• People with visual impairments, such as colour
blindness

13. What it
is
Using colours that compliment one
another and don’t blend together.
Avoiding colours that are “too stark”, like
pure black on pure white, instead using
muted versions, such as cream on dark
blue.
Avoiding colours being sole indicators,
such as to denote status, integrate text
and symbols to ensure everyone can
understand the message.

14. Keep in
mind
• If your brand colours aren’t set up for accessibility,
can different gradients be used?
• Do the visuals all support the learning, are any of
them a distraction?
• Sometimes we do need to add extra visuals for
decoration to prevent a screen looking bland, need to
balance engagement with clarity

15. Fixing the visual design of the
example

16. Text and
formatting

17. Why it’s
important
• Lack of clarity risks learners not being able to
understand essential information
• People are time-poor; they’re likely to bypass
information that’s difficult to comprehend
Particularly key for:
• Visual disabilities and impairments
• Neurodiverse individuals
• Learning disabilities and
impairments

18. What it
is
Using accessible fonts, such as sans-serif
Using optimal line spacing (1.5x)
Using large, legible font sizes no smaller
than 12-14pt.
Avoiding formats like italics, instead use
bold text for emphasis
Accessible language, like ‘select’ instead
of ‘click’, clear button wording, etc.
A
A

19. Keep in
mind
• Does the screen look really text heavy and off
putting?
• There’s no point writing things if people can’t
comprehend them, it’s better to say less in a
clear way.

20. Reformatting and rewriting the example

21. The before and after of
accessible design

22. Multi-optionality

23. Why it’s
important
• Some modes of delivery are completely inaccessible
for different disabilities and impairments
• Different environments for learning can impact the
ability to consume certain modes
• Everyone has preferences for how they explore and
acquire new knowledge
Particularly key for:
• Visual disabilities and impairments
• Hearing disabilities and impairments
• Neurodiverse individuals
• Learning disabilities and impairments

24. What it
is
Alternative (alt.) text for any visuals,
offering screen reader compatibility
Transcripts for any audio or video
Subtitles/closed captions/open captions
for any videos or audio, and
recognising the differences
Audio alternatives to text on screen

25. Keep in
mind
• If someone is missing/has an impaired sense, could
they still explore the course?
• Harness technological innovations to make some
aspects more efficient if cost/time is a key limitation .
There are lots of tools for things like generating
captions and transcripts.

26. Tools to make
accessible design
simple

27. Why it’s
important
• Accessible design is just good design, it improves
the experience for all, not just those with specific
requirements
• Authoring tools have streamlined the accessible
development process – maximising their potential
is crucial for designing a truly accessible solution
There’s a huge, huge variety of different
disabilities and impairments, the more our
solutions cover, the more accessible they are.

28. What it
is
Tools like Storyline have built-in
functionalities to support accessible
design, many of which are simple
toggle on or off.
WebAIM contrast checker
Eight shapes brand colour contrast checker
Text on image colour contrast checker
Download NVDA Screen reader and the
accompanying NVDA user guide
Hemingway readability checker
WebFX readability checker
DE&I Imagery Toolkits
Recognising that the WCAG guidelines
were built for websites not digital
learning, Designing accessible learning
content, written by Susi Miller simplifies
the approach to accessible learning
design.

29. Keep in
mind
• Research the tools you most often use, to see what built-in
accessibility they have – often, it’s more than you think!
• Better to have some than none – in an ideal world would all
be accessible to everyone, but better to do the bits we can
when it’s as simple as toggling a button on/off, if more
intense elements are out of reach

30. Accessible design is just GOOD design
• The more accessible a solution is the more confident you can be in
your people’s ability to learn and comply.
• You might not be able to do it all, but something is better than
nothing!
• The range of requirements is huge, consider how every decision
could impact different people.
• People’s requirements vary based on condition and personal
preference, where possible give your people the autonomy to
choose what works for them.
• Accessible design makes learning better for everybody.

31. Stay Connected
CONNECT
WITH
JUSTINE
CONNECT
WITH
LUCINDA