Getting started with accessible content: some quick tips

07/07/2016

Introduction

Designing for accessibility is something which should be included in the design and development stage as soon as possible, it’s also something which can be confusing and stressful in some cases, if designers and developers are not familiar with accessibility. The plus side is that it makes your content accessible to as many people as possible, improves search engine optimisation (SEO), which as a result brings more people to your app or website AND ensures they have the best possible experience, resulting in increased customer satisfaction.

Getting started with accessibility

What follows is some tips on getting started with accessible content design from our team, and of course feel free to get in touch to find out how we can help you achieve your end result; our details are at the end of this post.

Screen reader accessibility

Include a clear and logical headings structure, with only 1 instance of a heading at level 1. A clear headings structure will enable users to easily navigate a page and move to a specific section if required, a headings structure should also be used instead of bold or other font changes which are used to create a similar method of getting the reader’s attention. The reason for this is because screen reading software will not announce bold or italicised text by default, and users are required to navigate to a block of text and use another keyboard short cut to identify such items.

Include clear link labelling to inform users what will happen when selecting the link, this will give a clear indication to the function or destination page when the link receives focus.

Include clear form labelling with a clear indication of compulsory items by including an asterisk (*) before the required item.

Colour contrast and support for persons who have dyslexia

Information conveyed by colour alone (usually graphs or charts) should be accompanied by a text alternative to support it.

Text should have a high colour contrast against its background so it can be easily read.

Acronyms and abbreviations should be expanded or explained in their first instance. This will help to ensure users who may not be familiar with their meaning otherwise will understand them.

Italic text and elaborate font styles should be avoided.

The Flesch-Kincaid grade level of an article of text should be up to 12 or below to be easily read by most users, this can be found by opening word and going to file > options and proofing.

Voice activation accessibility

Try to keep the number of links per page below 50 as Dragon voice activation software tags 50 by default.

If / where a Z-index is used, ensure it is set at less than 100 (tags displayed by Dragon Version 12.0 and below won’t be seen if it is set at 100 or more).

Do not use scripting that relies on mouse input alone.

Low Vision accessibility

A good contrast between text and background will help users who have low vision.

When the user hovers over a link, a visual cue should be given such as an underlining or background highlighting to inform users that the link has focus.

How can I find out more?

Find out more accessibility tips on our Youtube channel (external link.)

We are always on hand to support our clients at any part of the design stage, so please feel free to use any of the following methods to contact us.

Office Telephone: +44 (0)1792 815267

Address: Llan Coed House, Llandarcy, Neath, SA10 6FG, United Kingdom

Email: This email address is being protected from spambots. You need JavaScript enabled to view it.