How to write accessible web content

Accessible content is better content

When you think about accessibility on the web, you may think it’s an optional “add-on” that only benefits people with disabilities. But accessible websites benefit all audiences! At Pixo, we know accessibility is a requirement, and we treat it as everyone’s responsibility — from developers to designers to the folks who write the content.

If you’re a content creator, you have countless opportunities to make your work more accessible and useful to all.

A few rules of thumb for optimizing content, especially for people using screen readers and other assistive technologies:

ABBREVIATIONS AND JARGON

• For the first use of each unique abbreviation in your text, include the full name, followed by the abbreviation, in parentheses:
  • Disability Discrimination Act (DDA)
  • Or as an explanation of the abbreviation: ABS (anti-lock brakes)
• Avoid abbreviation and jargon in headings.

HEADINGS

• Use brief, clear headings to group related paragraphs and describe the sections.
• Ensure headings are properly nested within each section of your text.
• For example, follow a Heading 1 with a Heading 2, and so on.

LINK TEXT

• Avoid “click here” link text. Make link text unique that indicates where a person will go when they click that link. Having two URLs with the same link text will cause an accessibility violation.
• Avoid using URLs for link text.
• For links to email addresses, use the email address as the link text.
• For links to documents and files, include the file type (e.g. PDF, Word, etc.) and the file size within the link text.
• Alert the user when opening new windows. It is important to warn people with disabilities that a new window has been opened — especially people with cognitive disabilities who may not notice. The best way to indicate that a link opens in a new window is to add text to the link, such as “(opens in new window).”

IMAGES

• Think of alt text kind of like a tweet. It should be succinct, but it should still accurately report what’s going on in the image. For guidance, ask: “What message are we trying to convey with this image?”
• Don’t keyword-stuff. Search engines read alt text, but its primary purpose is for users. Make sure the alt text is actually useful for understanding the image. It’ll pay off over time.
• Avoid using phrases, such as “image of…” or “graphic of…” because the <img> tag already tells the screen reader the text is of an image.
• If the image is purely decorative, then add an empty alt attribute (alt=””).

MEDIA

•  Video and audio should have captions, audio descriptions, text transcripts, or an equivalent.

Just by following these basic rules, you can make your web content more equitable and useful to all visitors.

Need an accessibility audit?

If you need help evaluating your website for accessibility, get in touch.