Last year Erudite published the UK Accessibility Benchmark, which looked at the UK's most popular websites and assessed compliance against WCAG Accessibility Criteria. This talk will dive into some of the most common issues we encountered, and give you practical examples to help you identify and resolve accessibility issues on your own site!

1. Make Your Site More
Accessible!
Jessica James | Erudite
@Jessica_James01

2. Hi, I’m Jess,
Account
Director at
Erudite”
Jessica James
Account Director &
Nerd
Jess worked in Digital
Marketing roles for 5 years
before specialising in SEO
in 2018. Since then, she’s
become increasingly
fascinated by user
experience and inclusive
design.
@Jessica_James01 #BrightonSEO

3. Who does it impact?
Why be accessible?
What is accessibility?
1
.
2
.
3
.
I’m Going to
Cover…
How to make our sites more
accessible
4
.
@Jessica_James01 #BrightonSEO

4. B R I G H T O N S E O J U L Y 2 0 2 1
What is
Accessibility
?
01
@Jessica_James01 #BrightonSEO

5. Web accessibility is the inclusive
practice of ensuring there are no
barriers that prevent interaction
with, or access to, websites on the
Web by people with physical
disabilities, situational
disabilities, and socio-economic
restrictions on bandwidth and
speed.”
@Jessica_James01 #BrightonSEO

6. In Order to be Accessible, All Users
Should be Able to…
Perceive
Understand
Navigate
Interact
@Jessica_James01 #BrightonSEO

7. B R I G H T O N S E O J U L Y 2 0 2 1
Who Does it
Impact?
02
@Jessica_James01 #BrightonSEO

8. Sensory (visual, auditory)
Cognitive (thinking, communication)
Motor (locomotion, fatigue, dexterity)
@Jessica_James01 #BrightonSEO

9. Most Likely to Be
Impacted
Visual
1.7m
Hearing
1.8m
Manual Dexterity
3.7m
Neuro-diverse
3.2
m
@Jessica_James01 #BrightonSEO
The Clickaway Pound

10. Accessibility Impacts People with
Disabilities
@Jessica_James01 #BrightonSEO

11. Situational (crowded public space, lost
headphones)
Temporary (carpal tunnel, concussion)
Socio-economic (limited access to top-end
devices or fast Wi-Fi)
@Jessica_James01 #BrightonSEO

12. Accessibility Impacts People with
Disabilities
@Jessica_James01 #BrightonSEO
Accessibility Impacts Everyone

13. B R I G H T O N S E O J U L Y 2 0 2 1
Why Be
Accessible?
03
@Jessica_James01 #BrightonSEO

14. @Jessica_James01 #BrightonSEO
Great User Experience
Accessibility is great user experience
We know that great user experience is becoming
increasingly important in SEO
It stands to reason that improving Accessibility will
have long-term SEO benefits

15. @Jessica_James01 #BrightonSEO
Brand Favour
Making your content easy to
access builds brand loyalty

16. @Jessica_James01 #BrightonSEO
You are Legally Obliged
The Equality Act 2010 (UK) requires site owners to
make reasonable adjustments to make sites more
accessible.
In the US there were over 3,500 web accessibility
lawsuits in 2020.

17. @Jessica_James01 #BrightonSEO
You are Legally Obliged

18. £17.1 billion
Lost every year due to
inaccessible websites
@Jessica_James01 #BrightonSEO
The Bottom Line
The Clickaway Pound, 2019

19. B R I G H T O N S E O J U L Y 2 0 2 1
How to be
More
Accessible?
04
@Jessica_James01 #BrightonSEO

20. Accessible Images
Improving Colour Contrast
1
.
2
. Accessible Navigation
3
.
@Jessica_James01 #BrightonSEO
Tone of Voice
4
.

21. @Jessica_James01 #BrightonSEO
Improving Colour Contrast
Low colour contrast impacts everyone
Test for low colour contrast using the WAVE Chrome
extension or the WCAG Colour Contrast Checker (WebAIM)
Who?
How?

22. @Jessica_James01 #BrightonSEO
Improving Colour Contrast

23. @Jessica_James01 #BrightonSEO
Improving Colour Contrast

24. @Jessica_James01 #BrightonSEO
Improving Colour Contrast
Test changes in Google
Optimize first to build a
business case!

25. @Jessica_James01 #BrightonSEO
Accessible Images
Overlay your text with HTML
Embed text within images, or use images of text
Do
Don’t

26. @Jessica_James01 #BrightonSEO
Accessible Images

27. @Jessica_James01 #BrightonSEO
Accessible Images Alt Text
Provide useful alt text when it’s appropriate to the user
Stuff every alt text field with keywords
Do
Don’t

28. @Jessica_James01 #BrightonSEO
Accessible Images Alt Text

29. @Jessica_James01 #BrightonSEO
Accessible Images Alt Text
“Cooking experience setting with captions What’s my
Introduction? and Make a Simple shopping list.”
“Cooking Station”
Helpful
Unhelpful

30. @Jessica_James01 #BrightonSEO
Accessible Images Colour Coding
Include a second point of differentiation if colour coding
information (patterns, underline, labels, HTML table of
supporting data)
Use colour alone to convey meaning.
Do
Don’t

31. @Jessica_James01 #BrightonSEO
Accessible Images Colour Coding

32. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard
Test navigating around your site using your keyboard. Can
you move around easily? Fill out forms and interact with
elements?
Assume all of your users use a mouse.
Do
Don’t

33. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard

34. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard
Make sure your site has visible focus indicators with sufficient colour
contrast when you navigate with a keyboard.
Do

35. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard
Make sure you have a functioning skip-link on all pages.
Keyboard users don’t have to tab through your whole header
before they can get to the main content.
Do
Don’t

36. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard
• Tab key – skip link appears
• Enter key – focus skips
over the header and moves
down to the main content.
Focus means both;
- the content in the
viewport
- keyboard focus

37. @Jessica_James01 #BrightonSEO
Accessible Navigation Keyboard
• Tab key – no skip link
• Have to tab 11 times to
reach main content of the
page!

38. @Jessica_James01 #BrightonSEO
Accessible Navigation Links
Use descriptive link text that describes the action the user is
about to make
Do
Don’t Click here, see more, explore

39. @Jessica_James01 #BrightonSEO
Accessible Navigation Links

40. @Jessica_James01 #BrightonSEO
Tone of Voice
• Use plain language wherever possible
• Avoid figurative speak
• Minimise use of jargon
• Explain acronyms the first time you use them
• Remember, not all of your users will be reading it in their
first language, or may be using Google Translate.
Do

41. @Jessica_James01 #BrightonSEO
Google Translate doesn’t always get it right

42. B R I G H T O N S E O J U L Y 2 0 2 1
Final Note.
05
@Jessica_James01 #BrightonSEO

43. @Jessica_James01 #BrightonSEO
- Tim Berners-Lee
The power of the Web is in its universality.
Access by everyone regardless of
disability is an essential aspect.”

44. Erudite Agency Ltd 2010-2020 ©
jess.james@erudite.agency
Thank you.
+44 (0) 1256 384890