POINT OF view
Accessibility Is Not a Feature: How to
Incorporate Accessibility in Your Project Methodology
Phillip Golub, Associate Creative Director, SapientNitro
“There are a bunch of things that are not features. Performance is not a feature,
internationalization is not a feature, and Accessibility is not a feature.”
– Nicholas Zakas, Former Principal Front-End Engineer, Yahoo!
The quote above speaks to Accessibility as a core component of any successful project methodology. It
is not an afterthought. It is not an extra. It is an integral component of online experience design.
The term “Accessibility” means that a product works if all people—regardless of ability or device—
can navigate it, understand it, and complete the tasks they wanted to accomplish.
Using a traditional architecture example, we cannot
imagine constructing a building without wheelchair ramps,
handicapped parking spaces, or Braille elevator signage.
These requirements are known and acknowledged far
before any construction actually takes place. With this in
mind, take a look at the image in Figure 1. The architect
clearly was aware of a legal requirement to factor in
disabled people, but did not include it as part of the initial
design process, and ultimately failed at the task.
Figure 1: Post-Design “Accessibility”
Tacking on Accessibility after constructing a building simply does not work, not optimally at least. And
the same holds true for web-based products.
TYPES OF DISABILITIES
In order to understand Accessibility, we first need to understand the types of disabilities and how they
interact with computers. There are four categories:
1. Visual impairments (e.g., blindness, low vision, color blindness)
2. Hearing impairments (e.g., deafness, hard-of-hearing)
3. Motor skill impairments (e.g., multiple sclerosis, cerebral palsy)
4. Cognitive impairments (e.g., dyslexia, ADHD)
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
All of these categories, in any combination, can significantly impact one’s ability to interact with a
web-based product, and can certainly apply to people as they age. Some disabilities can affect us
temporarily, such as traumatic injury or illness, but can still impede normal usage behavior.
THE PRESENTATION LAYER
While there are back-end systems that feed into it, Accessibility is mostly about interaction elements
that are on the presentation layer — things that people see, interact with, and consume:
• Imagery: If someone is sight impaired and cannot see an image, there are mechanisms that must be
in place to allow assistive technologies to “explain” to the user what he/she is looking at. These
include ALT attributes, meta-tags, and accurate tab ordering. In addition, there are specific guidelines
for optimal ratios between foreground and background colors.
•Flash and Multimedia: Flash presents many inherent Accessibility issues. In fact, many Accessibility
practitioners recommend strict avoidance of Flash as a front-end technology. However, it is possible to
successfully implement an accessible Flash application, provided the right resources and ActionScript
tactics are employed. There are also three primary rules one must adhere to for making multimedia/
video files accessible:
o Closed-captioning, with the ability to turn captions on and off
o Device-independent controls (i.e., keyboard operability)
o Text transcripts of the recording
• Code: There are set guidelines for front-end code as proscribed by the World Wide Web Consortium
(W3C) that are too numerous to specify in this document. However, it is quite possible to provide rich
interactive experiences that rely heavily on JavaScript, or that use layers and “lightboxes.” The W3C
recommends using CSS and XHTML or HTML5 for this purpose.
• Progressive Enhancement: There are ways to programmatically detect user dependencies to either
enhance or gracefully degrade the experience based on the system technology being used.
• Adaptive and Responsive Design: Ensure the user has a way to recognize when actions are
occurring on screen when a disability does not allow normal viewing.
BENEFITS OF ACCESSIBILITY
When Accessibility is incorporated from the outset, it has immediate and long-term benefits on a site
and the organization itself:
1. Usability: When done right, an accessible site is also a “more” site, not just for disabled customers,
but for the non-disabled as well.
2. Scalability: When working with large, decentralized clients, internal development teams may very
well have adopted some bad habits over time, such as copying and pasting old code across vast
swaths of a corporate site. However, when the code is created according to W3C standards, this
practice is far less risky, and the code base becomes much more reusable, scalable, and consistent.
3. Page Performance: The time it takes to load pages built with Accessibility in mind greatly
decreases.
4. SEO: Accessibility also has immediate benefits on search engine optimization.
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
5. Multi-Channel: Accessibility leads to a mobile-ready site. Whether it’s the iPad, iPhone, Android, or
other platform, we’ve found that companies that have built Accessibility into their web experience
have a much easier time converting it later.
ASSISTIVE TECHNOLOGIES
How we code our websites and software affects the success of those with disabilities, who have
different ways of using the computer and interacting with products. These are known as assistive
technologies (AT).
Screen Readers: The most common AT are screen readers (e.g., JAWS, VoiceOver). Screen readers
do not literally read the visual screen but they allow the person using it to interact with the desktop or
application by looking at and deciphering the front-end code.
Screen Magnifiers: Screen magnifiers are useful to people with low vision or those who cannot read
small text.
Closed Captioning: Closed captioning provides real-time text translations of dialogue for those who
cannot hear.
Other Devices: One useful device is called Sip-and-Puff (SNP), which allows someone to control the
computer using their breath rather than a physical mouse or keyboard. There is also voice recognition
software, such as Dragon or Siri, which has recently come to prominence on the iOS platform. Many
voice recognition applications for the Android and iPhone were first developed for the purpose of
Accessibility. For people with motor control impairments, it allows them the ability to use the computer
comfortably through voice commands.
GLENDA’S STORY
Glenda has cerebral palsy, which inhibits fine motor control. She can only use a keyboard with her left
thumb and has slurred speech. But with her iPad and the Speak Auto-text feature (which reads the text
aloud) enabled, she is able to type messages and communicate with people she otherwise would not
have been able to.
It was so cool, like another door had just opened for me! – Glenda Watson Hyatt,
www.doitmyselfblog.com
Figure 2: Glenda, the “Left Thumb Blogger”
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
To see what Glenda sees, grab your iPad or iPhone. Go to your Settings and select “General.” You
will notice there is an “Accessibility” option. Speak Auto-text is available here, but there are other
Accessibility features available as well. For instance, White on Black is used by people with lower vision
and can be easier to read due to optimal color contrast ratios. Mono Audio converts stereo audio files to
mono, which is useful to people with deafness in one ear or otherwise only have the use of one ear.
LAWS AND STANDARDS
The legal environment today is quite confusing, but there is legal precedent for Accessibility as a
requirement for both public and private entities. In the U.S., there is what is known as Section 508,
but it only applies to federal government agencies and the products they procure.
The Americans With Disabilities Act (ADA) is the broader disability law in the U.S. Since it was passed
before the Internet was widely used, there have been some lawsuits resulting from companies (e.g.,
Target, Southwest Airlines) that did not cater to disabled users, resulting in lost revenue and negative
brand reputations. As of this paper, one current pending regulation will require all airline websites and
kiosks to be fully accessible.
But the U.S. is not the only country with Accessibility laws. Both the UK (Equality Act 2010) and
Australia (Disability Discrimination Act of 1992) have passed laws requiring Accessibility, as have other
countries around the world.
The World Wide Web Consortium (W3C) is an international body that sets standards and guidelines
for the web. In 1995, they created the Web Accessibility Initiative (WAI), which released version 1.0 of
the Web Content Accessibility Guidelines (WCAG). In December of 2009, the WCAG was updated to
version 2.0, which has three levels of compliance: A is the minimum, AA is the target goal for private
and government levels, and AAA is the height of compliance, but is incredibly difficult to meet, in part
because some standards contradict each other.
THE APPROACH
The recommended approach to integrate Accessibility is a five-step process:
1. Accessibility Strategy: Understand what the clients’ Accessibility requirements are. If there is an
existing product, assess it. Then, come up with a detailed plan and communicate it to the appropriate
stakeholders. Some additional education may be required throughout this process to ensure the
client understands what Accessibility means, why it is important, and how to measure success.
2. Implementation: Ensure the staff is trained on Accessibility and test for it while designing as
opposed to waiting for the product to be completed. It will save time and money by catching
problems early on, especially if industry best practices for Accessibility are employed throughout
development.
3. QA and Validation: Decide what testing tools the QA team should use and determine what level of
failure is allowed, since few products are completely accessible to all people in all contexts. Pursue
the features or areas of the site that affect the greatest number of people in the greatest number
of ways. After QA is completed, report any remaining barriers to the client with recommendations for
further action. It is recommended to get approval, acceptance, and accreditation from an objective
third party, of which there are several in the U.S. and internationally.
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
4. Deployment: Create a style and maintenance guide that includes tips for content creators and
programmers when creating new content and web pages, as well as a policy statement. This will
commit the company to a level of Accessibility compliance.
5. Maintenance: It is wise to recommend a governance model to centralize content creation,
governance, and process where possible. A strong governance model will also have an audit
structure in place to ensure that there is a timely schedule for future assessments as the site grows.
Finally, hand off responsibility to the organization’s internal testing team so they can maintain the
Accessibility that has been achieved.
CASE STUDIES
American Express: As a prominent financial institution, it was difficult to discern to what degree
American Express was exposed to legal risk as a result of their known lack of Accessibility compliance.
Based on high-level calculations, at a bare minimum over 235,000 of American Express’s U.S. card
members were likely sufferers of visual impairment, with over 500 online account management
enrollees receiving Braille statements.
In 2009, legal action was threatened on behalf of a visually impaired lawyer in the UK and the Royal
National Institute for the Blind. Before this threatened legal action, Accessibility was never a concern
to technology, business, or marketing teams. In addition, they did not realize the percentage of the
population that was disabled and how much revenue they were losing as a result.
To solve the problem, process was integral. Since American Express already had an existing site and
added new pages on a daily basis, it was necessary to tackle the problem along two paths. The first
path was the uplift of existing pages. To establish the scope, Omniture reports were run to see where
the majority of traffic was going and what percentage of pages were highly visible. Omniture found that
over 90% of traffic was going to roughly only 700 U.S. pages of a site that exceeded 10,000 pages. A
six-step uplift process was then employed that spanned roughly 16 months across over 10 development
and marketing teams. The second path was the creation of a governance model. For American
Express, which was a highly decentralized organization, development guidelines, training documents,
and mandates were eventually put under the control of a central governing body in order to maintain
and ensure Accessibility in the future.
PAGE COUNT COMMUNICATION ENGAGEMENT ANALYSIS BUILD GOVERNANCE
Establish total Evangelize Formally engage Set scope of Redesigning Ensuring
number of pages accessibility impacted tech uplift impacted pages ongoing
(omniture) and needs and teams to begin initiatives using in compliance compliance and
cut-off point for establish workstreams industry- with agreed- adhereance to
analysis business case standard upon standards
tools accessibility through process
standards
Figure 3: American Express Strategic Approach
In the end, over 80% of domestic traffic and 70% of aggregate international traffic was uplifted in
compliance with WCAG 2.0 levels A and AA. In addition, American Express received industry-standard
accreditation by a third party vendor, Shaw Trust, as a fully accessible site. Finally, the Accessibility
initiative yielded the necessary governance artifacts of both iGuide, which stipulated guidelines and
standards in documented form, and iGovernance, the central governing body for all interactive projects,
that together ensured and maintained standards and consistency across the organization.
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
Figure 4: AmEx OPEN Homepage
The NIH Curriculum Supplement Series: The National Institutes of Health wanted to teach middle
school students how hearing works — including students with hearing or visual impairments. They
solved the problem though an accessible, interactive Flash animation. Users could tab through
the pages with the keyboard or toggle the closed captioning on or off. The site also used visual
representations of sound waves and the sound spectrum, which allowed those hard-of-hearing to have
a visual understanding of what sound is and how hearing works.
The site was extensively tested, but as the Flash player was updated over the years and screen readers
developed, some elements had to be updated. Even with those issues, the project was a success and
the client was very satisfied. Macromedia, who owned Flash at the time, was also impressed and used
the series as a case study for successful implementation of accessible Flash.
Figure 5: NIH Curriculum Supplement Series — How Hearing
Works
THE BOTTOM LINE
Web Accessibility has become a hot topic in recent years due to legal actions, greater awareness,
and the increased number of people living with disabilities. According to census surveys, 18 to 25
percent of the population has a disability that impairs their use of the web. Clients should make sure
that Accessibility is a priority, not only because it will have profound impacts on day-to-day activities,
but also because they stand to lose brand affinity by ignoring such a significant percentage of their
customer base.
Your clients have more users with disabilities than you probably realize, and those disabled users have
great purchasing power. Accessibility does not limit innovativation or interactivity, but not planning for
Accessibility can have a very limiting effect on profitability. With proper planning and a little forethought,
your projects, your clients, and their users can all reap the benefits of Accessibility.
IDEA ENGINEERS © Sapient Corporation 2012
POINT OF view
ABOUT THE Author
Phillip Golub is an Associate Creative Director in SapientNitro’s
Arlington, Virginia office. Over the course of his career, he has
consulted with various clients on the benefits, tactics, and strategic
value of web Accessibility. Prior to joining SapientNitro, he led an
enterprise-wide program for American Express to retrofit the most
frequently trafficked pages of americanexpress.com across the
globe. In that effort, he led training efforts for over 1,000 American
Express employees across technology, marketing, and product man-
agement groups in three different countries.
IDEA ENGINEERS © Sapient Corporation 2012