top of page

JOHN WALKER

UX & PRODUCT DESIGN | WALKERUX@GMAIL.COM | (917)566-1527 | DENVER, CO

Accessibility

I've been responsible for accessibility compliance for Global Design Systems at Comcast and AllianceBernstein Wealth Management, as well as for other applications at AllianceBernstein.

Below are some examples of my work: a general presentation, an accessibility survey, and an accessibility recommendations document.

Accessibility 101 Presentation

Cover page of Website Accessibility 101

Topics: 1. What's accessibility? 2. Who’s affected? 3. How can we service customers? 4. How does accessibility impact business? 5. How can we enhance accessibility?

1. What is web accessibility?

Quote about universal access being essential to the Web. Humorous photo of kids dressed as superheroes gesturing triumphantly

Quote about how accessibility requires radical thinking. Humorous photo of a kid dressed as Einstein in front of a chalkboard

Accessibility Fail. Domino’s Pizza Builder doesn't allow screen reader users to select options to build a pizza

Forms of Disability: Auditory, cognitive, neurological, physical, speech, visual, permanent, temporary

2. Who's Affected? How Can We Service Our Users?

65 mil Americans have difficulty with functional activities. 48 mil have a disability. 34 mil have a functional limitation

Accessible Content Structure. Headers should read as an outline. Disability: Blindness,
limited motion. Also: ADHD, busy folks

Color differentiations should be visible across many spectra. Disability: Color blindness. Also: Poor lighting, aging eyes

Summarize image content in less than 125 characters. Disability: blindness. Also: No Javascript, poor connections

Infographics must include a written summary. Disability: blindness. Also: Varied intellectual levels, non-visual learners

Video audio should be transcribed to text. Disability: deafness. Also: poor connections, quiet contexts, reading preference

Web compliance Level A: little effort & impact. Level AA: moderate effort, general compliance. Level AAA: high effort, specialized

3. How Does Accessibility Affect Brands?

Accessibility drives innovation such as closed captioning, glasses which create audible descriptions, device voice controls

Disabled folks comprise a huge untapped market. 1 bil people with $8 tril market power experience some form of disability

Liability: 2258 disability lawsuits were filed in 2018, a 177% increase. Netflix owed $775,00 in fees after a lawsuit

After improving accessibility, Microsoft increased customer satisfaction 115% and NPR received a significant rise

4. How can we enhance accessibility?

Download Accessibility 101 Presentation

Sample Accessibility Survey

Survey cover page

My process included an evaluation using VoiceOver and NVDA; examining the source code; and checking for color compliance

FIndings: Accessibility is good. Some CSS, color, and chart tweaks needed. No videos, carousels or infographics compliant.

Product Filters: Some tabs, tags, and collapsible buttons aren’t implemented correctly

Product Tabs & Jump Navigation: Toggles and navigation links aren’t implemented correctly.
Morningstar icon isn’t readable

Tables: No on-page text summary of the table's contents;
the icon representing null results isn’t readable

Search: Predictive results list isn't read out. But results are scrollable

Fund Lit Tabs: Accordions aren’t read correctly. Links lack clear labels. Checkboxes and links aren’t implemented correctly

Individual Product Overview: Some icons aren't being read correctly, while others aren't being read at all

Individual Product Jump Tabs: Anchor tags aren’t implemented correctly

Individual Product Literature: Checkboxes aren’t operable and link labels are confusing

Accordions: Checkboxes aren’t operable and link labels are confusing

Side-by-Side Charts: Both charts are being read together as one large chart and the charts lack on-page text summaries

Infographics: Not implemented correctly and their content is incomprehensible. Lack on-page text summaries

Carousels: Implementation is confusing. Search results aren’t being read out correctly

Homepage Structure: Content isn’t structured correctly and some content is difficult to find

Download Accessibility Survey Findings Report

Sample Accessibility Recommendations

Cover page for Accessibility Survey Recommendations by John Walker for AllianceBernstein

My process included an evaluation using VoiceOver and NVDA; examining the source code; and checking for color compliance

General recommendations include fixing non-compliant type sizes; adding image alt text; and writing specific aria-labels

Header recommendations: Implement the non-navigation elements to function correctly and have clear text labels

Navigation recommendation: Implement the navigation correctly using a <navigation> element

Main content recommendations: Implement <main> and <region> landmarks; correct the <h> CSS structure

Main content recommendations: Implement <search> and <footer> landmarks; correct the <h> CSS structure; write better labels

Download Accessibility Survey Recommendations Report

Sample Accessibility Audit

Cover for How to Create and Accessibility Audit

A successful audit requires both scans with AI tools and manual surveys to catch all issues

For this study, I scanned a homepage using axe and Lighthouse, reviewed results from an outside vendor, and did a manual scan

Axe scans and flags results by in five categories and suggests a manual survey

Axe found 82 issues automatically and the guided manual tests found 12 more

Lighthouse segments issues into five categories and provides a checklist for manual survey

Lighthouse detected 77 issues in the Accessibility category and also suggested a manual survey

SiteMorse scans specified pages to create a report with three views: Priorities, Report, and Inventory

SiteMorse reports can be filtered in several ways to display issues with clickable links to lines of code

I've created a list of items that benefit from a manual survey