Incorporating Accessibility into Your Next Web Project: An Overview
Presented by Written by Maddie Presland, Project Manager Edited by Ian Cross, CEO Additional Research by Emily Brady, Project Management Intern
Introduction People become introduced to digital accessibility in dramatically different ways. Individual experiences naturally shape your own knowledge and understanding. If you don’t personally use assistive tech or struggle with seeing color contrast, or spend a lot of time with someone who uses or experiences this, it’s extremely difficult to develop an understanding of what that’s like. If you have ever navigated public transportation in a major city while on crutches or a knee scooter, you might be outraged at how certain stops aren’t accessible, or that everything just seems so much more difficult. For abled persons, these frustrations are temporary. The problem is that these frustrations or inability to do or access things are often long-term or permanent for disabled persons, and they are categorized as being “just the way things are”, when things could actually be different. This is especially apparent in the ever changing and constantly evolving way websites are built, and how information is made available for users. People with disabilities can be unintentionally gridlocked from receiving complete information from websites, or being able to complete tasks. This can be anything from looking up a restaurant’s menu to paying a credit card bill: all things that abled individuals don’t need to think about. A shift in industry standards is encouraging designers, developers, and project managers to work together with a collective focus on creating digital spaces that are usable and welcoming to all. This shift can be attributed to a few things: ●
●
Legal enforcement: Some organizations are required by federal law to follow web guidelines set by Section 508. These guidelines help ensure that both members of the public and government employees can access information and services through government websites and other media. The Americans with Disabilities Act requires local governments, nonprofits, and businesses to make accommodations to serve the disabled public. The key difference is that Section 508 provides guidelines on how to make information more accessible, and the ADA protects the civil rights of disabled persons, including access to information that affects their ability to receive the same services as abled persons. Web Content Accessibility Guidelines (WCAG): Determined by the Web Accessibility Initiative, WCAG assembles a list of criteria in order to score and rate a website’s level of accessibility. The general consensus is that organizations want to achieve a certain level of compliance, so they will incorporate these guidelines during a website redesign or utilize them to make improvements to an existing platform.
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 2
●
Increased public awareness: The internet can provide a greater platform for disabled persons and allies to generate awareness on how limited accessibility can make it significantly more difficult for users to find important information or complete important tasks that are frequently done online, such as paying utility bills or looking up directions. Call out culture isn’t helpful, but accountability culture is. Sometimes, companies just won’t pay attention until someone posts about them on Twitter.
For the I-SITE team, considering accessibility and factoring that into both design and maintenance of client websites is more important than ever. In order to gain a better understanding of the ever evolving industry standards and the best ways to incorporate accessibility into our workflow, we attended the AccessU conference for the first time. In this paper, we’ll provide brief summaries of understanding audiences, an overview of assistive tech, how several members of teams can contribute to accessibility, and other best practices for implementing accessibility into your project process.
What is accessibility? You have probably heard this term used before. Accessibility is an all-encompassing term for designing and building products, spaces, and services that effectively serve as many groups as possible. Approaching a design with an accessibility mindset means that your goal is to be inclusive, not just serve a target audience. Accessibility is often shortened to A11y, with 11 representing the number of letters between the A and Y in accessibility.
Who is responsible for incorporating accessibility into a project? Plot twist: this is a trick question. Accessibility is often an afterthought, or the responsibility of “making something accessible” is placed on one person or department. Successfully incorporating accessibility requires the participation and input from many. It’s a collaborative process on its own, not just a single milestone to be achieved throughout the course of the project. This paper will provide an overview on how to incorporate accessibility in your next project, and how to convince others to prioritize this– not just include it.
Knowing your audience Making the effort to understand accessibility and practical applications for your organization has one goal: to make experiences better for all your users, not just adequate. As with any other aspect of design, good functionality will help a user achieve their goal, but what incentives are you providing with the experience?
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 3
One quote in particular will help you understand why this is essential:
“If you do not intentionally include, you unintentionally exclude.” - Neil Lenane, Progressive Insurance Here’s the thing– people don’t know that they are excluding users until someone tells them. It’s difficult to understand how the world looks to someone with impaired vision or someone who relies on a screen reader instead of just looking at a screen to interact with online content. Everyone is only working with the information they have available in the moment to make the best possible decisions. Approaching digital products and content with a goal of being accessible will only help, not harm. 85.3 million people in the United States have a disability, or more than 1 in 4, according to the 2014 U.S. Census.1 3.3 percent of Americans have a vision impairment, and might rely on a screen magnifying software or a screen reader. 3.1 percent have a hearing impairment.2 Though these users are often labeled as outliers or edge cases, you have more users (or potential users) relying on assistive technology than you might think. It can take seconds for a user to figure out that they simply cannot interact with your website and to navigate away. These statistics are important for context, but the ultimate goal should be to make sure your website doesn’t exclude anyone at all. Remember that you cannot necessarily tell whether someone has a disability just by seeing them, or interacting with them for a few seconds. Many types of disabilities can affect a user’s experience with a website and how they gain access to information, such as cognitive or mental impairments or less severe vision impairments. In addition, disabilities can be temporary or lifelong, the result of an accident or something that develops over time. Keep in mind that internet users over the age of 65 will not have the same experience as users in their 20s, and both groups might be in your target audience. In short, you need to get inclusive about inclusivity.
Assistive technology: an overview Assistive technology refers to any device or additional functionalities specifically designed and built to aid those with disabilities. This can be anything from a screen reader to a stair lift. The term applies to a range of devices that serve many different purposes. Some assistive technology is built into operating systems, such as being able to switch the text size display on an iPhone. Others require separate hardware or software in order for the user to interact with the device.
1 2
https://www.census.gov/content/dam/Census/library/publications/2018/demo/p70-152.pdf https://www.interactiveaccessibility.com/accessibility-statistics
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 4
Screen Readers: Software applications that dictate onscreen content and instructions to users via text-to-speech, sound indications, or Braille devices. Used by people who are blind or visually impaired, but also useful for people with learning disabilities or who are illiterate. Popular examples: JAWS and NonVisual Desktop Access Speech Input: Transforms spoken words into digital formats by using a microphone or other input device. Used by people who experience difficulties using a keyboard or who can only type very slowly. Popular examples: Siri (and other voice assistants), Dragon, Cortana Zoom/Magnification Software: Enlarges text and other content to increase visibility on computers and mobile devices. Used by people with vision impairments Popular examples: Magnifier App for Windows, ZoomText
Rebooting your project process: Accessibility first Ensuring accessibility for a website or digital product should not be one team member’s responsibility, or handing them a project and saying, “Here, make sure this is good.” Accessibility is a significant team effort, both in terms of different skills and creating something with a shared philosophy. Here’s how different roles incorporate accessibility in a web project, from initial ideas to long-term content management. Designer: For a website, the Designer on the project will shape how the website will present visually, both when the user interacts with it and its natural state– i.e. How something looks with a hover state versus before you hover over it. The designer is also a key decision maker on determining the hierarchy of information Designer is an inclusive title. Everyone is helping to create and modify experiences, including written content and code. Developer: Developers determine the site’s operability and how the user will end up interacting with the site to both match the design, and shape the best possible experience for the user and the brand. Developers should incorporate best code practices for accessibility, including the use of semantic HTML, adding readable and helpful page landmarks, and adding labels to form fields, in addition to adding alternative text throughout the page to better assist users relying on screen readers.
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 5
Project/Product Manager: Project and product managers play significant roles in ensuring that accessibility best practices are at the forefront of the project itself, and that everyone involved is on board with this. They keep executives and other stakeholders informed, and make sure everyone is working toward a common goal. Content Manager: Content managers and writers are key players for not just introducing accessibility, but maintaining it and making sure that new content producers are trained to follow the accessible styles and content they establish. Content managers ensure content is written in plain English, is well structured, and that the most important information either comes first, or is summarized at the beginning of a page or post. Supervisor/Stakeholder: Project stakeholders have an important role in prioritizing accessibility. This can take place in several ways. Adding accessibility or a certain level of WCAG compliance in an RFP will help stakeholders choose a capable, like minded vendor (or vendors). Announcing this priority at the very beginning will help establish the goals of a project that go beyond product or branding. In addition, stakeholders can uphold this by asking the project manager to report on accessibility progress, hire a third party to evaluate the site or product before launch, or invest in accessibility user testing during the QA process.
Creating and maintaining accessible content Accessibility principles apply to written content and various types of media used to convey information or to tell a story on a website. Content structure and the language/terminology used to convey information should incorporate the Spoon Theory3. Everyone starts their day (or other time period) with a set number of spoons. People who navigate their day to day lives while working around a disability, mental illness, or physical illness inevitably start out with fewer spoons than someone who is able bodied and healthy. You dispense your spoons throughout day based on your activities. One for getting up in the morning, one for showering, commuting, etc. At the end of the day, you have to decide what you do with your last spoon: make and eat dinner, shower, exercise, or whatever else you want to prioritize. When you start out with fewer spoons, they are infinitely more valuable. The more difficult a website’s content is, the more energy (or spoons) you take away from your users. Focusing on written content accessibility helps everyone, but it is essential to aid certain groups of users. These groups can include those with dyslexia or any other type of learning disorder, users who have trouble focusing, and content’s visual elements can help users who have to strain their eyes to read longer texts.
3
https://butyoudontlooksick.com/articles/written-by-christine/the-spoon-theory/
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 6
To increase your content’s accessibility, follow these guidelines: ●
● ●
●
Establish and maintain a tone for your site that uses plain English and avoids language that adds complexity without adding value. If you can explain something in layman’s terms, do it! Or, introduce a subject with a simple explanation and then dive into the more technical in-depth analysis. Use short sentences Break up long paragraphs or works with numbered or bulleted lists. This also helps grab a user’s attention if they are just scrolling through one of your pages or posts, and didn’t start reading it from the beginning. Use headers appropriately by establishing a hierarchy, with the largest headers at the top of the page (i.e. page or post title), and H3-H5 used to break up content into sections and provide more landmarks in the text. Almost 7/10 users who are reading and interacting content via screen readers use headings to navigate pages in order to skip to relevant content. Most importantly, keep in mind that you have as little as little as three to eight seconds4 to grab a user’s attention before they navigate away from the page.
Disorganized content is difficult to read– in addition to excluding some users, you provide less incentives for users to trust your site and content.
Investing in accessibility Even if a department or organization believes in prioritizing accessibility, you inevitably need to invest your time and money into effective tools and training. This is typically where you might lose the interest in stakeholders. You might hear these responses: ● ● ●
“We don’t have the budget for those kind of website improvements this year.” “Marketing doesn’t have the time to do a content audit.” “This sounds like a big project for the IT department, we need them to focus on other things right now.”
These stakeholders or their predecessors probably said the exact same thing about responsive design, or security. Now, those priorities are nonissues. It’s obvious that websites need to be hosted securely (especially while dealing with confidential information or processing transactions), and look good on a range of mobile devices. In the near future, accessibility should receive the same level of prioritization.
4
https://www.adweek.com/digital/john-stevens-guest-post-decreasing-attention-spans/
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 7
If the people who hold the magic money wand still don’t budge, it might be worth reminding them that they are resisting translating their intentions into actions. Having the intention to prioritize accessibility or to expand your services lacks meaning until action takes place. There is a movement to show more support for companies and organizations who prioritize accessibility - think of the disposable income of people with disabilities and their entire networks who tend to be vocal about when a website or organization provides good accommodation or when they don’t. If higher ups are skeptical about investing in accessibility, here are some points to emphasize. Audience expansion = profits: Marketing professionals are always looking for more ways to expand reach and leverage messaging with target audiences. The more people you include, the more people you attract to your brand. Accessibility is about giving people agency and the ability to make more choices for themselves. Prioritizing competitiveness amongst all users (i.e. making it so users can access your product or information) is the most effective way to leverage your digital presence and expand your reach. In addition to reaching disabled users, measures to make your website more accessible may help you reach more people in general. If your website follows Web Content Accessibility Guidelines and uses them effectively, it is more likely to appeal to human users as well as search engines, which can give your site an SEO boost. Improve organization’s public image: Don’t do it just for a pat on the back you can advertise, but organizations that take a stance on usability and inclusiveness resonate with audiences. It’s all about generating empathy– if a company leverages itself as being more inclusive of disabled users and makes an effort to try and reach them, this generates a positive message for both that group and others. Apple5 does an excellent job of presenting and promoting accessibility measures on their devices. Accessibility increases efficiency for building better websites: Prioritizing accessibility can help ensure that developers use best practices for their code, and that the site just works b etter as a whole. With significant emphasis on establishing clear page sections and making sure the site is operable, designing and building for accessibility streamlines both development and QA. If something doesn’t work just by using a keyboard while a developer is working on something in their local environment, it shouldn’t become a part of the site. Don’t get sued: Sometimes, it takes a negative incentive in order to convince stakeholders that something should be prioritized. If a website’s lack of accessibility impedes the rights of disabled individuals to receive the same services as abled users, there could be grounds for a lawsuit. Here are some key examples: 5
https://www.apple.com/accessibility/
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 8
●
●
In Gil vs. Winn-Dixie, blind user Mr. Gil said that he could not access a number of features on Winn-Dixie’s website while using his screen reader. Winn-Dixie, a large grocery store chain with several locations in southeastern states, advertises a number of services on their site that were allegedly inaccessible to Mr. Gil, including the online prescription refill service and coupons. The court ruled that the grocery store’s website was a significant gateway to accessing the full range of services for their physical stores, and violated the ADA as a result. In a similar case from 2016, blind man Guillermo Robles filed a lawsuit against Domino’s claiming that the pizza restaurant chain’s website and mobile app were not compatible with screen reader software. Domino’s offered coupons that could only be accessed through these platforms– not by going in the physical stores, meaning that Robles could not access the same information as users who can fully navigate their website and app. The court ruled in favor of Robles, stating that limiting customers’ ability to access coupons online would affect their access to services in brick and mortar stores.
Key takeaways Successfully developing an organization-wide dedication to accessibility doesn’t happen overnight. Even if your colleagues are driven and energized by the purpose or idea, effective implementation can only become a reality by reaching out for expert assistance, educating team members, and driving an initiative for long-term change on how your colleagues think and speak about accessibility. Here’s a summarized list of action points to help get you started: 1. Identify what aspects of your site lack accessibility: Does your website’s color scheme lack adequate contrast? Are you concerned about not meeting code standards to maximize screen reader usability? Is it your content? Even if you don’t know exactly what to look for, identify potential concerns that you want to be evaluated during an accessibility audit. 2. Bring in the experts: Whether it’s an agency like Knowbility that almost exclusively works on accessibility audits and accessible site redesigns or a developer with more experience in this arena, bring someone else in to identify your problem areas. This will also help you determine whether you are better off implementing fixes or redesigning your entire site. 3. Develop your action plan: Based on the audit results, determine your next steps and timeline. Can potential changes be a project for internal developers? Or will you need to hire an agency to conduct a complete redesign? Outline your requirements and next steps to start determining timeline and cost. 4. Implement changes and test: Make sure your technical changes are as effective as possible by running both automated tests and reaching out to users to test. © 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 9
5. Set and maintain content standards: Changing your content production workflow and re-educating content producers is often not just a department change, but represents a shift through a whole organization. Train content producers and provide reference documents and guides to ensure that everyone is on board with the new style of producing content. 6. Maintain your site with necessary updates: Like any other aspect of technical maintenance, improvements are made over time to WCAG and general best accessibility practices. Making your site accessible is not a one-time project: it’s a journey that should last as long as your organization will.
Helpful Tools Accessibility HTML evaluation tool: https://achecker.ca/checker/index.php Accessibility Chrome Extension for developers: https://accessibilityinsights.io/docs/en/web/overview Other tips: https://webaccess.berkeley.edu/resources/tips/web-accessibility
References https://www.census.gov/content/dam/Census/library/publications/2018/demo/p70-152.pdf https://www.interactiveaccessibility.com/accessibility-statistics https://butyoudontlooksick.com/articles/written-by-christine/the-spoon-theory/ https://www.adweek.com/digital/john-stevens-guest-post-decreasing-attention-spans/ ttps://www.apple.com/accessibility/
© 6-19-2019 I-SITE
Incorporating Accessibility into Your Next Web Project: An Overview
Page 10