Accessibility Without the Jargon

What this covers

Not the technical layer. The content layer, which is what a business owner actually writes and controls.

Three things account for most of the practical difficulty on a typical small business site, and all three are writing tasks rather than development ones.

Describing images

Alternative text is what a screen reader announces in place of an image, and it is also what appears if the image fails to load.

The rule that resolves most confusion: describe the information the image carries, in context, rather than describing the picture.

A photograph of a completed roof on a service page is not roof. It is what it shows that matters to the page: a re-shingled roof with new flashing around the chimney.

• Be specific and brief, a sentence rather than a paragraph.
• Do not start with image of or photo of, since the reader already knows it is an image.
• Include text that appears in the image, since otherwise it is lost entirely.
• Leave it empty for purely decorative images, which tells a screen reader to skip rather than announce a filename.
• Do not repeat the caption, or the same sentence is heard twice.

That fourth point is the one people get wrong in the other direction. An empty alternative attribute on a decorative image is correct and better than describing a background pattern.

The common failure is a system inserting the filename automatically, which produces a screen reader announcing a string of characters. That is worse than nothing and it is on most sites nobody has checked.

Headings in order

Headings are how somebody using a screen reader navigates a page, in the same way a sighted reader scans it.

Which means they have to be actual headings rather than text made large and bold, and they have to descend in order without skipping levels.

One main heading per page describing what the page is. Section headings below it. Subsections below those. A page that jumps from a main heading to a third-level heading breaks the outline somebody is navigating by.

The frequent cause is choosing a heading level for its appearance rather than its position. If a level looks wrong, that is a styling question rather than a reason to use a different level.

A practical check: read only the headings of a page in order and see whether they form a sensible summary. If they do, the structure works. If they read as a jumble, sighted readers are also struggling and simply not saying so.

Link text that means something

Screen readers can list every link on a page, out of context, as a navigation method.

A page whose links are all click here, read more, and learn more produces a list that conveys nothing, and the visitor has to return to each one to find out where it goes.

The fix is writing the destination into the link. Read our pricing rather than click here for pricing. See what a kitchen renovation costs rather than learn more.

That also helps sighted readers, who scan for links, and it helps search engines understand what the linked page is about. It is one of the rare changes that helps every audience at once.

Two related habits: do not use a bare address as link text, since a screen reader reads it character by character, and say when a link opens a document or a new window, since an unexpected change is disorienting.

The other content-level items

Smaller and worth knowing.

Do not rely on colour alone to convey meaning, such as marking required fields in red only. Add a symbol or a word.

Write link and button text as actions, so a control announces what it does.

Give tables proper headers, so values can be associated with what they mean.

Use lists for lists, since a screen reader announces how many items there are, which is genuinely helpful.

Caption video, which is the largest single accessibility gap on sites that use it.

Documents

Frequently overlooked and frequently the least accessible thing on a site.

A price list, a form, or a brochure published as a scanned document is an image of text, unreadable by a screen reader and unsearchable.

The practical answer for a small business is usually to publish the content as a page instead, which is more accessible, faster, findable in search, and easier to update.

Where a document must exist, it should be generated from a text source rather than scanned, and offered alongside a readable version rather than instead of one.

The check that takes ten minutes

1. Look at the alternative text on your main pages for filenames or blanks that should not be blank.
2. Read the headings in order and see whether they summarise the page.
3. Read your links out of context and see whether any are click here.
4. Check whether anything relies on colour alone.
5. Find any scanned documents and consider replacing them with pages.

None of that requires a developer, all of it improves the site for every visitor, and together with contrast and text size it addresses most of what actually gets in people's way, which is covered in making text readable for everyone.

Frequently asked questions

West Coast Media Solutions Inc. provides web design, web development, hosting, digital marketing, and business consulting to organisations across Canada, drawing on more than twenty-five years in the field.