Facebook

It’s often something that gets overlooked by small businesses launching their website on a budget. However it’s a box that needs checking. In the US, businesses whose sites are not accessible are liable for discrimination. This isn’t the case in Australia yet, but we’d recommend that if your services could possibly be used by someone with an impairment, make sure that you cater for them on your site.

To be honest, this is an ongoing effort, as maintaining accessibility requires thinking in ways we don’t usually have to. This can be technical, such as tab order, but also related to simple design choices.

We think accessibility is important because providing usability for people with a range of impairments is good for your business, as well as supporting those customers. It’s the right thing to do, and shouldn’t be treated as a nice-to-have, or an afterthought.

But what can you do about it? Here are things you need to be thinking about with regard to accessibility. We’ll start with the design-related things, which you can think of as low-hanging fruit in terms of achievability.

Content & design accessibility fixes

These are the things you can do something about without tearing your site to pieces, and without spending money (or not spending a lot, depending on your web publishing skillset).

Content structure

This is a big one as it also relates to your SEO. Both search engines and the visually impaired are observing your site without whatever visual aids you’ve implemented in your design. So using HTML to properly to structure your content is a must.

You need clearly and logically laid our headers and paragraphs in your content. For example, there should only be one Heading 1 (H1) on a page, and this would usually be the post/page title (or the site name/title on the homepage). H2 and H3s etc should be nested logically so your content can be divided into sections and subsections, according to the topic. If you look at this article, we’ve split it into two H2 sections (design and technical fixes) with several H3 subsections in each.

Accessible content structure is an ongoing effort – every time you publish you need to think about how your information is laid out.

Text contrast ratio

This is the contrast between the text and the background. If it’s too low, while people with good eyesight might be OK, people with even a slight visual impairment might have difficulty reading your words. And this isn’t a small number of people!

Text size

Likewise, you need to ensure that your text is big enough to read. We use Divi, which is great, but one of its accessibility problems is that by default, the text is far too small (and low contrast). This is easily fixed of course, but it goes to show that defaults often need tweaking to get better results.

Alt text on images

When you upload an image, most CMSs ask you to enter ‘alt text.’ This is text that will be used as an alternative to the image when the image won’t load or can’t be seen. When you’re in a hurry (the default state of a small business owner), it’s easy to overlook this, but including it is mandatory for accessibility.

Try entering a simple descriptive sentence at the very least, so those who can’t see the image will know what it’s about, and won’t feel they are missing out.

Technical accessibility fixes

The above are some low-hanging fruit for you to improve your website accessibility. The next things we’ll mention are more technical.

Skip to Content

Your website probably starts with a header that includes a navigation menu, which might have a lot of items in it. As visually impaired people often rely on screen readers to get to your content, the header is something they probably don’t want or need. Having a website header that supports skipping the header is essential. Many frameworks and the themes do, but many don’t. Divi, which we use, doesn’t have this by default, and we need to add it manually.

Tab order

Some folks are unable to use a mouse. Usually, these are people with visual or motor impairment. Tabbing between items is an essential method for navigating for them. You can see how this works by loading any web page and pressing tab repeatedly to see what happens. Ideally, a focus box will move from item to item, left to right, top to bottom, highlighting links.

There are two main potential issues that could interrupt this important usability:

The first relates to design. On many websites, it’s difficult to follow focus as elements aren’t properly outlined or differentiated when focussed on. Having clearly defined ‘active’ and ‘hover’ states on links and buttons can help with this.

The other possible problem is caused by the structure of the site. Tabbing follows the order of things in HTML, or the actual structure of your content before your site applies the design rules for displaying the content. These design rules could potentially change the visual order of the information on your site, making tabbing through the site difficult. This type of problem relates to the structure of the site itself, so is more difficult to solve.

What are we doing about accessibility?

We’ve picked up our accessibility game, and will be taking extra steps to ensure new client sites are up to scratch. For our website maintenance clients, revising them to include more accessibility best practices.

If you’re not sure whether your site is as accessible as it should be (it could be costing you business!), and you’d like us to have a look, we’d happily take a glance and make any recommendations. Use our contact form to hit us up.

Further resources