Getting Started With Accessibility: Top Tips and Best Practices
1. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Kevin Rydberg
Senior eAccessibility Consultant, Siteimprove, Inc.
Keith Bundy
Assistant Dean for Student Development, Dakota State University
Kevin Rydberg
Senior eAccessibility Consultant
Siteimprove, Inc.
Minneapolis, MN
kry@siteimprove.com
@rydbergk
Keith Bundy
Assistant Dean Student Development/ ADA Coordinator
Dakota State University
Madison, SD
keith.bundy@dsu.edu
Tuesday, October 8, 13
2. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Tuesday, October 8, 13
3. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Tuesday, October 8, 13
4. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Tuesday, October 8, 13
5. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Tuesday, October 8, 13
6. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
What is the most popular and widely used assistive device ever created?
h"p://www.slideserve.com/jennelle/dhs-‐s-‐department-‐wide-‐governance-‐of-‐508-‐compliance
Tuesday, October 8, 13
7. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
What is the most popular and widely used assistive device ever created?
Glasses!
(and contact lenses)
h"p://artprimo.com/forums/trailer_park_boys-‐t1217.html
h"p://www.slideserve.com/jennelle/dhs-‐s-‐department-‐wide-‐governance-‐of-‐508-‐compliance
Tuesday, October 8, 13
8. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Kevin Rydberg
• Senior eAccessibility Consultant, Siteimprove, Inc.
• Web Strategist, E-Communications, Dakota State University
• Web Communications Coordinator, Mayo Clinic
• Over 12 years in Web design, development and consulting
Tuesday, October 8, 13
9. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Kevin Rydberg
• Why Digital Accessibility?
Tuesday, October 8, 13
10. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Kevin Rydberg
• Why Digital Accessibility?
Accessibility is about people.
Tuesday, October 8, 13
11. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
We need to educate.
Kevin Rydberg
• Why Digital Accessibility?
Tuesday, October 8, 13
12. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
We need to offer solutions.
Kevin Rydberg
• Why Digital Accessibility?
Tuesday, October 8, 13
13. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Keith Bundy
• Assistant Dean for Student Development
• Dakota State University ADA Coordinator
• Barrier Free Learning Committee Chair
• Classroom instructor
Tuesday, October 8, 13
14. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Tuesday, October 8, 13
15. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Keith Bundy
• Assistant Dean for Student Development
• Dakota State University ADA Coordinator
• Barrier Free Learning Committee Chair
• Classroom instructor
Tuesday, October 8, 13
16. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Keith’s site review
• www.monstersuniversity.com
h"p://monstersuniversity.com/edu/
Tuesday, October 8, 13
17. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Web accessibility refers to “the practice of making
websites usable by people of all abilities and
disabilities.” http://en.wikipedia.org/wiki/Web_accessibility
Tuesday, October 8, 13
18. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Pareto Principle
Tuesday, October 8, 13
19. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
The Pareto principle (also known as the 80–20 rule) states that,
for many events, roughly 80% of the effects come from 20% of
the causes.
http://www.nytimes.com/2008/03/03/business/03juran.html?_r=0
Pareto Principle
20%80%
Tuesday, October 8, 13
20. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Where do I start?
Tuesday, October 8, 13
21. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Know the rules
• Know how to fix the problems
• Your institution’s guidelines
• Federal guidelines
• Section 508
• WCAG 2.0
Tuesday, October 8, 13
22. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Section 508
• US only
• Goes beyond web accessibility
• Based on WCAG 1.0
• Currently being reviewed for updated criteria
• SSB BART GROUP
• https://www.ssbbartgroup.com/blog/2013/01/23/section-508-refresh-timing-projections/
Tuesday, October 8, 13
23. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
WCAG 2.0
• Created by WAI (Web Accessibility Initiative) of the W3C
• Guidelines are grouped by priority, A, AA, AAA
• WCAG 2.0 AA guidelines are a great place to start
Tuesday, October 8, 13
24. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://coding.smashingmagazine.com/2009/04/08/from-‐table-‐hell-‐to-‐div-‐hell/
Where do I start?
Semantic Markup
• Mark up with tags that describe the type of content
• Not for presentation, but structure
• Many benefits to semantic markup
Tuesday, October 8, 13
25. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Coding for accessibility sucks.
Where do I start?
Tuesday, October 8, 13
26. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
There’s no such thing as a fully
accessible website.
Where do I start?
Tuesday, October 8, 13
27. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Just because you have an (mostly)
accessible site, doesn’t mean you
have a usable site.
Where do I start?
Tuesday, October 8, 13
28. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Campus Disability Services
• Find testers with disabilities
• Alternative funding
Where do I start?
Tuesday, October 8, 13
29. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Low hanging fruit
• Include files
• CSS
• Alt text
• Define the language of the website
• Skip links
Where do I start?
Tuesday, October 8, 13
30. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
High traffic pages
• Top-level pages
• Portal pages
• Landing pages
Where do I start?
Tuesday, October 8, 13
31. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
“A” level errors first
• Titles
• Semantic mark up (h1-h6)
• Alt tags
• Decorative images
Where do I start?
Tuesday, October 8, 13
32. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
“A” level errors first
body {
background:#999 url('/css/images/homepage-bg.png')repeat;
}
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Where do I start?
<img src=”box-edge-bottom.jpg” alt=”“ />
Tuesday, October 8, 13
33. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Form elements
• Labels
• Descriptive titles
• Tab order
Where do I start?
Tuesday, October 8, 13
34. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Redesign
• Templates
• Semantic markup
• Clean CSS
• Responsive sites
Where do I start?
Tuesday, October 8, 13
35. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Dev Server
• Catch problems before they go live
Where do I start?
Tuesday, October 8, 13
36. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Role-based staff training
• Non-technical Staff -- editors, managers
• Developers
• Designers
Where do I start?
Tuesday, October 8, 13
37. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
h"p://blogs-‐images.forbes.com/work-‐in-‐progress/files/2012/09/Strategy.jpg
Let your CMS do the work
• Set up custom toolbars
• Enforce proper coding, headings, lists, alt tags
• Your website is not a Word document!
Where do I start?
Tuesday, October 8, 13
38. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
For Americans without disabilities, technology
makes things easier. For Americans with disabilities,
technology makes things possible.
Mary Pat Radabaugh
“Study on the Financing of Assistive Technology
Devices & Services for Individuals with Disabilities”
h"p://www.slideserve.com/jennelle/dhs-‐s-‐department-‐wide-‐governance-‐of-‐508-‐compliance
Tuesday, October 8, 13
39. Getting Started With Accessibility
siteimprove.com 1-855-SITEIMPROVE kry@siteimprove.com @rydbergk #a11y #heweb13
Questions?
Thank You!
Kevin Rydberg
Senior eAccessibility Consultant
Siteimprove, Inc.
Minneapolis, MN
kry@siteimprove.com
@rydbergk
Tuesday, October 8, 13