Simple Online Accessibility Checks

1
Simple Online Accessibility Checks

Making digital content accessible can be a daunting task. So we have a quick checklist to help you get started or benchmark existing content.

Disabilities are diverse. It sounds obvious, but it is often forgotten. Accessibility is commonly stereotyped and oversimplified. In relation to online content, it evokes an image of a user requiring a screen reader.

“Disability is not just a health problem. It is a complex phenomenon, reflecting the interaction between features of a person’s body and features of the society in which he or she lives.”World Health Organisation

How to quickly check online accessibility

The World Wide Web Consortium (W3C) is an international community where Member organizations, a full-time staff, and the public work together to develop Web standards.

It’s worth bearing in mind that many of the checks below are either similar or identical to those used in Search Engine Optimisation (SEO). As a result, you may find this checklist much less of a burden than you think in terms of web content.

If your web/marketing team are practising SEO (as they should be!) then much will already be covered. So, if you are trying to sell the need for accessibility internally, remember it’s good for traffic, it’s good for usability and it’s the law!

W3C has created a set of easy accessibility checks for your content.

  1. Page title
  2. Image text alternatives
  3. Text
  4. Interaction
  5. General

W3C easy accessibility checks

1. Check page titles for accessibility

Good page titles are particularly important for orientation. They help people know where they are and move between pages open in their browser.

The first thing screen readers say when the user goes to a different web page is the page title. The best practice is for titles to be “front-loaded” with the important and unique identifying information first.

E.g. Accessibility in E-learning | Skillcast

What to check

  • Check that the title briefly and adequately describes the page content
  • Check that the title is different from other pages on the website
  • Check that the title adequately distinguishes the page from other web pages

2. Check for image text alternatives (alt-text)

Text alternatives are needed for those who do not see the image (e.g. people who are blind and use screen readers can hear the alt text read out loud).

The text alternatives on digital content are derived from the “alt-text”. They need to convey the purpose of an image, including pictures, illustrations, charts, etc.

That’s why they need to be functional and provide an equivalent user experience, not necessarily describe the image. Most SEO and CMS tools will allow you to generate lists of assets that lack an “alt-text”.

E.g. Alt-text for a search button would be “search” not “magnifying glass”.)

What to check

  • Every image has appropriate alternative text.

3. Text

Text alternatives are needed for those who do not see the image (e.g. people who are blind and use screen readers can hear the alt text read out loud).

Heading checks

Those who cannot use a mouse and use only the keyboard or who use a screen reader need correctly marked-up headings to be able to navigate.

  • All pages have at least one heading.
  • Make sure all headings carry a heading tag (i.e. don’t use font size or bolding)
  • Only use headings where the text delineates a section
  • The heading hierarchy is meaningful. Ideally, start with an “H1” then descend the levels in numerical order

Colour contrast checks

Some people cannot read content if there is not sufficient contrast between the text and background, for example, light grey text on a light background. Others, including some people with reading disabilities such as dyslexia, need low luminance.

Three ways to check contrast
  • Contrast tool – displaying contrast ratios in a table
  • Eye-dropper tool – to select colours
  • Turn off colour – converts page to grayscale

WebAIM has a great free contrast checker

Text re-sizing

Some people need to enlarge web content in order to read it. Some need to change other aspects of text display: font, line spacing, and more.

  • Make sure your website and emails have responsive design baked-in

4. Interaction

Many people cannot use a mouse and rely on the keyboard to interact with online content. People who are blind and some sighted people with mobility impairments rely on the keyboard or on assistive technologies and strategies that rely on keyboard commands, such as voice input.

Accessible websites enable people to access all content and functionality via links, forms, media controls through their keyboard.

E.g. Alt-text for a search button would be “search” not “magnifying glass”.)

Keyboard access & visual focus check

  • Tab to all – check you can tab to every element
  • Tab away – make sure elements don’t have a “keyboard trap”
  • Tab order – make sure it is logical
  • Visual focus – ensure it is clear which content is in focus
  • All functionality by keyboard – you can do everything with it
  • Drop-down lists – check you can use arrows without selecting
  • Image links – have a clear visual focus and click enter to activate

Forms, labels, and errors

When forms, labels and error messages are marked up correctly, people can interact with them using only the keyboard or voice input and screen readers.

Also, the label itself becomes clickable, increasing the target area and making it easier to select small radio buttons or checkboxes.

  • Check that all form controls are keyboard accessible including checking that you can get to all items in any drop-down lists

5. General

The text alternatives on digital content are derived from the “alt-text”. They need to convey the purpose of an image, including pictures, illustrations, charts, etc.

Check your moving, flashing, or blinking content

Users need to be able to control moving content, especially those with attention deficit disorder or visual processing disorders.

  • Ensure there is a way to stop or hide any moving, blinking, or scrolling content
  • Provide a way to stop, hide or change the frequency of auto-updated information
  • Check that no content flashes or blinks more than three times in one second

Provide multimedia (video, audio) alternatives

Visual information cannot be seen by those who are blind or have low vision unless it is provided in an alternative format such as audio or text.

  • Keyboard access – See section 4. Interaction
  • Auto-start control – either does not start automatically or can be controlled
  • Captions – This is more than just subtitles, identify people, describe visuals
  • Transcript – Should be easy to access full descriptions (see captions)
  • Audio description – This describes any meaningful visuals

Check the basic structure makes sense

A basic structure check helps ensure that the page flows and makes sense. The easiest way to do this is by checking the web page without images, styles, and layout.

  • Check that the information makes sense when read in the order it is shown
  • Check that the alternative text adequately reflects the missing images
  • Check that blocks of information have clear headings

Simple Online Accessibility Checks

Next steps for accessibility

Current Web Content Accessibility Guidelines (WCAG 2.0) stipulate that e-learning content must be POUR:

  • Perceivable – Information and user interface components must be presentable to users in ways they can perceive
  • Operable– User interface components and navigation must be operable
  • Understandable – Information and the operation of user interface must be understandable
  • Robust – Content must be robust enough that it can be interpreted reliably by a wide variety of assistive technologies

If you want to bring your accessibility levels to the next level, then follow POUR guidelines to ensure your online content is accessible for all learners.

Read the full POUR guidelines

Want to learn more about equality & compliance?

If you’d like to stay up to date with equality best practices, industry insights and key trends across regulatory compliance, digital learning, EdTech and RegTech news subscribe to Skillcast Compliance Bulletin.

To help you navigate the compliance landscape we have collated searchable glossaries of key terms and definitions across complex topics including GDPR, Equality, Financial Crime and SMCR. We also regularly report key learnings from recent discrimination cases.

You can follow our ongoing YouGov research into compliance issues, attitudes and risk perceptions in the UK workplace through our Compliance Insights blogs.

And if you’re looking for a compliance training solution, why not visit our Compliance Essentials Course Library.

Last but not least, we have 60+ free compliance training aids, including assessments, best practice guides, checklists, desk-aids, eBooks, games, handouts, posters, training presentations and even e-learning modules!

If you’ve any questions or concerns about compliance or e-learning, please get in touch.

We are happy to help!

Source link

Founder OF Postintrend.com started my blogging journey in 2015 In This Duration I learned more about blogging, SEO, SEM, Affiliate marketing and more kinds of stuff on the Internet. I love to share my information with everyone.