In 2019, web designers, developers, and programmers will be part of a global initiative to ensure all of their company's products and services are accessible to everyone.
Join Geographic Solutions' Patti Arouni and John Contarino as they lead an engaging discussion on what developers need to know to make the web more accessible and ADA compliant for all users.
Accessibility Now: What Developers Need to Know About Inclusive Design
1. Patti Arouni & John Contarino
Geographic Solutions
Making Your
Online Services
Accessible to
All Users
3. 3
Accessibility is the practice of making your websites usable by
as many people as possible.
You could also think of accessibility as treating everyone the
same, and giving them the same opportunities, regardless of
ability or circumstance.
4. 4
• People with disabilities:
• conduct personal banking
• make restaurant reservations
• access government benefits
• apply for college, shop online, read the news, play online games, and anything
else that is available on the web.
• You: improved Search Engine Optimization (SEO).
• You: Demonstrates good ethics/morals, which improves your public image.
• Other groups, such as mobile phone users, those on a low speed network, etc.
• In fact, everyone can benefit from such improvements.
6. 6
• Section 508 of the Rehabilitation Act of 1973, as Amended
(Section 508)
• Americans With Disabilities Act of 1990, as Amended (ADA)
• Web Content Accessibility Guidelines 2.0 (WCAG 2.0)
8. Section 508
8
Section 508 of the Rehabilitation Act as amended, 29 U.S.C. Section 794d,
requires all digital materials developed, procured, maintained, or used by
Federal agencies be accessible to people with disabilities, and that the access
be comparable to the access and use by those without disabilities. The
accessibility requirements noted within Section 508 build upon the accessibility
guidelines of the W3C for all web-based materials.
9. Section 508
9
In January 2018, Section 508 was refreshed to more
closely align with the Principles and Guidelines of
WCAG 2.0.
11. ADA
11
The Department of Justice (DOJ) published the Americans with
Disabilities Act (ADA) Standards for Accessible Design in
September 2010. These standards state that all electronic
information must be accessible to people with disabilities.
12. Who is Affected?
12
• Americans with disabilities and their friends, families,
and caregivers
• Private employers with 15 or more employees
• Businesses operating for the benefit of the public
• All state and local government agencies
13. What Does it Mean to Me?
13
Websites and electronic information must be
accessible to all users and compliant with the ADA.
14. How Do We Comply with the ADA?
14
Organizations are encouraged to use the WCAG 2.0 level AA
guidelines as a guide on how to become accessible.
16. What is WCAG 2.0?
16
Web Content Accessibility Guidelines (WCAG) is developed through
the World Wide Web Consortium (W3C), with a goal of providing a single
shared standard for web content accessibility that meets the needs of
individuals, organizations, and governments internationally.
17. Who is Affected by WCAG 2.0?
17
People with disabilities, including:
• Blindness and low vision
• Deafness and hearing loss
• Learning disabilities
• Cognitive limitations
• Limited movement
• Speech disabilities
• Photosensitivity
• Combinations of the above
18. How do we Comply with WCAG 2.0?
18
Accessibility is a continuous process, with
contributions by every department. By following the
WCAG 2.0, websites and products can be accessible
to all users, regardless of their ability.
22. Perceivable
22
Users must be able to perceive your website
content, regardless of their abilities and the
manner in which they perceive it.
23. How Do We Do That?
23
• Provide text alternatives for non-text content
• Provide alternatives for time-based media
• Create content that is presentable in different
ways without loss of function
• Make it easier for users to see and hear content
25. Operable
25
Operability is about making the input methods of web content functionally
available to a wide range of input devices, including:
• Mouse or touchpad
• Keyboard
• Touchscreen
• Voice recognition software
• Other specialized input devices (most of which emulate the keyboard
or mouse)
26. How Do We Do That?
26
• Make it keyboard accessible
• Provide enough time
• Avoid seizure-causing content
• Provide skip to main content links
• Provide proper descriptive page titles
• Ensure proper focus order
• Provide descriptive link text
• Ensure focus is indicated
29. How Do We Do That?
29
• Make it readable
• Make it appear and operate in a
predictable way
• Provide input assistance
31. What Does it Mean?
31
Content must be robust enough that it can be
interpreted reliably by a wide variety of user
agents, including assistive technologies.
32. How Do We Do That?
32
• Make it syntactically correct
• ARIA – use Name, Role, Value for
user interface components (if not
provided by HTML5)
42. What is Vision Impairment?
42
Vision impairment is defined as a limitation of one
or more functions of the eye (or visual system). The
most common vision impairments affect the
sharpness or clarity of vision.
43. Types of Vision Impairment
43
• Low vision
• Macular degeneration
• Cataracts
• Glaucoma
• Total vision loss
51. What is Hearing Impairment?
51
Hearing impairment, or hearing loss, occurs when you lose part or
all of your ability to hear. Hearing impairments are classified
based on the severity and type of hearing impairment. The severity
of hearing impairment can be mild, moderate, severe, or profound.
53. What is a Motor Skills Impairment?
53
Motor skills impairment may prevent a user
from being able to use a mouse, click on small
links, or operate dynamic elements effectively.
55. What is a Cognitive Impairment?
55
By far the most common type of disability is a cognitive disability.
Cognitive impairment comes in many different forms. Autism,
dyslexia, limited comprehension, limited problem-solving skills,
short term memory loss, and attention deficit are just a few of the
disabilities that fall under this spectrum.
57. 57
• Keyboard Only
• Screen Readers
• Enlarging Text
• Captioning
• User Settings
*This list is not all-inclusive
60. 60
1. Starting Point Alt+D
Navigates to the URL field
2. Tab Key
Navigating around the page
3. Shift+Tab
Navigate to the previous focusable element
4. Skip to Main Content Alt+2
5. Skip to Page Footer Alt+3
6. Select Drop Down List
Alt+Arrow Down opens list
Arrow Up or Down to navigate through items
OR
Without opening Arrow Up or Down to navigate
through items
61. 61
7. Radio Buttons
Arrow between radio buttons.
8. Check Boxes
Space key will check and uncheck
9. Navigate Page Backwards
Alt + Left Arrow
10. Navigate Page Forwards
Alt + Right Arrow
11. Zoom In web page
Crtl + Plus Key
12. Zoom Out web page
Crtl + Minus Key
13. Reset Zoom to 100%
Ctrl + 0 (zero)
62. 62
14. Refresh Page
F5
OR
Crtl + F5 – Clears cache and refresh page
15. Text Editing
Crtl + A = Select All
Crtl + C = Copy
Crtl + X = Cut
Crtl + V = Paste copied contents
64. What are Screen Readers?
64
A screen reader transmits whatever text is displayed on the
computer screen into a form that a visually impaired user can
process (usually tactile, auditory or a combination of both).
65. What Screen Readers are Available?
65
These are the four most commonly-used screen readers:
• JAWS (Job Access With Speech)
• NVDA (NonVisual Desktop Access)
• Apple VoiceOver
• Microsoft Narrator
67. Text Enlargement
67
WCAG 2.0 requires a user to be able to enlarge text to 200%
without losing content or functionality.
WCAG 2.1 (Recommendation as of June 5, 2018) requires a
400% enlargement of text.
68. What Text Enlargers Are Available?
68
• Windows Operating System (Ctrl+plus sign)
• MAC Operating System (Command+plus
sign)
• ZoomText (AiSquared)
• MAGic (Freedom Scientific)
• Many Others
70. Captioning
70
WCAG 2.0 requires that captions be provided for
all prerecorded audio content in synchronized
media, except when the media is a media
alternative for text and is clearly labeled as such.
72. User Settings
72
User controlled settings is functionality that allows users to choose (or
set) the website settings to what’s most comfortable for them. For
example, allowing the user to change contrast, select or set the font
size, and change font colors are just some examples of how a user can
create a user experience customized to their needs.
73. Questions and Contact Information
Corporate Headquarters:
1001 Omaha Circle - Palm Harbor, FL 34683
Phone: 727-786-7955 – Fax: 727-786-5871
Patti Arouni
Lead Programmer/Analyst
Accessibility Services Team
PArouni@geosolinc.com
West Coast Office:
234 Capitol Street, SuiteA – Salinas, CA 93901
Phone: 831-757-4400 – Fax: 831-757-4401
www.GeographicSolutions.com
John Contarino
Programmer/Analyst
Accessibility Services Team
JContarino@geosolinc.com
73
Notes de l'éditeur
This session is Making Your Online Services Accessible to
All Users
Web Accessibility Compliance
Section 508 of the Rehabilitation Act of 1973, as Amended (Section 508)
Americans With Disabilities Act of 1990, as Amended (ADA)
Web Accessibility
Web Content Accessibility Guidelines 2.0 (WCAG 2.0)