Skip to main content Skip to navigation

Check accessibility of page content

As a public institution, the University has a legal obligation to make its web content accessible. SiteBuilder offers tools in both the Components Editor and the old visual editor that help you check the accessibility of your content.

At the top of the Current page tab, SiteBuilder displays a banner alerting you to any automatically-detected accessibility issues:

The 'Current page' tab, displaying an accessibility banner indicating issues to resolve

Important: It's not possible to automatically detect all issues, so some manual checking is also necessary.

For more information on creating accessible websites, see our accessibility guidance and accessibility checklist.

In this article:

The Components Editor Accessibility pane

The Components Editor provides automatic accessibility checking of your page content as you work on it. Any issues detected, along with options for fixing them, are detailed in the accessibility pane on the right of the editor.

^ Back to top

Check a page's accessibility status

Any issues detected while you work on your page are detailed in the Accessibility pane on the right of the editor. The Components Editor uses a "traffic light" system to indicate the presence of detected accessibility issues:

The accessibility check for a page with a serious issue

Accessibility issues present

Your page contains errors that you should definitely fix before publishing. This kind of error can cause problems with accessibility technologies like screen readers, for example. Use the Highlight button next to an issue to see where it occurred, along with a summary of the problem.

The accessibility check for a page with some possible issues

Potential accessibility issues to address

The page potentially has issues that could cause accessibility problems for users. Use the Highlight button next to an issue to see where it occurred, along with a summary of the problem.

The accessibility check for a page with no detected issues

Automated check passed

The automated checker has detected no accessibility issues with your page. Note, however, that it's not possible to automatically detect all issues, so some manual checking is recommended - see our accessibility checklist.

^ Back to top

Pause automatic accessibility checks

On larger pages, the frequency of automatic accessibiliy checks may impact performance. To suspend automatic checking, select the Pause live accessibility audits button in the top right corner of the Accessibility pane. The editor will run a check immediately after you select the Resume live accessibility audits button or attempt to Publish your page.

^ Back to top

Fix detected accessibility issues

  1. Scroll down to the error description in the accessibility pane, where you see a summary of the issue and suggested options for fixing it:

    An accessibility warning description, with the 'Highlight' button highlighted

    Note: Where more than one of the same type of issue is found, there is a separate Highlight button for each instance.
  2. Select Highlight below the explanatory text. The editor scrolls to the relevant content on the page and displays a box around it:

    A highlighted error in the Components Editor

  3. Fix the issue as suggested. The accessibility pane automatically updates as you make changes.

    Tip: Select the Re-check accessibility now button in the top right of the accessibility pane to manually refresh the accessibility status.

  4. When you've finished, select Publish.

    Note: if you select Publish on a page with detected accessibility issues, a warning pop-up is displayed, giving you the option to Publish anyway or Go back and fix the issues.

    The 'Accessibility issues' alert pop-up

^ Back to top

Check accessibility on old visual editor pages

To check whether the content on an old visual editor page meets the University's accessibility obligations, run a Page audit:

  1. Browse to the page you want to check for accessibility issues.

  2. Go to Edit > Edit centre content or Edit right content, as appropriate:

    The SiteBuilder 'Edit' menu, with the options to 'Edit centre content' and 'Edit right content' highlighted
  3. In the old visual editor, select the Page audit button in the toolbar:

    The old visual editor toolbar, with the 'Page audit' button highlighted

    If you're using the raw editor, select the Accessibility audit button:

    The raw editor toolbar, with the 'Page audit' button highlighted

  4. A pop-up appears to inform you about the progress of the check. When it's complete, SiteBuilder displays a report of any issues detected on the page:

    A page audit report
  5. Select Close to close the report. A report icon is displayed on the page next to non-accessible content:

    An audit report icon displayed next to inaccessible content
  6. When you've addressed the issues, re-run the report by selecting the Page audit button, then Refresh in the audit report pop-up:

    The 'Refresh' banner in a Page audit pop-up
  7. Once all accessibility issues have been resolved, select Publish.

^ Back to top

Related articles


How to report a problem