From the Trenches: Building the Accessible Web

1,541 views

Published on

Jon Reid, Senior Developer at EffectiveUI, presented "From the Trenches: A Practical Approach to Building the Accessible Web" at Accessing Higher Ground 2010, an accessible media, web and technology conference hosted by the University of Colorado at Boulder.

Published in: Technology, Design
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total views
1,541
On SlideShare
0
From Embeds
0
Number of Embeds
182
Actions
Shares
0
Downloads
4
Comments
1
Likes
2
Embeds 0
No embeds

No notes for slide

From the Trenches: Building the Accessible Web

  1. 1. A PRACTICAL APPROACH TO BUILDING THE ACCESSIBLE WEB From the Trenches Jon Reid | Senior Developer
  2. 2. A little about me: Senior Developer at EffectiveUI HTML, CSS, and Java Script Lead • Agencies: EffectiveUI, Crispin Porter + Bogusky, Texturemedia • Business: Core Business Solutions, Western Union • Science: Genomica, Joint Institute of Laboratory Astrophysics From The Trenches | A practical approach to building the accessible web
  3. 3. Web Project Dynamics From The Trenches | A practical approach to building the accessible web Traditional Dynamic Stakeholders1 2 3 Designers Developers
  4. 4. How does accessibility fall by the wayside? From The Trenches | A practical approach to building the accessible web • Discussions become too abstract • People start throwing up roadblocks
  5. 5. STAKEHOLDER ROADBLOCKS How does accessibility fall by the wayside? "It's too expensive"1 2 3 "We don't need to be accessible" "That's not our audience" From The Trenches | A practical approach to building the accessible web
  6. 6. DESIGNER ROADBLOCKS How does accessibility fall by the wayside? "It’s too limiting"1 2 3 "What about the least common denominator" "It will be ugly" 4 "It will be boring" From The Trenches | A practical approach to building the accessible web
  7. 7. DEVELOPER ROADBLOCKS How does accessibility fall by the wayside? "No technology support"1 2 3 "Restricts our implementation" "It’s too hard and takes too long" From The Trenches | A practical approach to building the accessible web
  8. 8. Bull.You CAN do it all. From The Trenches | A practical approach to building the accessible web
  9. 9. Keep It Real • Focus on requirements • Create achievable goals • Perfection is unnecessary From The Trenches | A practical approach to building the accessible web
  10. 10. ADVANTAGES Keeping it real Defines the risks and returns1 2 3 Informs decisions Provides transparency helps the stakeholder From The Trenches | A practical approach to building the accessible web
  11. 11. ADVANTAGES Keeping it real Defines creative scope1 2 Focuses the design process helps the designer From The Trenches | A practical approach to building the accessible web
  12. 12. ADVANTAGES Keeping it real Guides technological decisions1 2 3 Defines constraints Creates tangible goals helps the developer From The Trenches | A practical approach to building the accessible web
  13. 13. Progressive Enhancement From The Trenches | A practical approach to building the accessible web A useful framework for implementing accessibility
  14. 14. Progressive Enhancement Internet Explorer 8 | Microsoft CSS3 example From The Trenches | A practical approach to building the accessible web Firefox | Mozilla Chrome | Google
  15. 15. Internet Explorer 8 | Detail Chrome | Detail
  16. 16. Progressive enhancement throughout a project From The Trenches | A practical approach to building the accessible web • Define requirements • Create audit trail • Focus on specifics
  17. 17. HERE’S HOW IT WOULD GO Define accessibility requirements1 2 3 Create audit trail Focus on technological requirements early in project Progressive Enhancement during the definition phase From The Trenches | A practical approach to building the accessible web • Explains decisions • Demonstrates efforts
  18. 18. HERE’S HOW IT WOULD GO Maintain audit trail for relevant requirements1 2 3 Simple progressive enhancement notes Don’t wireframe every progressive state Progressive Enhancement during design From The Trenches | A practical approach to building the accessible web
  19. 19. HERE’S HOW IT WOULD GO Continue to maintain audit trail1 2 3 Implement accessibility requirements Use audit trail as base for Quality Assurance testing Progressive Enhancement during development From The Trenches | A practical approach to building the accessible web
  20. 20. Real Life Example From The Trenches | A practical approach to building the accessible web Project Pensacola: a new website for the Blue Angels
  21. 21. Blue Angels | Vision Demo
  22. 22. Blue Angels | Home Page Example
  23. 23. Accessibility Structure | Home Page Example Blue Angels | Home Page Example
  24. 24. Blue Angels | Team Example
  25. 25. Accessibility Structure | Team Example Blue Angels | Team Example
  26. 26. Blue Angels | Media Example
  27. 27. Accessibility Structure | Media Example Blue Angels | Media Example
  28. 28. Blue Angels | Aircraft Example
  29. 29. Accessibility Structure | Home Page Example Blue Angels | Home Page Example
  30. 30. Blue Angels | Informational Example
  31. 31. Accessibility Structure | Informational Example Blue Angels | Informational Example
  32. 32. Thank You and Questions

×