5 simple accessibility fixes for your website
I tend not to like giving out advice for easy accessibility fixes as I find it gives people a slightly unrealistic view of making their website accessible. However, there are 5 straight forward fixes you can start applying today which will begin to make a big difference and improve your websites accessibility.
1. Images missing a text alternative
All images need to have ALT attributes. The ALT attribute stands for “alternative text” and it’s a way to describe the image via text. But, and this is important, not all images require ALT text.
If an image needs to be described, and without a description a user won’t understand a part of your site, use concise ALT text. If the image is decorative and there is no meaning attached, the ALT text can be set to nothing.
2. Poorly labelled links
Every link should be understandable when read on its own. Screen readers can display all the links on a webpage in a single list, the problem however, is if those links are labelled in an unclear way, it is very difficult and in some cases impossible to understand where each link leads.
A good way to make sure your links are labelled correctly is to read the link back to yourself, always make sure each link is understandable on its own. Don’t use links which have the text “click here” or “read more” as they’re difficult to understand.
3. Form controls with no labels
All the controls on your forms must have labels attached to them. Screen readers do a great job of announcing form controls, but unless there is a label with has been associated to the control, the screen reader will only ever announce the type of control, not what the label is asking.
There are quite a few ways to associate labels to form controls, but one of the best is using the FOR attribute on the label.
4. Incorrectly structured headings
Creating a good web page structure is really important for accessibility. Many users may not be able to see the webpage and how everything is laid out on screen, they instead rely on the document structure to understand it.
Screen readers can navigate a webpage via the headings, these headings serve as convenient hints to how the page is laid out. Always make sure your webpages have one H1 heading element, followed by H2, H3 and H4 headings all in a correct sequence.
5. Test everything with a keyboard
People who are vision impaired use the keyboard for navigation and interacting with their screen reader. Some users may have problems with fine motor skills and may experience tremors which make using a mouse impossible, which is why making your website keyboard accessible is vital.
When you use native HTML elements on your site you get keyboard support as a standard behaviour, but when you begin adding custom controls, dropdown menus, widgets and graphs, that keyboard support now needs to be built in. Having custom controls and complex functionality isn’t bad, but you need to go that step further to ensure its keyboard accessible.
It’s easy to get overwhelmed with web accessibility and deciding how to start making your website accessible.
These 5 issues are straightforward to fix, require a minimal amount of effort and will significantly improve your website. Web accessibility isn’t always straightforward, but you can make progress on your website with these easy fixes and quick wins.