Simple changes to improve the accessibility of your website
We all want to give our audience the power to access our content, and every audience comes with a variety of accessibility needs.
Enhancing your website’s accessibility might seem daunting, but there are easy changes you can make that don’t require a tech expert. And the great thing is, these changes will improve the user experience for everyone who visits your site.
What does web accessibility mean?
Web accessibility is the practice of making your website usable by everyone. This includes making it accessible to assistive technology like screen readers, speech recognition software and alternative keyboards.
If you’re interested in a more thorough description of what web accessibility entails, check out the Web Content Accessibility Guidelines developed by the Web Accessibility Initiative.
Why it’s worth improving your website’s accessibility
Web accessibility is about acknowledging and respecting that people with disability need and deserve access to the internet.
Aside from equal access and opportunity being the right thing to do, here are a few other compelling reasons to improve digital accessibility.
The internet has become an essential part of daily life. The UN Convention on the Rights of Persons with Disabilities defines access to information, including the internet, as a human right.
The World Health Organization reports that at least 15% of the world’s population (over 1 billion people) have a type of disability. And that percentage is set to rise as our population ages.
Increasing accessibility improves search engine optimisation (SEO).
Who you’re making your website accessible to
In a society that doesn’t value people with disability the way it should, some people develop a belief that disability has nothing to do with them. But people with disability are present in all aspects of society, including your audience.
Here are some examples of how a person with disability might use your website.
Someone who can’t use their arms or fingers and uses a mouthstick to type.
Someone who can’t hear well and uses captions on videos.
Someone who can’t read well and uses a screen reader to read aloud what’s on the screen.
Someone who doesn’t have the fine motor skills needed to use a mouse and navigates the internet by keyboard alone.
A university student with cerebral palsy, a hairdresser with industrial deafness, a business owner with quadriplegia, an aging researcher who’s misplaced their glasses—the range of people who will benefit from your accessibility updates is broader than you may think.
Simple tips for improving the accessibility of your website
1. Make pages easy to navigate
Well-organised content is an essential part of providing a good user experience. Put yourself in your client’s shoes and think about what information you’d want to find and where you’d expect to find it.
Ask someone who is unfamiliar with your site to look for a particular piece of information, starting from the home page. Did they find it easy or difficult?
Once you understand what your user needs, make sure the content on your site follows a predictable and consistent pattern. This will help users learn to navigate it quickly and find the information they’re looking for.
2. Use headings properly
Headings are more than a bold title. The proper use of headings is an important aspect of usability and clear communication.
Think of your headings as an outline of your web page. People using screen readers will navigate a page by its headings, provided they are coded correctly.
Make sure you nest each heading in the correct order. There are six levels of headings. The most important heading (your main page heading) is your heading 1 (your h1). Subsections are then organised from h2 through to h6.
A consistent hierarchy of information, within a page and across pages, improves ease of navigation for both screen readers and the human eye.
3. Write clearly and concisely
One of the four principles of accessibility defined by the Web Accessibility Initiative is also a hallmark of quality copywriting—copy that’s easy to understand. Choose the clearest, simplest words available to convey your meaning.
Keep your paragraphs and sentences short. Spell out acronyms in full the first time you use them. Avoid jargon (specialised terms), and if you can’t, provide definitions. Your content should be readable and easy to comprehend.
4. Write anchor text that makes sense on its own
People using screen readers often ‘scroll’ a page by jumping from one link to the next. Links need to make sense on their own, outside the context of the words around them. A call-to-action button that says ‘read more about our services’ is much more helpful than ‘read more’.
5. Consider how you display information
The way copy is presented on a page can influence the reading experience. Information needs to be organised and arranged in a way that makes sense to your audience.
Tables can be very helpful for displaying data, but keep them as simple as possible. Avoid using tables for layout, lists or anything other than tabular data. They can confuse screen readers.
Avoid images of text wherever possible as screen readers can’t read them. If you do use an image, make sure this text is also in the body copy of the page so it’s accessible to everyone.
Avoid moving, flashing, blinking or scrolling content, especially if it lasts for more than five seconds. This type of content can be distracting, harder to comprehend and may disappear before the user can read it.
Flashing content can also cause seizures in people with photosensitive epilepsy. There are better ways to make information stand out, including font size, the location of text on the page and the words you choose.
6. Make accessible colour and contrast choices
Some people have difficulty distinguishing between certain colours or shades, which can affect their ability to perceive visual information. Ensuring a high contrast between your text and your background can help to reduce the issue.
You can achieve this by always setting a dark colour against a light one. There are also online colour contrast tools that can check the contrast ratio for you. And finally, remember not to rely on colour alone to distinguish between different types of content.
7. Don’t forget page titles
A page title is a short description of the webpage within the HTML code. It’s the first thing a screen reader reads out when the user goes to a new web page, making it very important for orientation and moving between open tabs in a browser.
The page title needs to briefly describe what the page is about. Each page of your website should have a page title that distinguishes it from the other pages.
8. Use alt text for every image
Alt text (alternative text) is the description of an image within the HTML code.
Screen readers use the alt text to make the content and function of an image accessible to people with visual impairment. It also acts as a replacement if the image fails to load, or if you’ve turned off images to speed up downloads or save bandwidth.
To make your website accessible, every image must have an alt attribute. Here are some tips on getting this description right.
Don’t write text for images that don’t add to the user’s understanding. If the picture is purely decorative, an ‘empty’ or ‘null’ alt attribute (alt=” “) is often the best approach.
Do keep it short. A few words are all you need. More than a couple of sentences is too long.
Don’t repeat text that already exists on the page.
Do highlight the content and function of the image within the context of the page.
Don’t write ‘image of’ or ‘graphic of’. The screen reader will know this already. The only exception is when the format is relevant to the user e.g. a rough sketch by, an oil painting of.
More small changes that make a big difference
You may not be able to do it all at once, but every step you take towards making your website more accessible is worth it. Here are a few more tips to keep you heading in the right direction. You may want to talk to your web developer about these if you’re not confident doing them yourself.
Make sure to specify the language of a page (e.g. English) in the HTML for the benefit of screen readers.
Don’t have audio or video that starts playing automatically. This can be startling and annoying, and it can take time to figure out how to turn it off.
Follow the established practice of underlining links. Underlining provides a clear visual cue and it’s what people have come to expect. Having links in a different coloured font won’t necessarily provide the high contrast some users require.
Provide transcripts and captions for audio content.
Check that your website can be navigated by keyboard alone (no mouse), using keys like tab and enter.
Make sure your user can zoom in or resize text without it breaking the design or making the site unusable.
This list is by no means comprehensive, but it’s a good place to start. Web accessibility isn’t about getting every aspect of your site perfect. It’s about showing up, doing what you can, and continuing to learn and improve.