This presentation shares actionable tips and resources for making your communications and digital content more inclusive of people with disabilities by applying the basic principles of web accessibility. Presented at the 2016 Nonprofit Technology Conference.

1. #16NTCa11ySession hashtag: #16NTCa11y
March 25, 2016
BJ Wishinsky, Benetech
Chad Leaman, Neil Squire Society
#AccessibilityRocks
Make Your Social Media More Inclusive Today

2. #16NTCa11y
Collaborative Notes: http://po.st/a11y-16NTC
Evaluation Survey: http://po.st/ezpGTv
Housekeeping

3. #16NTCa11y
Why We’re Here
“The power and promise of social media is still out of reach for some people with
disabilities who do not have the same ease-of-use and benefits as non-disabled
users.” - Alice Wong in Model View Culture
• While social platforms work to improve their accessibility, we can make our
social content more accessible today.
• Accessibility improves usability for everyone think curb cuts!)
• Bonus: Making social content accessible improves SEO!

4. #16NTCa11y
flickr.com/photos/tags/a11ylogo
Social media is constantly changing, so we are all learning. Let’s learn together!
• We’ll focus on content, because that’s what we can control.
• Share your questions and experiences.
• What do you most want to learn?
Check In

5. #16NTCa11y
The Principles of Accessibility from WCAG 2.0:
• Perceivable
• Operable
• Understandable
• Robust
BJ POURs it On

6. #16NTCa11y Source: IconsDB
“Create content that can be presented in different ways, including by assistive
technologies, without losing meaning.” - WCAG
Available through sight, hearing, or touch.
• Alternative text.
• Maximize contrast.
• Captions and subtitles.
• Transcripts.
Perceivable

7. #16NTCa11y
Source: IconsDB
Primarily the responsibility of the social network platform (same is true for Robust).
For GIFs and video:
• Give users enough time to read and absorb content.
• Do not use flashing content that can cause seizures.
Learn more: WCAG 2 at a Glance
Operable

8. #16NTCa11y
Source: IconsDB
User friendly, easy to comprehend:
• Use clear language.
• Use simple and concise wording.
• Provide alternative formats.
• Use fonts designed for onscreen viewing.
Learn more: Cognitive Accessibility
Understandable

9. #16NTCa11y
URLS and Hashtags
People who are blind use screen readers (synthesized speech) or refreshable
braille displays to access online content.
• Use a URL shortener so the screen reader doesn’t recite the whole URL.
• Use Camel Case (Initial Caps) when multiple words are combined.
• Use full words in hashtags where possible.
• The # on your hashtag will not be pronounced.

10. #16NTCa11y
If there is text in the image,
provide it in the description as
well.
• Use embedded text sparingly.
• Use follow on tweets or link to
a page with full text if it’s long.
• Better still, don’t put long text
in images.
Alternative Text

11. #16NTCa11y
From National Federation of the Blind:
• Describes what’s most important to
their audience.
View on Twitter.
Twitter Example

12. #16NTCa11y
On Facebook, Pinterest, and Instagram
there is room for:
• The text embedded in the image.
• Description of the image.
• Call to Action with web link.
View on Pinterest
Pinterest Example

13. #16NTCa11y
Source: Wikimedia Commons
Make sure that colors are not your only
method of conveying information.
• Combine with patterns or symbols to
differentiate objects.
• View in grayscale or use online tools to
check contrast.
Source: WebAIM
Color Perception

14. #16NTCa11y
How to create an accessible infographic
Really?
Yes!
Source: Access iQ™
Accessible Infographics

15. #16NTCa11y
Transcripts and captions are not only useful for alternative access!
• Language learners.
• Translation.
• Study & review.
Audio

16. #16NTCa11y
Chad shows you how it’s
done!
Video Caption
Work Flow

17. #16NTCa11y
1. Fiverr

18. #16NTCa11y
2. Transcript

19. #16NTCa11y
3. YouTube Caption portal

20. #16NTCa11y
4. YouTube Caption Editor

21. #16NTCa11y
5. Get SRT file out for facebook

22. #16NTCa11y
Example of podcast with transcript

23. #16NTCa11y
Thank You for Joining Us!
Please complete the feedback survey for this session
• http://po.st/ezpGTv
• Can be found in both the mobile app and on the website listing.
Thank you for caring about accessibility. You Rock!

24. #16NTCa11y
Contact Info
BJ Wishinsky, Social Media Manager, Benetech
email: bjw[at]benetech.org
web: benetech.org
@leapingwoman
Chad Leaman, Director of Development, Neil Squire Society
email: chadl[at]neilsquire.ca
web: neilsquire.ca
@chadleaman

25. #16NTCa11y
Appendix:
Resources
POUR Principles
Social Network Accessibility
Color Contrast Checkers
Additional Resources

26. #16NTCa11y
Resources: POUR Principles
Web Content Accessibility Guidelines (WCAG) 2.0
WebAIM:
• Visual Accessibility
• Auditory Accessibility
• Cognitive Accessibility

27. #16NTCa11y
Resources: Social Network Accessibility
Major social network accessibility initiatives:
• Facebook page @FBAccess
• Twitter web @a11yTeam
• YouTube, Google+ web @GoogleAccess
• WordPress web @WPAccessibility

28. #16NTCa11y
Resources: Color Contrast Checkers
• SBF Color Checker
• Color Contrast Calculator
• Snook Color Contrast Checker
• WebAIM: Color Contrast Checker

29. #16NTCa11y
Additional Resources
• Federal Social Media Accessibility Toolkit
• Media Access Australia: Social Media for People with a Disability
• Diagram Center: Making Images Accessible
• Social Media and Accessibility: Resources to Know
• Content marketers ignore accessibility at their peril