The importance of digital accessibility – Mando’s top tips

When it comes to developing your digital offering one of the most important considerations is accessibility.

You need to make sure that whatever the digital maturity of your audience you are catering for their needs and that those with impairment, in any guise, are catered for and can navigate and perform their desired functions on your site.

This is something that we have covered in detail previously and it’s always helpful to go back to the core principles of accessibility. The main four factors to consider are:

Perceivable. The information of the user interface and content must be presented in a way so that nothing is ‌undetectable‌ or‌ ‌invisible to the user. The user should be able to consume content with another sense if they have a disability. For example, while most people access the web visually, those who are blind or partially sighted may need to use touch or audio instead.

Operable. Users should be able to operate a website with the controls they normally use, even if they're not used by most people. The interactive elements of an interface, such as controls, buttons, and navigation, should be operated physically through multiple forms of interaction, such as voice commands.

Understandable. Websites should be understandable to every user and not overly complicated. A website should be presented in standard ‌patterns‌ ‌of‌ ‌use‌‌ ‌‌and‌‌ ‌‌designed so it is not completely unrecognisable to the way a site normally operates. The end user should be able to understand the meaning and purpose of the information presented in proper context.

Robust. Content must be equally robust across a ‌wide‌ ‌variety‌ ‌of‌ ‌technologies and platforms, from one browser to the next, from PCs to handheld devices and so on.

When we factor these four core components into a web build and ongoing optimisation we are able to achieve the things mentioned by Ian in the video above and make inclusive web experiences for 18-year-old gamers and 80-year-old Alzheimer’s sufferers.

Some of the top tips that we would recommend when it comes to accessibility are as follows:

Choose a content management system that supports accessibility

here are many content management systems available to help you build your website. We work with CMS and DXPs such as Optimizely, Sitecore and Umbraco and it is vital that accessibility is at the core of what you are trying to achieve. You should make sure you consult the platform’s documentation for notes on accessibility and tips for creating accessible content and layouts for that platform. Be sure to follow the same guidelines when selecting modules, plugins, or widgets.

Use headings correctly to organize the structure of your content

Screen reader users can use heading structure to navigate content. By using headings (<h1>, <h2>, etc.) correctly and strategically, the content of your website will be well-organised and easily interpreted by screen reader.

Examples:

  • Use <h1> for the primary title of the page. Avoid using an <h1> for anything other than the title of the website and the title of individual pages.
  • Use headings to indicate and organise your content structure.
  • Do not skip heading levels (e.g., go from an <h1> to an <h3>), as screen reader users will wonder if content is missing.

Accessible interface

The design interface must have a logical consistent structure and content hierarchy. Any interface that requires complex gestures using more than one digit (pinch & zoom etc.) or a drag mechanism (slider) must have an alternative single point activation. You should also make sure that every button or link has a clear purpose.

Design accessible forms

When form fields are not labeled appropriately, a user with a screen reader does not have the same cues available as the sighted user. It may be impossible to tell what type of content should be entered into a form field.

Each field in your form should have a well-positioned, descriptive label. For example, if the field is for a person's name, it should be labeled appropriately as either "Full Name" or have two separate fields labeled as "First Name" and "Last Name."

At Mando, our design process involves dedicated consideration of the requirements of users with disabilities by, amongst other things, taking into account:

  • text sizes
  • colour contrasts
  • on-screen movement (e.g. carousels)
  • auto playing video and sound
  • size of buttons
  • navigation elements on touch devices
  • cognitive load of content
  • positioning of UI
  • speed of transitions

Invariably many businesses that we work with have different levels of maturity in their understanding of inclusivity and accessibility. Throughout our discovery, experience design and build phases, there will be any number of instances in which we are guiding and educating our client's on key considerations around accessibility.

This may be in the form of education, for example why a carousel may be desirable to some, but provides a significant usability barrier to others, to more general guidance such as using descriptive 'calls to action' for button labels, over more generic 'read more' labels.

The sum total of all of these pieces of insight and guidance help to provide our clients with a deeper understanding of users and their needs, but also ensure we can provide strong rationale for design choices which may not always be immediately evident.

Maximising the accessibility of user interface code requires detailed knowledge of WCAG criterion and the interpretation of those goals into HTML, CSS and JS (markup, styling, behaviour) that optimises outcomes for disabled users.

Our experience design team have significant experience in developing solutions that maximise inclusivity and accessibility. Not factoring in accessibility is proven to have a detrimental impact of user experience and as such should be top of any digital agenda. If you want to get started and better serve your customers – get in touch today.