What are the key pointers to anyone embarking on improving their accessibility?

What are the key pointers to anyone embarking on improving their accessibility?

Accessibility has been an issue for over 200 years. Since the mid-19th century, the introduction of Braille announced the publishing sector’s involvement with accessibility. Accessibility impacts not just on those with visual impairment but in fact anyone with a condition or disease that impairs concentration or mobility: Parkinsons, MS, dyslexia, attention deficit disorders, or even just old age. Anyone with limited physical mobility, visual impairment or ability to concentrate, can benefit both from web page navigation support, and visually enhanced content.  

So how do you implement accessibility into your current website environment, without having to start all over again?



OUR ADVICE

We would start by advising you must at least comply with WCAG 2.0 level AA standards as the minimum. Ideally you would be WCAG 2.0 AAA compliant and, looking ahead a year or two, WCAG2.1 compliance will be expected for all new websites. Let’s look at how we can achieve this.

ADD TAB FUNCTIONALITY
Many people with disabilities find it difficult to use a mouse. Introducing tab functionality allows the user to navigate pages through the use of the keyboard and nothing more. Why not test your website with your keyboard and see where the issues are?

HTML UPDATES
An issue commonly raised in accessibility is how italics and bold are formatted in the metadata. We recommend, for example, that words using <i> should  use <em>, and <b> should be <strong>. We are able to resolve this by converting these tags on import. Click here for an interesting article on this topic. If you would like us to convert these tags in your metadata, please let us know.


AUDIO VIDEO UPDATES
Audio is a simple step to improve your website’s accessibility. When adding in video or audio elements, ensure that captioning and transcripts have been included as outlined in guidelines:


HEADER NESTING

Page titles and headings should be correctly tagged in HTML to follow a hierarchy from <H1> at the top down to <h6> tags for less important content. Header nesting – in which page headings skip a level (e.g. from H1 to H3 with no H2 tag) – will be highlighted by AA checkers as an error to be fixed. Headings must be set correctly to improve accessibility.

FONT/FONT SIZE/COLOUR CONTRAST RATIO
A good starting point would be examine the font, font size and colour contrast.

Colour contrast ratio needs to be considered at all times while stocking the site. The ratio depends on the size of the wording. WCAG 2 level AA requires a contrast ratio of at least 4.5 to 1 for normal text (< 14 point) and 3 to 1 for large text (14 point and above), and a contrast ratio of at least 3 to 1 for graphics and user interface components (such as form input borders).

In other words, the smaller the size of the text, the more color contrast is required to make that text readable for users with visual impairments.

Try testing your colour ratios on the ‘accessible colours’ website.

Accessible Colours graphic showing AA compiance

IMAGE DESCRIPTIONS

Adding image descriptions and image alt tags positively impacts your successes with SEO - Google’s algorithm, for example, looks favourably on well tagged images. A screen reader runs through a website by vocalising text found in the HTML. So if you put an alt tag on an image, together with a description, the screen reader will describe what it finds to the user. It is therefore essential to describe what you see with appropriate enlightening wording.

Click here for more information on alt tags.

NEXT STEPS

To what extent should your website comply with these tests? This depends on budget, your current audience - size and profile - and whether you are about to redo your websites. Start with the basics and ensure all new marketing materials conform to reasonably high standards.

For our part, we advise our customers to achieve WCAG2.0 at a minimum but to aim for WCAG2.1.

Remember: accessibility is not just a moral judgement or obligation. It’s an opportunity to give you a competitive advantage, and with the moral prerogative it can bolster your brand image with your wider audience as a whole.


KEY TERMS

The Web Content Accessibility Guidelines  (WCAG) are a series of guidelines for improving web accessibility. Produced by the World Wide Web Consortium (W3C), the WCAG are the best means of making your website useful to all of your users.


WHERE TO TEST YOUR WEBSITE

Some of our customers have some good content on accessibility, too:

Indiana Web Content info

NC State University info


Accessibility elements for consideration:

WCAG 2.1 elements on the site we consider essential

Elements not covered in our main product development:

Supadu is making website accessibility core in every new product



Other blog posts you might like to read: