Accessibility

Ensure your website is accessible to everyone who uses it with a few easy steps you can implement on your site.

Accessibility is when a webpage is accessible to everyone, mainly accounts for people with disabilities. It ensures people with disabilities can access the information on the webpage the same as everyone else.

Web Content Accessibility Guidelines (WCAG) is an internationally recognised set of recommendations for improving web accessibility. They explain how to make digital services, and websites accessible to everyone.

There are 4 basic design principles of WCAG

• Perceivable
• Operable
• Understandable
• Robust

Why is Accessibility an important part of a good quality website?

Inaccessible websites frustrate users and create barriers for people that want to engage with your website.
Some industry examples include:

In the Travel industry, important information like pre-journey information, timetables, cancellation and delay notifications, and the available products and services should be accessible to all.

In the Finance industry, ensuring the accessibility for a few important functionalities like, providing identification methods, electronic signatures, security, and payment services which are perceivable, operable, understandable, and robust.

Within Ecommerce there a few simple accessibility features which make a difference. For example, keyboard accessibility, colour contrast, Font size, subtitles for video are easy to resolve. Another important one is the payment service user interface being available by voice so that a blind person can make online purchases independently.

Characteristics of inaccessible webpages

• Lack of keyboard accessibility
• Link text that’s not descriptive (for example, ‘click here’ links)
• Lack of colour contrast for text and important graphics like CTA/link colour etc.
• Online forms are not being marked up correctly, so the right control is not associated with the right label

How Webtrends Optimize check the accessibility of a website

We perform both manual and automatic testing, using some easily available tools/browser extensions.

Automatic Testing

For automatic testing, there are lots of tools/browser extensions available that help you check the accessibility of your webpage.
For example-

• Wave
• Axe
• Helperbird
• Stark Accessibility checker
• EqualWeb Accessibility checker

We often browser extensions like “Wave”, Which can identify many errors which breach WCAG, and facilitates human evaluation of web content.

Manual testing

There are a few simple manual checks which we perform to evaluate the accessibility of the webpage.

1. A webpage should provide keyboard equivalents for all mouse operations.
2. Clear instructions/help information or icons are used appropriately so it’s easily understood by the end users.
3. All Navigation tabs are ordered logically for smooth navigation.
4. Shortcut keys are provided for menus.
5. Websites should provide a consistent experience irrespective of device/browser
6. Check the colour contrast of the Webpage for all users, especially for colour-blind people.
7. Check user can adjust audio or video controls.
8. Check user should be able to override default fonts
9. Whether audio and video-related content is properly heard by disabled people and provide a subtitle.

At Webtrends Optimize, we make sure any design change or new functionality passes most of the above accessibility tests.

An example of how an accessible website can make a difference

There are many different types of Visual Impairments, such as:

1. Colour blindness
2. Loss of acuity (Blurred vision)
3. Large spots of blocked vision (diabetic retinopathy)
4. Peripheral blocked vision (e.g., Glaucoma)
5. Blindness

An accessible website makes a difference to someone who suffers with any of these conditions. The presentation of content can also be altered so websites are easier to use. Some examples of this are:

• Enlarging the text size
• Customizing colour contrasts
• Using screen readers (blindness)
• Subtitles or captions on videos
• Alternative image text to describe images

Such adjustments can be made through default settings in a web browser. Additionally, more advanced alterations have been made available through browser accessibility extensions. For example, Google have built various accessibility plugins for visually impaired users:

• Extension Accessibility Developer Tools: add an Accessibility audit, and an Accessibility sidebar pane in the Elements tab, to your Chrome Developer Tools.
• High Contrast: browse the web with your choice of several high-contrast colour filters designed to make it easier to read text.