Surprisingly, some of the signature a11y best practices happen to have a positive impact on the carbon/resources footprint of a Website. How can it be? This presentation explores this question, showcasing 3 emblematic accessibility recommendations that will make your Website more environment-friendly.

1. Be Green, Be Accessible
Green Code Lab Challenge - 2014
Olivier Nourry - @OlivierNourry

2. WHO’S THAT GUY?
2

3. Accessibilista
• Active in Web Accessibility since 2006
• Full time job since 2008
• Currently Head of Accessibility at
V-Technologies (@VTechFr)
• Blogger, Tweeter and Speaker
@OlivierNourry – Head of Accessibility at @VTechFr 3

4. WEB ACCESSIBILITY –
WHAT IS IT?
4

5. Web Accessibility (#a11y) in short
The art of making Web content Perceivable,
Operable, Understandable to all users,
including those with disabilities.
@OlivierNourry – Head of Accessibility at @VTechFr 5

6. A minor issue?
15 to 20% of people have 1 or more disabilities
that affect their daily lives.
This rate should increase over time.
@OlivierNourry – Head of Accessibility at @VTechFr 6

7. Disabilities?
Situations where the user:
• does not see, or not well enough
• does not hear, or not well enough
• does not use a mouse, or a keyboard, or
both
• does not understand, memorize, or focus
well enough
@OlivierNourry – Head of Accessibility at @VTechFr 7

8. DISABILITY SITUATIONS
They happen more
often than you would
think
8

9. Mobile users
@OlivierNourry – Head of Accessibility at @VTechFr 9

10. Senior users
@OlivierNourry – Head of Accessibility at @VTechFr 10

11. Noobs
@OlivierNourry – Head of Accessibility at @VTechFr 11

12. Edge cases
@OlivierNourry – Head of Accessibility at @VTechFr 12

13. THE WEB’S IMPACTS ON
ENVIRONMENT
Quick reminders
13

14. Each time you open a web page…
…you start a chain of energy consumption.
Local
network
Your
device
ISP
DNS
Data
centers
Infrastructure
@OlivierNourry – Head of Accessibility at @VTechFr 14

15. Rules of thumb
• More data  more energy.
• More files  more energy.
• More time spent by user  more energy.
It has been estimated that Web design is responsible
for 40% of the Web’s carbon footprint.
@OlivierNourry – Head of Accessibility at @VTechFr

16. ACCESSIBILITY TO THE
RESCUE
3 accessibility best
practices that can
reduce your carbon
footprint.
16

17. #1: Separate content and
presentation
= content in HTML only, style in CSS only.
= =
@OlivierNourry – Head of Accessibility at @VTechFr

18. Why?
Users should be able to customize presentation
@OlivierNourry – Head of Accessibility at @VTechFr

19. Green benefits?
• Lighter HTML files
 less data transferred
• CSS files can be cached (browser, server)
 fewer server requests
• Pages displayed faster
 less time lost on the user’s end
@OlivierNourry – Head of Accessibility at @VTechFr

20. Win + Win + Win
User

Site Owner

Planet

•Customizable
•Faster
•More
maintainable
•Fewer
resources
•Smaller
carbon
footprint
@OlivierNourry – Head of Accessibility at @VTechFr

21. #2: Help users avoid and
correct mistakes
= When you design forms:
• Clarify the purpose and function of the form
• Provide clear labels for fields, field sets and buttons
• Provide useful instructions before submission
• Provide clear error messages and ease the
correction process
• Leave enough time for the user to fulfill the task
@OlivierNourry – Head of Accessibility at @VTechFr

22. Why?
• Non-visual navigation requires correctly labeled
elements and clear interactions
• Cognitive disorders like dyslexia, short-term
memory loss, attention deficit disorders, etc. are
relieved by clear instructions
• Newcomers, senior users, need to be reassured and
guided
• Users with vision or motor impairments may need
more time to fill forms
@OlivierNourry – Head of Accessibility at @VTechFr

23. Green benefits?
• Fewer errors
 fewer server requests.
• Better guidance and assistance
 less time lost on the user’s end.
@OlivierNourry – Head of Accessibility at @VTechFr

24. Win + Win + Win
User

Site Owner

Planet

•Better UX
•More
productivity
•Better
engagement
•Fewer
resources
•Smaller
carbon
footprint
@OlivierNourry – Head of Accessibility at @VTechFr

25. #3: Provide transcripts of
video and audio content
Transcript = text describing visible and audible
information contained in a video or audio.
@OlivierNourry – Head of Accessibility at @VTechFr

26. Why?
• Make information available to users
who cannot see or hear content
• Make information available to users
who cannot play the video
• For some types of content,
text is more usable (and useful) than video
@OlivierNourry – Head of Accessibility at @VTechFr

27. Green benefits?
• Same information, for only a fraction of the size
 (far) less data transferred.
• Reading can be faster and more efficient than
watching
o less time lost on the user’s end.
• Text can be read on any device
o Less demanding from a technological point of view.
@OlivierNourry – Head of Accessibility at @VTechFr

28. Win + Win + Win
User

Site Owner

Planet

•More options
•Can translate
•Can reuse
•Content
enhancement
•SEO
•Smaller
carbon
footprint
@OlivierNourry – Head of Accessibility at @VTechFr

29. ADVERSE EFFECTS?
29

30. A few best practices incur
more data
• Subtitles
• Audio-descriptions
• Sign language videos
But it’s a small price to pay for digital inclusion.
@OlivierNourry – Head of Accessibility at @VTechFr

31. Thank you!
31