Tips for Digital Accessibility for Web Content

This quick guide helps keep some key accessibility considerations in mind when creating and editing content for the web.

Don't Miss Our Upcoming Training

Join our next training session starting on Wednesday 16th October.

This training course consists of two 2 hour sessions:

  • Session 1: Wed 16th October - 12pm-2pm (AEDT) 
  • Session 2: Wed 23rd October  - 12pm-2pm (AEDT)

Both sessions will be held virtually using Microsoft Teams.

Important Note: This checklist is a short guide only created as a companion to a webinar held by TTC. This addresses only some accessibility considerations for content authors. Consideration should be given to WCAG in full to ensure conformance with the standards.

Tip 1: Consider Images

Images require a text alternative to describe their function or purpose. This is generally implemented through the use of an "alt" tag of most web content management systems have inbuilt tools to add a text alternative, which generally adds a text alternative via this method.

Without a text alternative, the image has no meaning for people who use assistive technology to access digital content.

If an image is purely decorative, then the image's alt tag should be empty so it is ignored by assistive technology.

When thinking about text alternatives, remember CRAM:

  • C: Text alternatives should be meaningful while being as concise as possible
  • R: Include the most important relevant first – considering the context of the non-text content
  • A: Text alternatives should be accurate and consider any specific context
  • M: All text alternatives should be meaningful – consider if it has meaning or should be decorative

WCAG Guidelines and Resources

Tip 2: Text Colour Contrast

Ensuring the colour of text has sufficient contrast against the background is important for many vision impaired and colourblind users.

Text needs to have a colour contrast ratio of:

  • at least 4.5:1 between the text colour and its background (for regular sized text). 
  • For large text (text that is approximately 18.66px and bold or larger, or 24px or large), contrast should be 3:1.

This includes backgrounds of any kind, including images, gradients and solid colours. If using the image as a background, make sure the contrast minimum is maintained for all text.

WCAG Guidelines and Resources

Tip 3: Consider Headings and their Levels

Correctly programmed and descriptive headings are essential for those using assistive technology in being able to navigate the web.

Generally the HTML heading markup is used, which has a heading hierarchy from heading level 1 (H1) down to heading level 6 (H6). These heading levels should be used consecutively and in a way that makes sense to group information.

If you are applying a visual style to distinguish text to stand alone, then consider whether a heading markup is required. In addition, make sure the heading is descriptive and makes sense for the content that is contained within the heading.

WCAG Guidelines and Resources

Tip 4: Don't 'Click Here'

The text to describe a link needs to make sense so a user can understand the purpose of a link.

Click here, Learn more, continue are examples of where, unless there was additional text context, it is not clear to the user the purpose of these links.

Best practice is for the link purpose to be fully contained within the link text itself.

When creating links:

  • Ensure link text is meaningful and can be identified (avoid Learn more; click here).
  • Keep brief but meaningful.
  • Avoid just using the URL directly
  • Only links that redirect the user to the same location can have the same link text.

WCAG Guidelines and Resources

Tip 5: Keep it Online

Where possible, keep content in HTML – avoid putting information within PDF and Word document attachments where possible

PDF and Word documents are sometimes essential. In these cases, ensure accessibility is factored in and provide alternative formats.

If using PDF or Word, ensure you embed accessibility within these documents. WCAG and its concepts applies to these documents as well as web content. You can take a look at your Creating Accessible Documents training for training on how to do this.

Guidelines and Resources