Accessibility & Design - How to Create the Best Online Experience

You may have heard of the benefits of accessibility or know you need to prioritize it in your work. But you’re a little confused on what that means, where to start, and what steps you need to take.

This session will clear up confusion and help you speak confidently about accessibility by providing:
- An overview of accessibility in today’s digital landscape
- An understanding of why it is important for government and non-governmental organizations.
- A recommendation on what level of accessibility you need.
- An understanding of what it means at every stage of your project, from discovery to design to delivery.
- Practical advice so you can start improving your accessibility today.
- Tips on how to build your team’s passion for accessibility.

By the end of this session, you will have the right knowledge and tools to take immediate steps towards turning accessibility challenges into solutions.

Presented at Drupal GovCon 2019 with Kim Locraft.

Transcript

1. Accessibility & Design
2. Kim Locraft Design Director klocraft@forumone.com Courtney Clark VP of Design cclark@forumone.com Nice to meet you!
3. About Forum One We create experiences that make an impact.
5. What about you?
6. Diving, Flying, and Accessibility
7. Everyone access use equally Digital Accessibility
8. It’s about people Source: Graphics courtesy of Microsoft’s Inclusive Design project and Dribbble
9. Today’s Agenda 5 tips 3 case studies 1 goal
10. TIP #1 Design to the edges
15. Design to the Edges in the Air Force
16. Design to the Edges in digital
17. Vision Hearing Physical Mobility Cognitive Categories that affect how people use & experience digital services:
18. Vision
19. Hearing
20. Physical / Motor
21. Cognitive
22. Let’s define the edges
23. Low Average High Vision Hearing Motor Cognitive
24. Vision Hearing Motor Cognitive Low Average High
25. Vision Hearing Motor Cognitive Low Average High
26. Vision Hearing Motor Cognitive Low Average High
27. Vision Hearing Motor Cognitive Low Average High
28. Vision Hearing Motor Cognitive Low Average High
29. Vision Hearing Motor Cognitive Low Average High
30. Vision Hearing Motor Cognitive Low Average High
31. Vision Hearing Motor Cognitive Low Average High
32. Vision Hearing Motor Cognitive Low Average High
33. Focus on people first...then learn the rules. Tip 2
34. Web Accessibility Perspectives
35. TIP #3 time money Bake it into your existing process
36. — Pacific Whale Conservancy We LOVE our new website. We came in on time and under budget. I can’t wait for the donations to come pouring in! “
37. — Disappointed Whale Advocate Dear PWC, I wasn’t able to complete my donation online. I use a screen reader and a keyboard to navigate. “
38. Audit results: ❏ Keyboard traps ❏ Tab order is not intuitive ❏ Images & icons are missing alt text. ❏ Empty links ❏ Screen reader isn’t recognizing headings ❏ Images of text ❏ Content is cluttered. Text hard to read. ❏ Too many calls to action ❏ Color contrast issues
39. The issues were fixed, but at a cost of 3 additional months for rework.
40. Now let’s bake accessibility in
41. Georgetown Institute for Women, Peace and Security
42. “ “This is the first site that passed the strictest accessibility standards at Georgetown.” Georgetown Institute for Women, Peace and Security
43. Accessibility doesn’t just happen. It takes intention and a team.
44. TIP #4 Accessibility is a team sport.
45. Who’s primarily responsible for accessibility? My question
46. Who’s primarily responsible for accessibility? My question Developers of course! Common answer
47. Who’s primarily responsible for accessibility? My question Developers Designers Project Managers Content Creators Product Owners Actual answer
48. Who’s primarily responsible for accessibility? My question YOU ARE! The only answer
49. Let’s all skate!
50. Developers Build so that people on the edges have options. You should: semantic markup Test often what you need
51. User Experience (UX) Designer Design for all user types, including those on the edges. You should: Adopt an inclusive design approach; Include diverse set of people in your research Document order
52. UX + Accessibility Source: https://inclusivedesignprinciples.org
53. Visual Designer Create clean and clear solutions. You should: Learn about the range of disabilities options that are accessible try new things
54. Design + Accessibility Source: https://ukhomeoffice.github.io/accessibility-posters/posters/accessibility-posters.pdf
55. Content Creators Ensure content is easier for everyone to read and understand. You should: Write alt text Write at a 5-6th grade level Write clear, informative headlines
56. Project Managers Team Captain. Ensure accessibility is happening at every stage of the project. You should: Address accessibility in the kickoff accessibility as a product requirement Bring in accessibility experts
57. Product Owner • Client Make accessibility a priority. You should: State your accessibility standards Ask vendors Add accessibility testing accessibility champion
58. TIP #5 Aim for better, not perfect.
59. Julia Stash
61. Accessibility Journey 2016 2016 2017 2018 2019 Commitment & Scan
62. Accessibility Journey 2017 2016 2017 2018 2019 Phased Approach • •
63. Accessibility Review
64. Accessibility Journey 2018 2016 2017 2018 2019 Content Focus • •
65. Accessibility Journey 2019 2016 2017 2018 2019 Testing & Extension • • •
66. Just start!
67. We have the power to remove barriers
68. Questions?
69. Kim Locraft Design Director klocraft@forumone.com Courtney Clark VP of Design cclark@forumone.com Thank you! Let’s connect!
70. Thank you!