Adding Guerilla Accessibility Testing to Your Development Process

25
Adding Guerrilla Accessibility Testing to Your Development Process

description

 

Transcript of Adding Guerilla Accessibility Testing to Your Development Process

Page 1: Adding Guerilla Accessibility Testing to Your Development Process

Adding Guerrilla Accessibility Testing to Your Development Process

Page 2: Adding Guerilla Accessibility Testing to Your Development Process

PHASE2’S ACCESSIBILITY APPROACHOUR PHILOSOPHY & GOALS

Page 3: Adding Guerilla Accessibility Testing to Your Development Process

PHASE2 ACCESSIBILITY APPROACH

Our Philosophy

• Shared Experiences

• Focus on Usability

• Beyond Box-Checking

Page 4: Adding Guerilla Accessibility Testing to Your Development Process

Goal: 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.

PHASE2 ACCESSIBILITY APPROACH

Page 5: Adding Guerilla Accessibility Testing to Your Development Process

Thought leadership• In-house accessibility expert• Implementing best practices

Internal Investment on Products• OpenPublic built with accessibility at the core

PHASE2 ACCESSIBILITY APPROACH

Page 6: Adding Guerilla Accessibility Testing to Your Development Process

WHY ACCESSIBILITY?

Page 7: Adding Guerilla Accessibility Testing to Your Development Process

WHAT “ACCESSIBILITY” REALLY MEANSSection 508 may be a set of rules. But to effectively implement best practices, it’s helpful to understand how to achieve true accessibility.

Rather than thinking about accessibility on the extreme ends of the spectrum, think about serving people “in the middle.”

Page 8: Adding Guerilla Accessibility Testing to Your Development Process

PEOPLE “IN THE MIDDLE”At one point in their lives, the “average” American may need access when they least expect it. Some don’t even consider themselves “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.

Page 9: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY KEY CHARACTERISTICSBlindness / Low Vision

Deafness / Hearing Loss

Cognition / Intellectual Disabilities

Mobility

• Skip Navigation Links available;

• <alt> text available and effective;

• Contrast options & control;

• Provide long descriptions for complex images

• Closed captioning available;

• Transcripts of audio / video available;

• Provide skip-navigation links;

• All website functions available from keyboard;

• Ensure pages are “error-tolerant.”

• Provide both images and text;

• Ensure site is user-friendly & understandable

• Avoid overly complex web functions

• Avoid jargon. User basic language.

Page 10: Adding Guerilla Accessibility Testing to Your Development Process

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.

Page 11: Adding Guerilla Accessibility Testing to Your Development Process

EXPERIENTIAL LEARNING: VISION

Page 12: Adding Guerilla Accessibility Testing to Your Development Process

ON THAT NOTE...

When accessibility is addressed in the beginning, Usability improvements and considerations are weaved into the process.

Page 13: Adding Guerilla Accessibility Testing to Your Development Process

PLANNING FOR ACCESSIBILITY

Page 14: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY FEATURES: ANALYSIS

Backend FrontendCreating ContentManaging the Page StructureConfiguring User RolesHelp Text

Skip to Main ContentNavigationLogging in / Logging OutRead More Links

Page 15: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY FEATURES: DEVELOPMENT

Backend & FrontendContext & Relationships

Tab Order & Configuration via KeyboardNo Javascript or CSSSpecific Markup for Screen Readers

Accessibility “Collaboration” - e.g. <alt> text field + quality <alt> text description

Page 16: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY FEATURES: IMPLEMENTATION

Backend FrontendScreen Readers can intuitively navigate siteKeyboard-only users easily get around site

Content Creation & Site Configuration areaccessible, usable, and informative

Page 17: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY: YOUR ROLE IN CONTENT CREATION

WORKFLOWWhen 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.

Page 18: Adding Guerilla Accessibility Testing to Your Development Process

PHASE2 QA & TESTINGSECTION 508 & WCAG

Page 19: Adding Guerilla Accessibility Testing to Your Development Process

TESTING• Section 508• WCAG 2.0 Best Practices

CONSIDERATIONS • Equal Access• Equivalent Experience• Usability

ENVIRONMENTS• Monitor Off• No Mouse• JavaScript Off• CSS Off• Images Off• No Audio• No Color

TRACKING• Accessibility QA Spreadsheet

TOOLS• JAWS, VoiceOver, & NVDA• Keyboard-Only• Manual Testing• Automated Testing

ACCESSIBILITY QA: HOW TO TEST

Page 20: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY QA: AUTOMATED TESTING TOOLSKey Notes: Testing Tools must be able to test the DOM to be effectiveAutomated Tools cannot evaluate quality of accessibility

Page 21: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY QA: MORE TOOLSCOLOR CONTRAST ANALYZER

CAPTIONING VIDEOS

Page 22: Adding Guerilla Accessibility Testing to Your Development Process

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

Page 23: Adding Guerilla Accessibility Testing to Your Development Process

ACCESSIBILITY QA: PHASE2’S CHECKLIST

Page 24: Adding Guerilla Accessibility Testing to Your Development Process

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

Page 25: Adding Guerilla Accessibility Testing to Your Development Process

QUESTIONS?

Catharine McNallyPhase2 TechnologyQuality and Accessibility AnalystTwitter: @[email protected]

Shawn MolePhase2 TechnologySoftware AnalystTwitter: @[email protected]

VISIT WWW.PHASE2TECHNOLOGY.COM/X TO DOWNLOAD TEST TRACKING WORKSHEET & TOOLS HANDOUT