Building a website that is easy to navigate and understand is essential for all website builds. It is especially important when it comes to disability. The Disability Discrimination Act 1992 is in place to ensure that people with disability can access the same content and information as others. This is where the Web Content Accessibility Guidelines (WCAG) come in. These guidelines are applicable worldwide.
What is WCAG
A WCAG compliant website ensures a website is perceivable, operable, understandable and robust. These are the four principles the guidelines are based on. A website that is WCAG compliant means a person with auditory, cognitive, physical, speech or visual impairments will still be able to access the content. This includes impairments such as deafness, learning disabilities, limited fine motor skills and even colour blindness.
According to the Australian Bureau of Statistics, 18.3% of Australia’s population are living with disability, and 50.7% of Australians over 65 years have disability, emphasising the importance of having a WCAG compliant website.
WCAG Checklist
WCAG is made up of an extensive list of success criteria and techniques. Below is a condensed list of key criteria to making a website more accessible.
(It’s important to remember there are 3 levels of WCAG being A, AA and AAA. Depending on which level you want to achieve, you may only need some of these criteria). Government sites should comply with WCAG 2.0 AA.
Web page structure
Use headings in order to structure the page for readability and navigation. A well-written, accessible page will be broken up with headings that allow screen readers to skip through the content. Headings also help users understand what content is coming next.
Sensory characteristics
Sensory characteristics include sound, shape, size and visual location. It is important not to rely on these. For example, when referring to buttons it is better to say “press the green circle button in the left hand corner” instead of saying “the button on the left”.
Content
Content should be clearly written, easy to read and follow a meaningful sequence. Writing the content in plain english ensures that it is easier to translate if the content is needed in other languages.
Images
Any images used on a website must have sufficient contrast. To give you an example of what this means, for an AA level website, the contrast of the background to foreground must be at least 4.5:1. For an AAA level website it must be at least 7:1. A colour contrast checker can be used if you are unsure. Logos and images that are purely for decoration are exempt from the contrast ratio. It is also important that no images of text are used when you can use text instead.
Alternative text
All images must have alternative or alt text. Alt text is a hidden descriptive text of what an image is. It is particularly useful to assist visually impaired users when screen readers are used to describe what the image shows.
Captions
Captions should also be used to clearly describe what the image shows. The caption and alt text should be different, otherwise the screen reader will read the same text twice, potentially confusing users.
Videos and live audio
A text transcript must be available for all videos and live audio. The transcript (or transcript link) should be close to the media itself. Captions should also be provided for all pre-recorded video content. If the video you want to use is on YouTube it’s possible to add captions using the settings.
Charts and graphs
When charts or graphs are used on a website, colour alone cannot be used to show results. Each chart will need to have a legend as well as text to describe the values of each element. It is also important to write a description for each chart that clearly describes what the chart is showing in terms of results and findings.
Accessible documents and content
Accessible documents and content include PDF files, powerpoint presentations and adobe flash content. Most of the WCAG guidelines for website content also apply to these documents. A plain english version of a PDF must be available in HTML.
Hyperlinks
When using hyperlinks, it is important to not use terms such as “click here” or “read more”. The hyperlink text should clearly indicate where the link will go and only the key words should be linked.
Forms
If you are using forms, each field must be clearly labeled. There should also be clear instructions to accompany the forms.
JavaScript
A WCAG compliant website will not rely on JavaScript to function. Any JavaScript on the website will not be device independent, meaning a mouse is not required.
Ensuring a website is WCAG compliant
Ensuring a website is adhering to these guidelines requires quality control and risk management. Scheduling website audits can help this process, making sure you pick up and manage any inaccessibility problems that may arise.
There are online tools available to help check a website is WCAG compliant. We like a piece of software called PowerMapper SortSite.
