Web accessibility: Why it matters

Here are some of the best practices in accessible design that we use to make sites that work for everyone.

When using the internet on a 27″ iMac or on one of the latest large-screen high-res smartphones, it’s easy to believe that the web is a simple place to exist and operate in. Few of us now are able to live our lives without extensive recourse to the web whether for shopping, the functional everyday things like tax and insurance, or simply to communicate with family, friends and strangers.  

But not everyone has such an easy time. The operation of many websites is hampered by design and programmatic elements – how they work – that disenfranchise whole groups of users and limit the effectiveness of sites and systems. Web accessibility encompasses the whole range of disabilities that affect access to the web, including auditory, cognitive, neurological, physical, speech and visual issues. There are three main types of disabilities: 

  • Permanent conditions such as blindness or deafness 
  • Temporary situations such as a broken arm that might hinder usage  
  • Conditional or situational issues such as ageing, poor bandwidth or slow machines 

So it’s vital that, whatever clever stuff your site or system can do for the iMac user, it has to work for everyone to provide equal access and equal opportunity.  

ANLS we use the Web Content Accessibility Guidelines (WCAG) 2.0 from the World Wide Web Consortium (W3C) – these are the next generation of guidelines for accessible design. Here are some of the best practices in accessible design that we use to make sites that work for everyone: 

1. Enough differentiation between text and background colours

Adding a high contrast colour option to your site provides a better viewing experience to people with low vision. Maintaining sufficient tonal contrast of the elements on the page is important because it can eliminate most problems with colour vibration and ensure that a design transcends any colour blindness. Using simple colours can also help to minimize confusion that a colour-blind person may experience. Including text and shapes along with colour can help convey the information better, therefore you won’t rely on colour alone.


 

2. Clear and consistent navigation

Creating clear and consistent navigation by maintaining the name, order and position of the menu on each page of the site will help users predict and recognise your content. Having breadcrumb navigation on your site is a great way to improve usability because it indicates the current location on the webpage, making the navigation easier to users.

3. Clean and simple presentation

Building simple and consistent layouts with images and videos are helpful to break up the content, therefore your site will provide a clear visual field to users. Make sure the text and interactive elements are large enough and your layout is easily scalable to users with low vision.  As well as using adequate line and paragraph spacing with clear and easy to read typefaces will also help to meet web accessibility requirements. Designing fully responsive version of the site will ensure that it is accessible from any type of device with any size screen.

4. Use plain language

Write simple sentences, lists, paragraphs and bullets to ensure the information presented on your site is understandable for everyone. Creating an informative heading structure with meaningful subheadings that can be easily scanned will also help you to increase the readability of your site. Descriptive buttons and links are also helpful to convey the purpose and state of each element on your site. This will allow users to operate and navigate your site with ease.

5. Create effective forms

Following a logical tab sequence for forms and fields will provide easy navigation. Positioning the description and directions above the form fields will allow you to better communicate the purpose of the input field to the user. These will prevent users from making errors and feel frustrated. Clear and visible error messages are important to help users correct and identify mistakes which will make them feel more efficient and will enjoy using your website.


 

6. Use alt text to assist with screen reading

Providing clear captions and descriptions for video and audio content to users with disabilities are essential. Describing the content or meaning of images, charts and graphs will make your site compatible with screen readers. Describing the link of an image should also be specified to inform users where they will be directed. The length of the alt text also needs careful consideration. Make sure your description provides all the relevant information without being too long or not enough. Structure your alt text by placing the most important information first to give the flexibility the users to skip the content.

 

We Think

REMOTE: office not required

As from Wednesday 18th March, the NLS team will be working from home

+

NLS has moved!

Our new office is in Queens Road, Brighton. 5 minutes from the station, 4 minutes from the beach!

+

Drupal audit for The Welsh Government

NLS conducted a technical audit to assess scalability and fitness of this complex drupal application

+