Writing for Web Accessibility

Write better web content for screen readers and the humans who use them

headphones.jpeg

Web content isn’t human-centered if not all humans can easily understand it. It potentially leaves tons of money on the table for businesses, too. Writing more accessible, inclusive content, is a simple way to improve your website so that it reaches and resonates with all your users instead of a select group. Here are some practical tips for writing more accessible web content.

What is accessibility and why does it matter?

Accessibility refers to how easy it is for people with disabilities to use your website, product, or other type of interface. Think of accessibility as ease of use. The easier it is for all humans to use your website (regardless of their abilities), the more accessible your website is.

Accessibility matters because people matter.

Web accessibility matters for both practical and ethical reasons. On the practical side, an inaccessible website means that users with disabilities can’t buy your product or service. Less money and customers for your business. On the ethical side, having an accessible website is just the nice-human thing to do. Why should someone be excluded from your website just because they are differently abled? There’s no good reason for it — especially since accessibility isn’t hard to accomplish once you understand it.

Web accessibility and the law

There are no specific web accessibility laws in the United States for non-government websites. However, the Americans with Disabilities Act (ADA) generally protects people’s rights to access public business spaces. In fact, a 2019 accessibility suit against Domino’s Pizza, the court ultimately ruled in favor of the defendant. It’s best to avoid any legal hassles by making sure all your digital experiences are accessible to everyone. Even Beyoncé is not above accessibility, and that’s saying something.

Understanding assistive technology

The first thing you should understand is that people with disabilities use assistive technology to help them use the web. For visually impaired users, that’s mainly screen readers, which either translate text into brail or read it as audio. For hearing impaired users, having accurate captions and transcriptions are really important.

The second thing should know is that users with disabilities are not much different than any other user: they still want to skim or quickly scan a web page to find useful information quickly. People using screen readers simply scan in a different way. Screen readers allow people to “tab” through headers and subheads, and any clickable links. That’s why we’re starting with headers, CTAs, and hyperlinks when it comes to writing for accessibility.

Headers and subheads

Headers and subheads, since they may be read on their own by someone skimming, should make sense individually and as a series. Having clear, meaningful headers and subheads helps people get a quick understanding of the content, and guides them to sections they may want to read in full.

As tempting as it may be, try not to use your headers and subheads with vague marketing-speak. A section header like “Choose your own adventure!” is cute, but not as clear or helpful as, “What we offer.”

Hyperlinks and button text

Similarly, hyperlinks and buttons should make sense when read on their own (without any supporting copy or images around them). Imagine if someone only read the hyperlinks and CTAs on your web page: would the user know what to click on?

Cutesy, vague hyperlinks and buttons are one of the most common accessibility issues we see in web content. It’s so tempting for writers to get creative with button text, but it’s really tough for users reading screen readers. Again, ask yourself: if someone only read this text, would it make senses? If the answer is no, then you need to change it.

Just click here!.jpg
Ooh, gimme!.jpg
yes please!.jpg

I don’t want to call out any specific websites, but here are some real world examples of button-text on services pages that are not accessible:

  • “Just click here!” — takes the user to a form.

  • “OOH, gimme!” — takes the user to a checkout page.

  • “Yes please!” — takes the user to a contact page.

Imagine if someone read a series of hyperlinks and buttons like that, and how frustrating that would be.

Helpful button text is empathy for the user in practice.

Repetitive hyperlinks and button text is also a common issue. For example, an FAQ page that links to helpful resources — but all the hyperlinks say “learn more.” If a blind user with a screen reader scans your page, how are they going to know which one to click on if they all say the same thing? They won’t.

Solution: write buttons and hyperlinks that tell the user what they can expect if they click on it.

Alternate text for images

Alternate text, also called ALT text, is how screen readers give users information about images they can’t see. As a best practice, any image that contains crucial information should have ALT text.

If the image is just pretty and doesn’t actually add any value to the content, it may actually be more useful not to write ALT text. For a more in-depth explanation of this, read 7 guidelines for writing accessible microcopy.

When you do write ALT text, don’t write “image of…” at the beginning of each sentence. The screen reader will have already communicated to the user that it’s an image, so it’s just unnecessary. Do try to explain why the image matters. If it’s a complex chart or graph, try to summarize the point it illustrates.

One common issue with ALT text is keyword-stuffing. This is when a writer has some understanding of ALT text, but doesn’t quite understand accessibility. Instead of writing a meaningful description, they just list a series of keywords like: “guidelines alt text content tips tricks guidelines accessibility.” That sentence obviously has some keywords, but doesn’t make sense or add any value. If you’re going to use a keyword, do so in a sentence that means something helpful and appropriate.

Plain language, jargon, idioms, and more

Use plain language, and avoid idioms and jargon at all costs. When you do use acronyms or jargon, make sure you explain them first.

Writing in“plain language” means using simple sentence structure and commonly understood words. It’s not about talking down to your reader, it’s just about making things easier for them. Even people who do understand complex language don’t always want to read it. Plain language makes things easier for everyone.

Idioms, jargon, metaphors, and smilies are problematic for global audiences, users with lower literacy levels, or users who speak english as a second language. That’s a lot of people that are potentially left out or confused by your content, so just avoid them altogether.

Contrast for text and the background

Without enough contrast between text and the background it’s on, users with low vision or color blindness will struggle to read the text. This could be text on top a solid background that is too close to the color of the text, or just an image that has light and dark areas. There are plenty of online “contrast checkers” on the internet, but the best and easiest way to check your contrast is by squinting/blurring your own eyes. If you can’t read the text easily when you’re squinting, try to fix it.

THIS IS NOT ACCESSIBLE.jpg
This+is+not+accessible+either%2C+low+contrast.jpg

Descriptive, directional language

“For more information, click the red button.”

“To get started on the above, click below!”

“For help, click the icon in the bottom right corner.”

Those are all real sentences I’ve read on websites. Cringe. Imagine if you are color blind or using a screen reader — those sentences would be so frustrating or entirely meaningless. Try not to use language that assumes all your users have the same abilities.

Transcriptions and captions for audio

Any video or audio on a website should have captions and a full-transcript to be accessible. This isn’t a writing tip, but it is a good rule for accessibility that writers can play a part in. For users who are hearing impaired, it’s essential to include these in order to be accessible and human-centered.

Most video hosting platforms, like YouTube, offer auto-generated captions to make this even easier to do. If you don’t have the time or resources to have someone write captions, this is better than nothing. Whenever possible, though, have a real human create the captions. Auto-generated versions can easily miss things or mix-up words that sound similar, which is not a great experience.

Gendered language

“Shopping for Valentine’s Day? Buy her something special!” But what if you’re a man whose partner is a man?

“Plan the perfect proposal: ways to WOW her.” But what if you’re a woman who wants to propose yourself?

“Select your gender: man, woman.” But what if you are neither?

No two humans are the same. If we truly want our websites and digital experiences to be accessible, they also need to be inclusive. We need to stop making big assumptions about people’s gender or sexual orientation when we write for the web. It’s 2019, and it’s time we stop. Ethics and beliefs aside, there’s usually not a valid reason to use gendered language anyways.

The next time you catch yourself or another writer using gendered language, try asking “why.” Does it need to be gendered? Is there something specific gained? If we remove the gendered language, do we lose anything? In most cases, it’s just not needed.

For more about inclusive interfaces, please read Technically Wrong: Sexist Apps, Biased Algorithms, and Other Threats of Toxic Tech by Sara Wachter-Boettcher. It’s an incredible book that offers a deeper explanation of the problem and more solutions.

Final tips and takeaways

If nothing else, you should know that accessibility benefits everyone. The more accessible your web content is, the easier and better it is for everyone. So even if you feel like users with disabilities are a small part of your audience, there’s still a large benefit to following accessibility best practices for your content.

Recap:

  • Accessibility matters, and content plays a big role.

  • Any writer can contribute to improving accessibility.

  • Write clear, useful hyperlinks, buttons, headers, and subheads

  • Include helpful alternate text when it adds value.

  • Use plain language and avoid jargon.

  • Don’t assume your reader can see or hear perfectly.

  • Don’t make assumptions about gender, either.

We hope this was useful! If you need a partner to help make your web content more accessible, please reach out on our contact page.