Web accessibility. WCAG 2.0. Level A… Everyone seems to be talking about accessibility. There are a lot of differently abled users that need to be considered. This includes visitors to your site with visual disabilities (blindness, low vision or colour-blindness), those that are hard of hearing or deaf, and those with motor impairments (such as paralysis or arthritis). But what exactly should be done to make your website friendlier for those with disabilities?
Here are 6 things you should be incorporating in every digital project that you do:
Make sure the site is accessible with just a keyboard
Try your own site without your mouse. Can you reach all of the navigation and key elements using just a keyboard? This is important for visitors that may be blind, that have motor disabilities, such as tremors, and anyone that can't use a mouse.
Use a strong contrast between your text and background
Think about all the times the bright sun has made it almost impossible to see something on your screen or having to squint to read some tiny font. It's important to remember that as the font decreases, the contrast needs to increase. The contrast ratio should be at least 4.5:1 (large scale text should have a contrast ratio of at least 3:1). For more information, check out section 1.4.3 of the legislation.
Make sure to provide captions for videos
This helps benefit those that are hearing impaired as well as anyone without sound on their system.
Help your users when they've made a mistake
Offering a generic error message ("Please fill in the fields highlighted in red") may seem like the easiest solution but it doesn't help someone using a screen reader or someone who can't distinguish red very well. Try to be more descriptive with your error messages, such as writing out what fields still need to be filled out
Provide text alternatives ("alt text") for images or multimedia
Screen readers need alt text to give users some context of the images, otherwise the screen reader might just skip the image or just read the file name. Hearing "image of author" is much more useful than just hearing "image_123.jpg".
Test on a screen reader
Make sure to run your site through a screen reader and see what the experience is. The JAWS reader makes up about 50% of usage and there are many other options including Window-Eyes, VoiceOver, NVDA and System Access (Source: WebAIM). Consider testing your site for accessibility using a mobile device too – 72% of those surveyed by WebAIM reported using a screen reader on their mobile device (Source: WebAIM).
It's all about balance
Please don't turn your site into text-only to make it seem accessible. This would be a poor customer experience for almost everybody. Alternatively, don't just rely on images. Making your entire page one large image isn't great for accessibility or SEO. Use images and graphics where they are needed to provide some visual interest, draw attention where needed and help make your site eye-catching. There's a balance between text and imagery that will help provide the ideal customer experience for everyone.
With information from webaim.org