Designing Accessible Websites
Just like how public buildings, service centres and stores have guidelines on how to be accessible for everyone (ramps, wide doors, etc), websites also have guidelines for accessibility.
These compliances are listed under the Web Content Accessibility Guidelines (WCAG). WCAG is a list of recommendations for making Web content more accessible. Such as font size, contrasting colour pallets, forms and animations.
Why should you care if your website is WCAG compliant? 22% of the Canadian population has a disability, including blindness/low vision (55% of Canadians require eyeglasses), deafness/hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity and combinations of these. Sunday Roast takes these guidelines very seriously, and following these guidelines will often make your site more usable to users in general. We want to make sure everyone has the opportunity to view and understand the sites we create. Why limit your business? We wouldn’t want you to miss out on potential sales because your website isn’t legible.
There are lots of ways to improve your site’s accessibility. The main core elements to look out for are:
Keyboard navigation
Not everyone has the ability to use a mouse or a trackpad, they rely on using software and keys to navigate. It must be possible to navigate your site without a mouse. This is because many assistive technologies depend on keyboard-only navigation. Can you navigate your site with only keys? Try accessing pages, clicking on links, filling out forms etc. To test this yourself, try navigating around the page using the Tab key.
High contrast colours
All text needs to have high contrast against background colours. Think black on white, or white on navy blue. Avoid colours like green on red or having bright on bright colour schemes. This also goes for text on images, background gradients, buttons, and other design elements. Everything matters!
Alternative text for images (good for SEO as well)
Images are a great way to break up text on your website and will help users get to know your brand’s personality. However, dictation software cannot read an image to the user. Add alternative (alt) text to your images. Alt text does not affect the website design, in fact - no one can see alt text! The alt text describes the image it is linked to. This way, users who are unable to see the image will still be able to understand what the image is with the use of dictation software. Google can also read image alt text and will count towards your SEO (read our blog post on SEO here).
Proper use of heading hierarchy (also good for SEO)
This is another point that has many benefits. Using proper heading hierarchy will help improve your website ranking, it’s good for SEO, and breaking up your text this way will be easier to read and it will also help organize your information in a way that is easy to follow for all users. Proper use of heading hierarchy also helps screen readers to read your pages. This also helps in-page navigation. Sounds like a win, win, win to us!
Captions/transcripts for video content
Video content on your website is very beneficial to your potential customers. However, it’s not much help to users with visual impairment or photosensitivity unless you have captions and/or a transcript. Internet users with visual impairments have their software read the text to them. Plus, it is more written content to help your site rank better!
Clear forms
It’s important to have your fillable forms be as clear as possible. Make sure each field is clearly labelled. For example, you’ll want to place the labels directly above the corresponding field. Be sure to include brief instructions that inform users what they need to know in order to appropriately fill out the form. For example, ‘Where is your event? “La Primavera, Woodbridge”’. This way, they have a better idea of how they should be filling out the form.
Don’t panic if you don’t have any of these core elements implemented on your site. With a little work they can be implemented into your site. Sunday Roast believes everyone should have access and everyone no matter their disabilities should have a positive experience when landing on one of our websites. Inclusivity matters. Reach out to Sunday Roast to get your website WCAG compliant!
