website accessibility
TRANSCRIPT
Web AccessibilityAnalysis: MyQL Origination
57,000,000 usersNumber of people with at least one disability
8,000,000 usersVision Disability
19% of the population
Source: Census Bureau of the United States, 2012
What’s this?This is a basic analysis of the MyQL Origination website with a focus on how to start making websites compliant.
ADA Compliance
As of today there are no laws which strictly define if a commercial website should be accessible.
About this
How can I use this?The initial requirements for accessibility are defined in this document.
The report is built to ensure implementation of the suggestions in the short term without requiring herculean engineering effort.
Hello!I am Nishan Bose
Software Engineer Intern, Game of Loans
Mentor: Rob Anderson, Leader: Joe Seto
Graduate Student at University of Michigan - Ann Arbor
Master of Science in Information
Built ADA Compliant Websites for Information & Technology Services at U of M
Underwent Training in the Accessibility Lab at U of M
1.Rules of the Game
What is Accessibility?
Assistive Technologies
Joystick as Mouse Braille Keyboard Sniff and Puff Device as keyboard/mouse
“Pen” operated keyboard Custom clicker mouse
“Accessibility refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person's assistive technology (for
example, computer screen readers).
Source: Wikipedia
“Making Web Accessible for the widest possible audience
Currently, online infrastructure is hostile to those with disabilitiesInseparable from SEO, Mobile and Usability
Improve one and you improve othersHow to? Adhere to Standards.
Gump
Web Accessibility Essentials
▷ Disabilities and the web
▷ Standards
▷ Accessibility Tools
▷ Design, Content and Engineering
▷ Legal
Disabilities and the web
▷ Visual: blindness, low-vision, color-blindness
▷ Hearing: partial to total deafness
▷ Motor: inability to use a mouse or physical keyboard, slow response time
▷ Cognitive: learning disabilities, distractibility, dyslexia
Standards
W3C WCAG 2.0
▷ World-wide standard, cited in US case law
▷ W3C Web Content Accessibility Guidelines are principle based
▷ The four principles (POUR)○ Perceivable○ Operable○ Understandable○ Robust
Accessibility Tools
▷ The Keyboard
▷ AChecker Online Evaluator
▷ Wave Accessibility Toolbar
▷ NVDA Screen Reader
▷ ChromeVox Screen Reader
Design, Content, Engineering
▷ Create and use design guidelines
▷ Populate the website with content
▷ Engineer accessibility into features
Legal
▷ DOJ revising ADA to include online resources
▷ Based on W3C WCAG 2.0, Level AA
▷ Case Law: MIT, Harvard, Target, Southwest Airlines, Priceline.com, Ramada, Kindle, LSAC and many more
Best PracticesForm Labels, Keyboard Access, Headings, Image Text Alternatives and Page Titles
Let’s review some concepts
Forms
Labels, Keyboard Access, Clear Instructions and effective error handling are important for forms accessibility
Keyboard Access and Visual Focus
Many people cannot use a mouse and rely on the keyboard to interact with the web
Headings
Web pages often have sections of information separated by visual headings, for example heading text is bigger and bold (like “Headings” right above this sentence
Image Text Alternatives
Text alternatives(“alt text”) convey the purpose of an image, including pictures, illustrations, charts, etc.
Page Titles
The first thing screen readers say when the user goes to a different web page is the page title
Menus
Menu is the primary form of navigation on a web page. It should be easy to understand for all accessibility tools
2.AnalysisIndividual Pages
Its not about WHO is right, it’s about WHAT is right.
What the human eyes see for headings
Home Page - Headings
What a screen reader “sees” for headings
Home Page - Headings
Todo Page - Page Titles
Example Menu
Menu
Home Page - Forms
Accessibility must become mainstream.
Only then will Quicken Loans reach its true potential for connecting and enabling everyone in the world.
Every Client. Every Time. No Exceptions. No Excuses.
How to?
▷ Design Guidelines▷ Accessibility Training▷ TFS Task for each story▷ Accessibility Labs
Stand Out
First to Market
ADA Compliance
Proud & Happy Clients
QL becomes the leader in yet another game-changing initiative
Obsessed with finding a better way.
