Adding Guerilla Accessibility Testing to Your Development Process

583 views

Published on

Published in: Design, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
583
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
7
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Adding Guerilla Accessibility Testing to Your Development Process

  1. 1. Adding Guerrilla Accessibility Testing to Your Development Process
  2. 2. PHASE2’S ACCESSIBILITY APPROACH OUR PHILOSOPHY & GOALS
  3. 3. PHASE2 ACCESSIBILITY APPROACHOur Philosophy• Shared Experiences• Focus on Usability• Beyond Box-Checking
  4. 4. PHASE2 ACCESSIBILITY APPROACHGoal: Build software for clients that achieves two objectives: 1. Backend: Enable content creators, editors, and staff who use assistive technology to create and manage content on the platform. 2. Frontend: Instill confidence that configuration of new website pages, elements, and content will be Section 508 Compliant and carry WCAG 2.0 Best Practices.
  5. 5. PHASE2 ACCESSIBILITY APPROACHThought leadership• In-house accessibility expert• Implementing best practicesInternal Investment on Products• OpenPublic built with accessibility at the core
  6. 6. WHY ACCESSIBILITY?
  7. 7. WHAT “ACCESSIBILITY” REALLY MEANSSection 508 may be a set of rules. But to effectivelyimplement best practices, it’s helpful to understand how toachieve true accessibility.Rather than thinking about accessibility on the extreme endsof the spectrum, think about serving people “in the middle.”
  8. 8. PEOPLE “IN THE MIDDLE”At one point in their lives, the “average” American may needaccess when they least expect it. Some don’t even considerthemselves “disabled.” For example: • a 20-something war vet returning from Afghanistan with mild hearing loss • a 35 year-old who sprained her wrists after falling off her bike • a 40-year old who is recovering from a temporary brain injury • Someone who is shocked as they escaped the path of a tornado through their town and needs to access FEMA.gov.
  9. 9. ACCESSIBILITY KEY CHARACTERISTICSBlindness / Low Vision Cognition / Intellectual Disabilities• Skip Navigation Links available; • Provide both images and text;• <alt> text available and effective; • Ensure site is user-friendly & understandable• Contrast options & control; • Avoid overly complex web functions• Provide long descriptions for complex • Avoid jargon. User basic language. imagesDeafness / Hearing Loss Mobility• Closed captioning available; • Provide skip-navigation links;• Transcripts of audio / video available; • All website functions available from keyboard; • Ensure pages are “error-tolerant.”
  10. 10. INTERESTING STAT:Accessibility when considered in the beginning of a project adds 10% of time & cost. After the fact, it’s at least 2x the cost.
  11. 11. EXPERIENTIAL LEARNING: VISION
  12. 12. ON THAT NOTE...When accessibility is addressed in the beginning,Usability improvements and considerations areweaved into the process.
  13. 13. PLANNING FOR ACCESSIBILITY
  14. 14. ACCESSIBILITY FEATURES: ANALYSISBackend FrontendCreating Content Skip to Main ContentManaging the Page Structure NavigationConfiguring User Roles Logging in / Logging OutHelp Text Read More Links
  15. 15. ACCESSIBILITY FEATURES: DEVELOPMENTBackend & FrontendContext & RelationshipsAccessibility “Collaboration” - e.g. <alt> text field + quality <alt> text descriptionTab Order & Configuration via KeyboardNo Javascript or CSSSpecific Markup for Screen Readers
  16. 16. ACCESSIBILITY FEATURES: IMPLEMENTATIONBackend FrontendContent Creation & Site Configuration are Screen Readers can intuitively navigate siteaccessible, usable, and informative Keyboard-only users easily get around site
  17. 17. ACCESSIBILITY: YOUR ROLE IN CONTENT CREATIONWORKFLOW When you and your organization adds content, it is important to check each “front-facing” element to ensure that it includes the necessary accessibility elements which also contribute to overall usability of the site. IMAGES: Clear, descriptive and succinct <alt> text is available. CONTEXT: The content is easy to understand, descriptive, and not full of jargon. PAGE MARKUP: Headings are used properly, as are bullets for lists. AUDIO / VIDEO: The media on the page are available with a caption file or transcript.
  18. 18. PHASE2 QA & TESTING SECTION 508 & WCAG
  19. 19. ACCESSIBILITY QA: HOW TO TESTTESTING ENVIRONMENTS • Section 508 • Monitor Off • WCAG 2.0 Best Practices TOOLS • No Mouse • JAWS, VoiceOver, & NVDA • JavaScript OffCONSIDERATIONS • • Keyboard-Only Manual Testing • • CSS Off Images Off • Equal Access • Automated Testing • No Audio • Equivalent Experience • No Color • Usability TRACKING • Accessibility QA
  20. 20. ACCESSIBILITY QA: AUTOMATED TESTING TOOLSKey Notes:Testing Tools must be able to test the DOM to be effectiveAutomated Tools cannot evaluate quality of accessibility
  21. 21. ACCESSIBILITY QA: MORE TOOLSCOLOR CONTRAST ANALYZERCAPTIONING VIDEOS
  22. 22. ACCESSIBILITY QA: MANUAL TESTING STRATEGIESKey Notes:Consider the additional ways for people to understand or interact with the content?If any aspect of website is the least bit frustrating to you, fix it. It’s going to be a worse experience for others. • Descriptive context; • Closed captioning available; • Transcript available; • Audio-only version; • User can enlarge video; • Easy control of play-back; • Clear navigation direction
  23. 23. ACCESSIBILITY QA: PHASE2’S CHECKLIST
  24. 24. RECAPWHO WE’RE SERVING: Everyone! Usability and Accessibility are interchangeable.THE BACKEND: Ensure that the CMS supports accessible content creation and navigation.THE FRONTEND: The Site is intuitive to follow, and the content is readable and accessible. WORKFLOW: Set organizational responsibilities and expectations for accessible content creation.TESTING: Conduct automatic testing early, followed by all-important manual testing
  25. 25. QUESTIONS? VISIT WWW.PHASE2TECHNOLOGY.COM/X TO DOWNLOAD TEST TRACKING WORKSHEET & TOOLS HANDOUTShawn Mole Catharine McNallyPhase2 Technology Phase2 TechnologySoftware Analyst Quality and Accessibility AnalystTwitter: @shawnmole Twitter: @cmcnallysmole@phase2technology.com cmcnally@phase2technology.com

×