Skip To Content
Image Computer generated image of T-cells or cancer cells
Accessibility Roadmap

Accessibility Roadmap


Read our accessibility statement

High Priority

  1. No option to skip repeated content. A means of bypassing blocks of content that are repeated on multiple web pages must be provided, e.g. the main navigation. For keyboard and screen reader users it can be frustrating to get to the main content of a page because you have to tab through all the main navigation elements every time you visit a new page. By implementing a skip link (also known as skip to content link), those users can skip all these elements and jump right into the content. See WCAG 2.4.1
    SOLUTION: Discuss with developer means of achieving this. The “skip to content” link should be the first focusable element on the page. The link can, but doesn’t have to be visible all the time for all users. If the link is visually hidden at first, it should be visible when keyboard focus moves to the link. If the link is clicked, it should move focus to the main content below the site navigation.
    TARGET DATE: October 2020 COMPLETED: October 2020
  2. Elements not highlighted on focus. With keyboard navigation it is important that the focused component can be visually identified. There is a navigation pulldown menu accessed via an icon in the top right corner of every page. The icon doesn’t currently show focus when using keyboard navigation. With keyboard navigation it is important that the focused component can be visually identified. If the focused component is not somehow highlighted, the user cannot be sure which component has focus. Make sure that user interface elements, that can receive keyboard focus (hyperlinks and form fields and buttons), are highlighted on focus. See WCAG 2.4.7
    SOLUTION: Discuss with the developer how to highlight the submenu icon on focus. Check with the developer that the submenu is accessible via keyboard navigation. If not, it is important to devise an accessible method to reach the items contained within this submenu.
    TARGET DATE: October 2020 COMPLETED: November 2020
  3. Colour contrast is insufficient for linked text. Very low contrast between the text link colours and background colour for the main text areas. There are two main link text colours used across the site and both fail to meet WCAG recommendations. The contrast ratio of 1.53:1 ad 4.01:1 are both below the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: Choose a colour combination that meets AA minimum requirement of 4.5:1 contrast ratio. Once colours are agreed, ask the developer to change the CSS to use the desired colour combination. Adding an additional non-colour indicator such as underlining to links within text would aid accessibility and reduce the need for contrast between links, surrounding text and the background colour.
    TARGET DATE: October 2020 COMPLETED: October 2020

Medium priority

  1. Colour contrast is insufficient in site footer. Very low contrast between text ad links and the background colour in the footer. The light grey menu at the bottom left of the page, results in a very low 1.55:1 contrast ratio, well below the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: choose a colour combination for this menu that meets AA minimum requirement of 4.5:1 contrast ratio. Ask the developer to change the CSS to use this colour combination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  2. Colour contrast is insufficient. Low contrast between text and background colour used in the default paragraph text within sections of the pages across the website. The contrast of default text and background colours is 2.98, well below the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: choose a colour combination for the default text that meets AA minimum requirement of 4.5:1 contrast ratio. Ask the developer to change the CSS to use this colour combination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  3. Colour contrast is insufficient in about section. Very low contrast between text and background colour in the subtitle section. The green <h2> text combined with the white background results in a contrast ratio of 1.53:1, well below the required 4.5:1 ratio for smaller text and the 3:1 ratio for larger text. See WCAG 1.4.3
    SOLUTION: choose a colour combination for this section that meets AA minimum requirement of 4.5:1 contrast ratio. Once colours are agreed, ask the developer to change the CSS to use the desired colour combination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  4. Colour contrast is insufficient on news pages. Very low contrast between the header text colour and background colour for the main text area. The contrast ratio of 2.73:1, is well below the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: choose a colour combination for this instance that meets AA minimum requirement of 4.5:1 contrast ratio. Once colours are agreed, ask the developer to change the CSS to use the desired colour combination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  5. Colour contrast is insufficient on home page. Very low contrast between text and background colour in multiple sections of this page. All the colour combinations highlighted in the following graphic fail to meet the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: choose colour combinations for all highlighted sections that meets AA minimum requirement of 4.5:1 contrast ratio. Some of the issues with the heading colour could be resolved by making the headings a larger font size which results in the contrast ratio requirement reducing to 3:1. Once colours are agreed, ask the developer to change the CSS to use an appropriate colour and size for each section.
    TARGET DATE: November 2020 COMPLETED: November 2020
  6. Colour contrast is insufficient. Very low contrast between quote text colour and background colour for the main text area. The contrast ratio of 2.73:1, is well below the required 4.5:1 ratio for smaller text. See WCAG 1.4.3
    SOLUTION: choose a colour combination for this instance that meets AA minimum requirement of 4.5:1 contrast ratio. Once colours are agreed, ask the developer to change the CSS to use the desired colour combination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  7. Duplicate/non-descriptive link text. There are multiple occurrences of “Tell me more”, “View Case Study” and “All” link text. Link text should be unique within a page, should be meaningful when read out of context, and should help users to know something about their destination. Link text such as “Tell me more”, “View Case Study” and “All” fail to meet these criteria. See WCAG 2.4.4
    SOLUTION: Ask a developer to add the descriptive text/title to a WAI-ARIA label for each link containing duplicate or non-descriptive link text. This will make it clear that they lead to different destinations. Assistive technology, such as screen readers, use aria labels to catalogue the links in a document so that users can easily navigate between them. This option would result in no noticeable difference to the look of the website while solving the accessibility issue. See https://www.w3.org/WAI/GL/wiki/Using_aria-label_for_link_purpose for an explanation of the use of aria-label.If the ARIA option isn’t feasible, use alternative method to ensure the link text is meaningful when read out of context, and should help users to know something about their destination.
    TARGET DATE: November 2020 COMPLETED: November 2020
  8. Empty buttons on home page. Both forward and back buttons on the carousel have no descriptive value. A button is empty or has no value text. When navigating to a button, descriptive text must be presented to screen reader users to indicate the function of the button. See WCAG 1.1.1
    SOLUTION: Ask the developer to give these buttons an accessible description by putting text in the <button> element that concisely describes the button’s functionality.
    TARGET DATE: November 2020 COMPLETED: November 2020
  9. Linked image missing alternative text. Some featured images linked to news stories are without alternative text. Images that are linked must have descriptive alternative text. If an image is within a link that contains no text and that image does not provide alternative text, a screen reader has no content to present to the user regarding the function of the link. See WCAG 1.1.1
    SOLUTION: Ask a site editor to enter alt text for the images.
    TARGET DATE: November 2020 COMPLETED: November 2020

Low priority

  1. Linked image missing alternative text. The image linking to a video does not contain alt text. Images that are the only thing within a link must have descriptive alternative text. If an image is within a link that contains no text and that image does not provide alternative text, a screen reader has no content to present to the user regarding the function of the link. See WCAG 1.1.1
    SOLUTION: An editor can add alt text for this image. Note, this is part of draft text and will be replaced before the site goes live.
    TARGET DATE: November 2020 COMPLETED: November 2020