A Marketer’s Guide to Website Accessibility: The Importance of Inclusive Design

A Marketer’s Guide to Website Accessibility: The Importance of Inclusive Design

The Internet is the most powerful resource ever made, but unfortunately, not everyone can take full advantage of it. As the world becomes more connected, it’s important to ensure everyone is included, especially those who are impaired or have disabilities. The most recent census showed 19% of the American population has a disability, a huge percentage that shouldn’t be ignored when building your digital marketing strategy.

The United States, through the Americans with Disabilities Act, has made great strides to ensure impaired and disabled people have access to public places. This applies to the internet as well, although these standards are not as clearly defined by the law. This is because the ADA was passed in 1990, long before the internet began to emerge. The World Wide Web Consortium (W3C), established Web Accessibility Standards in 2008, which aim to better define what an accessible website looks like.

What is web accessibility?

Web accessibility allows impaired and disabled people to interact with websites, tools and technology. There are 3 levels of accessibility under the Web Consortium Accessibility Guidelines (WCAG). The more accessible you want a website, the more work that needs to be done. Because implementation costs can be prohibitive, these levels give businesses flexibility when defining their accessibility goals.

LEVEL A (Beginner)

This is the easiest level of compliance to achieve. It will improve your website’s experience for people with and without impairments or disabilities. Every modern website should strive to adhere to this at a minimum.

Guidelines

1.1.1 – Non-text Content: Provide text alternatives for non-text content

1.2.1 – Audio-only and Video-only (Pre-recorded): Provide an alternative to video-only and audio-only content

1.2.2 – Captions (Pre-recorded): Provide captions for videos with audio

1.2.3 – Audio Description or Media Alternative (Pre-recorded): Video with audio has the second alternative

1.3.1 – Info and Relationships: Logical structure

1.3.2 – Meaningful Sequence: Present content in a meaningful order

1.3.3 – Sensory Characteristics: Use more than one sense for instructions

1.4.1 – Use of Color: Don’t use a presentation that relies solely on color

1.4.2 – Audio Control: Don’t play audio automatically

2.1.1 – Keyboard: Accessible by keyboard only

2.1.2 – No Keyboard Trap: Don’t trap keyboard users

2.2.1 – Timing Adjustable: Time limits have user controls

2.2.2 – Pause, Stop, Hide: Provide user controls for moving content

2.3.1 – Three Flashes or Below: No content flashes more than three times per second

2.4.1 – Bypass Blocks: Provide a ‘Skip to Content’ link

2.4.2 – Page Titled: Use helpful and clear page titles

2.4.3 – Focus Order: Logical order

2.4.4 – Link Purpose (In Context): Every link’s purpose is clear from its context

3.1.1 – Language of Page: Page has a language assigned

3.2.1 – On Focus: Elements do not change when they receive focus

3.2.2 – On Input: Elements do not change when they receive input

3.3.1 – Error Identification: Clearly identify input errors

3.3.2 – Labels or Instructions: Label elements and give instructions

4.1.1 – Parsing: No major code errors

4.1.2 – Name, Role, Value: Build all elements for accessibility

LEVEL AA (Intermediate)

In January 2017, WCAG 2.0 level AA was adopted as the standard for US federal websites. This level will provide more benefits to a greater number of users than the A level. All modern websites are encouraged to achieve this level. While private US websites aren’t required to meet this standard yet, they do have a legal obligation to be accessible.

Guidelines

1.2.4 – Captions (Live): Live videos have captions

1.2.5 – Audio Description (Pre-recorded): Users have access to audio description for video content

1.4.3 – Contrast (Minimum): Contrast ratio between text and background is at least 4.5:1

1.4.4 – Resize Text: Text can be resized to 200% without loss of content or function

1.4.5 – Images of Text: Don’t use images of text

2.4.5 – Multiple Ways: Offer several ways to find pages

2.4.6 – Headings and Labels: Use clear headings and labels

2.4.7 – Focus Visible: Ensure keyboard focus is visible and clear

3.1.2 – Language of Parts: Tell users when the language on a page changes

3.2.3 – Consistent Navigation: Use menus consistently

3.2.4 – Consistent Identification: Use icons and buttons consistently

3.3.3 – Error Suggestion: Suggest fixes when users make errors

3.3.4- Error Prevention (Legal, Financial, Data): Reduce the risk of input errors for sensitive data

LEVEL AAA (Advanced)

This is the best of the best, and isn’t easily achieved. This level doesn’t just look at the technical aspect but is strict about content as well. Under AAA, if anything on a web page is written at 10th-grade level or higher, it requires additional explanation. Other hurdles for this level include live audio text transcription and sign language recordings.

Guidelines

1.2.6 – Sign Language (Pre-recorded): Provide sign language translations for videos

1.2.7 – Extended Audio description (Pre-recorded): Provide extended audio description for videos

1.2.8 – Media Alternative (Pre-recorded): Provide a text alternative to videos

1.2.9 – Audio Only (Live): Provide alternatives for live audio

1.4.6 – Contrast (Enhanced): Contrast ratio between text and background is at least 7:1

1.4.7 – Low or No Background Audio: Audio is clear for listeners to hear

1.4.8 – Visual Presentation: Offer users a range of presentation options

1.4.9 – Images of Text (No Exception): Don’t use images of text

2.1.3 – Keyboard (No Exception): Accessible by keyboard only, without exception

2.2.3 – No Timing: No time limits

2.2.4 – Interruptions: Don’t interrupt users

2.2.5 – Re-authenticating: Save user data when re-authenticating

2.3.2 – Three Flashes: No content flashes more than three times per second

2.4.8 – Location: Let users know where they are on the website

2.4.9 – Link Purpose (Link Only): Every link’s purpose is clear from its text

2.4.10 – Section Headings: Break up content with headings

3.1.3 – Unusual words: Explain any strange words

3.1.4 – Abbreviations: Explain any abbreviations

3.1.5 – Reading Level: Users with nine years of school can read your content

3.1.6 – Pronunciation: Explain any words that are hard to pronounce

3.2.5 – Change on Request: Don’t change elements on your website until users ask

3.3.5 – Help: Provide detailed help and instructions

3.3.6 – Error Prevention (All): Reduce the risk of all input errors

Grow your audience by including everyone

To build your online presence, it’s best to appeal to the largest possible target audience. The more “A’s” you earn, the larger your prospective audience. A website developed with a great user experience in mind will allow disabled people to participate in the experience.

These standards don’t just help impaired and disabled people. These standards also help aging people, someone with a broken arm, someone who may be missing their glasses, someone who is in the sun, or someone who can’t listen to audio at the moment.

A-Marketers-Guide-to-Web-Accessibility-The-Importance-of-Inclusive-Design_In-copy-graphic

By adhering to accessibility standards, you won’t just grow your audience. You’ll earn loyal advocates who trust your organization to provide them with a positive, meaningful experience. Before you know it, your reputation will begin to spread in these communities.

What types of impairments and disabilities does web accessibility focus on?

  • Vision Impairment: Alt text to describe images is important for screen readers. Color contrast rules are also important to ensure content is easy to read.
  • Hearing Impairment: Transcripts for audio or video recordings are important for the hearing impaired.
  • Physically Disabled Users: Some users may not have enough hands to use a mouse and rely on a keyboard to navigate websites instead.

Accessibility Foundations: The Four Pillars

The WCAG has developed four pillars used to help marketers improve accessibility and user experience:

1. Is your site perceivable?

Can users perceive your site with their available senses? Can the visually impaired use your site with a screen reader or other audio options? This includes content sizing and contrast.

2. Is your site operable?

Does your site operate well using a mouse, keyboard, or other input technology? Some users don’t have mice, and have to use their keyboard to navigate the site. Can you do everything on your website using a keyboard that you would with a mouse?

3. Is your site understandable?

Is your site intuitive and predictable? Is it easy to find what you’re looking for? Does the content make sense? Are titles used appropriately?

4. Is your site robust?

Is your site built to function in all modern web browsers and on all modern devices? Is your code and stack up to date? Are there any code errors?

Are you adhering to the law? Do it now, or pay later.

The DOJ is responsible for enforcing the Americans with Disabilities Act. While DOJ doesn’t have any current guidelines for private website accessibility standards, the ADA still applies to websites. Any business operating in the United States can be sued under the Americans with Disabilities act if a plaintiff has evidence that a website isn’t relatively accessible to those with disabilities.

The number of accessibility lawsuits continues to grow exponentially. There were 58 federal lawsuits filed in 2015, but that ballooned to 814 in 2017.

California courts have also seen a spike in lawsuits under California non-discrimination laws. In 2017 the US Department of Education’s Office for Civil Rights received 250 complaints about the accessibility of higher education institutions. Settlements from accessibility lawsuits can be huge, with Target paying out $6,000,000 in 2008 to the National Federation of the Blind.

In today’s open world, it’s more important than ever to provide experiences which can include everyone. As technology continues to advance, it is important to also improve how it is interacted with. By improving your website’s accessibility, you’ll grow your audience, earn advocates, establish trust and protect your business from financial penalties.

Content-Marketing-Measurement-Header-250x250

Need Help Getting Started?

If your website isn’t accessible for all web users, you’re missing out on a big opportunity to build your owned audience.

Our team is the very best at leveraging our client’s owned audience for real growth – but it all must start with a solid, documented strategy. Find out how we can start helping your brand grow like never before.

Learn More Now!

Josh Taylor
josht@verticalmeasures.com

Josh started his career at a digital agency where he became heavily involved in all aspects of digital marketing. His responsibilities included conversion rate optimization, paid media, search engine optimization, lead nurturing, web design and development. He has worked on a wide variety of projects across a broad range of industries including construction, e-commerce, events, healthcare, higher education, home services, lending, political campaigns and software.