So much accessibility writing I find focus on interfaces, like buttons or forms. But I've seen fewer, scattered articles about keeping a webpage's actual content accessible. Many may take it for granted that assistive tech can always read text content right. But, as I've learned myself while playing with VoiceOver, this isn't always the case.
The below rules of thumb are how to keep general web content like blog posts accessible. No matter how accessible the path to your content is, it's all for nothing if users can't understand it.
Write for Humans #
Make the writing clear, succinct, scannable, and action-oriented. Meandering or excessive words are a burden to all to some degree. This also helps those with cognitive disabilities or impairments most. Some good tricks for this are:
- Use the "inverted pyramid" approach to writing. Start with the most important information and work your way down to the lesser details.
- Avoid obscure jargon or unexplained acronyms. If you must include acronyms, write them out completely the first time.
- Related to this, don’t replace letters with numbers or symbols. It's not only inaccessible, it's been lame for years.
- Avoid writing words in all caps or with any unneeded capitalization. This affects how screen readers say the text aloud to users.
- Limit the use of italics.
- Align text to the left as much as possible to ensure even spacing and easier reading.
Online tools like the Hemingway app can help tighten up any writing. Or read the writing out loud and imagine someone was saying it as part of a conversation. Ask yourself what parts would make you lose your attention if someone said it to you.
Hyperlinks Should Stand Alone #
Not everyone knows screen readers can gather up and list all the hyperlinks on a page. It's the same way visual users skim articles for any links. The "rotor menu" makes this possible, but that's a post for another day. For now, know assistive tech can make a big list of all your page's hyperlinks at any moment.
This means your hyperlinks should make sense even if pulled from a paragraph. Its text should be more like "read more about X here," instead of only saying something obscure "click here." Any other links or interactive items, like forms and skip links, should also have unique names. Otherwise, it's harder to tell them apart when they're all grouped together.
Use Semantic Headings #
No one likes dealing with a huge block of text. It's harder to skim, understand, and can put more strain on one's eyes and ability to focus. Text content should get broken into logical chunks separated by headers. Pivot menus can see a list of headings too that lets users jump around the content.
This means we need to use semantic header tags too. There should only be one h1 tag for the page's title. Page subsections should start lead with h2 subheadings. Subsections within those should use h3 tags, and so on. This helps users of all types better scan content like visual users do.
Important page elements like navigations, filters, or menus should also include headings. Even if they’re visually hidden, they’ll let screen readers see them through pivot menus too.
Give Transcripts or Captions #
Users may not always be able to listen to audio or video. This depends on their disabilities, location, or their preferences. Text transcripts and video captions are the most reliable ways around this.
This makes it easier for almost any type of content to be much more accessible. Transcripts often take more time to add, but are simpler, more scannable, and better for SEO. If it’s a video dependent on the visuals, lean more towards captions.