Making your website accessible

Open laptop sitting on a table with text on screen "I design and develop experiences that make people's lives simple."

Our information hub article “The Click-Away Pound” highlights how the majority of businesses do not have accessible websites. As the digital gateway to your business, your website could be driving away 20% of your potential customers due to inaccessibility, which will have a direct impact on your bottom line.

How does an accessible website benefit your business? Simply put, an accessible website helps everyone! If you design anything for ease of accessibility, you make it easier for everyone to use – and more likely to attract (and keep) users (which is particularly relevant if you are selling products or services online). An accessible website will result in your website being faster, easier to use as well as being more smartphone / tablet friendly. It is also more likely to appear higher in search engine rankings (ie Google, Bing etc).

As we all come to terms with the impact of the corona-virus pandemic, which forced the share of online retail sales to increase from 20% to 29%, it is vital the changes include a better awareness of accessibility – and how this can help a business grow in the future. The good news is that most websites can be made more accessible with simple tweaks and better planning. The Be Ready Employer Hub has an online workshop – Accessibility for Websites – in our 2021 Open Programme – details and dates are available on our Events page via this link. This 2-hour workshop has been designed for Employers and Managers who are not web-designers, but who need to understand how their organisation’s website is used (or not!) by people with online accessibility needs. From a commercial perspective, this is particularly relevant as Covid-19

Your website and the law

For any non-public sector organisation, the legal status of website accessibility is not clear-cut (as updates to the law lags behind digital changes). Under the Equality Act (2010), employers are required to make ‘reasonable adjustments’ for anyone with a ‘protected characteristic’ to ensure they are not discriminated against – disability is one of the 9 protected characteristics. However, it is recognised that there is no clear guidance as to what is meant by reasonable adjustments in terms of digital publishing, as there has been no legal test yet (as the cases have all been settled before being heard by a court).

Advice by legal experts suggest the following: a website is considered to be a service. The Equality Act requires service providers to anticipate the needs of potential disabled customers for reasonable adjustments. And given that the Government has adopted the the Web Content Accessibility Guidelines (WCAG) as a suitable standard for public sector sites (see below) which is broadly recognised as a ‘good’ approach for accessibility, any site which met these guidelines would have a very strong defence against any legal action. Currently only 32% of private-sector websites comply with the WCAG standard.

From September 2018, all public sector organisations (the Be Ready Employer Hub included!) have to comply with new accessibility regulations (Public Sector Bodies – Websites and Mobile Applications – No.2 – Accessibility Regulations 2018) to meet the WCAG standards. These have four broad principles (POUR) that content must be:

  • Perceivable – for example, use of alt-text (alternative-text) for images, captions for multi-media, content that can be seen or heard by assistive technologies without losing any meaning.
  • Operable – for example, any functionality is available from a keyboard, users can easily navigate and find content; sufficient time is provided to read and use content.
  • Understandable – for example, text is readable and understandable, content appears and operates in predictable ways.
  • Robust – for example the website is compatible with current and likely future tools.

Therefore the guidance provided below is based on the recommendations for public sector hosted websites that meet the WCAG guidelines.

Designing for Digital Accessibility

Accessibility is about how a system or service is available to as many people as possible, which would include people with:

  • impaired vision
  • motor difficulties
  • cognitive impairments or learning disabilities
  • deafness or impaired hearing

This applies to any form of digital communication, material or service.  How easy would it be for a person with impaired vision to navigate your website currently by using a screen reader? Alternatively, could a Deaf person understand your corporate video?

The following are practical approaches that can help make your website more accessible:

  • The internet today is mainly accessed through mobile technology – phones and tablets – so make sure your website is designed to be compatible with current and likely future user tools.
  • Check how accessible your website is. A useful starting point is the WCAG’s page Easy Checks – A first review of web accessibility.  There are also free-to-use Accessibility Checkers available (such as Microsoft, Google).
  • Create content that can be viewed or used in different ways without losing any meaning – including by assistive technologies. Give users sufficient time to read and use content at their own pace.
  • Avoid content that may cause seizures or physical reactions (ie anything that flashes faster than three times a second). As well as animations, this could include elements such as scrolling (ie if the backgrounds move at a different rate to foregrounds).
  • Keep it simple! Use plain English (The National Literacy Trust estimates 5.1 million adults in England have a reading age of 11 or below). Avoid jargon, shortened forms of text (eg 5.1 million instead of 5.1m) and if you use acronyms, explain them.

Text content

  • Font – use a sans serif font (ie text that does not have any decorative features) such as Arial in a minimum size of 12 points. Websites default to 16 pixels.
  • Formatting – do not apply bold, italics or font size directly to the text to distinguish a heading or title. Instead, format and apply the ‘heading’ style for the document or page as required.
  • Colours – if you must use them, ensure they are contrasted (different) enough for people with sight loss and colour-blind users. The most common Colour Vision Deficiency (CVD) is “red-green” (difficulty distinguishing between shades of red, yellow and green). Around 1 in 12 men and 1 in 200 women in the UK are affected by this condition – reds, oranges, yellows, browns and greens appear duller than they would to someone with normal vision, and they often confuse reds with black. A rarer condition is “blue-yellow” colour vision deficiency where blues, greens and yellows are indistinguishable. More information is available from www.colourblindawareness.org/
  • Contrast – a useful tip to check if there is sufficient contrast between colours is to view or print off the page in greyscale (monochrome) to see how well the text can be seen.
  • Links – use a description for the link text rather than phrases such as ‘read more’ or ‘click here’
  • Attached documents – files with .pdf extensions (Portable Document Format) are frequently used to distribute read-only documents to preserve page layout, but they tend not to work well with mobiles or assistive technologies (such as screen readers). If you do use them, ensure they are saved in PDF/A format.

Images

  • Avoid images containing information (such as text, graphs, flow diagrams) as assistive devices such as screen readers cannot interpret the content. Instead provide the information as text.
  • Add appropriate alternative text (alt-text) to describe the image – check it makes sense out of context. List out data if relevant.
  • Do use images for presenting ‘easy read’ information (designed for people with a learning disability) who like clearly written words with pictures to help them understand.
  • Tables – avoid using if for cosmetic purposes. If they are required to display tabular data, keep the format as a simple grid.
  • Maps – can present accessibility problems, so if a map is needed, add alt-text (see above) to describe it as an image. If the map’s purpose is as a location finder, add directions and/or list of multiple locations as text. If a map has colour-coded areas, make sure it is accessible for colour-blind users (see notes above).
  • Videos – subtitles are a transcription of the dialogue, closed captions (cc) also transcribe sound effects, musical cues and other relevant audio information in a video or film. Auto-generated subtitles can be used for live video. A useful time-saving tip for YouTube is to use the auto-generated subtitle tool, and then edit them to contain the same information as closed captions. Best practice is to also publish a transcript of the video (this also helps with search engine optimisation).
  • Podcasts – should have a full transcript, published as text.
  • Social media – images should have an alt-text description added (guidance available from Twitter, Facebook, LinkedIn and Instagram); video uploads should include closed captions (guidance available from Facebook and LinkedIn).

Do you have an accessibility guide / statement on your website?

Known as Accessibility Statements, these declarations take the form of a short information page which is available via a link from every page of the website. They present clear information about the level of accessibility for the website, for example how someone with impaired vision can navigate through the website with a screen reader.

The Web Accessibility Initiative W3C provides useful guidance on what to include in an accessibility statement – Developing an Accessibility Statement.

You will find the Accessibility Statement for our website in the website’s footer.


For further information please contact the project team either via our on-line form or call us on 01392 241124

Please note: We are not responsible for the contents or reliability of linked websites and do not necessarily endorse the views expressed within them. Listing shall not be taken as endorsement of any kind. We cannot guarantee that these links will work all of the time and we have no control over availability of the linked pages.

We do not object to you linking directly to the information that is hosted on this website and you do not need permission to do so.