User Vision logo
  • Accessibility Audit
    • Executive Summary
    • Summary of Findings
    • WCAG 2.1 Overview
      • WCAG 2.1 Compliance
  • Project Background
    • Approach
    • How to use this report
    • Understanding our findings
  • 1 Site wide findings
    • 1.1 No visible focus indicator on interactive elements (H)
      • 1.1.1 WCAG 2.4.7 (AA) - Desktop
      • 1.1.2 Recommendation
    • 1.2 Visible focus indicator fails to meet non-text colour contrast requirements (H)
      • 1.2.1 WCAG 1.4.11 (AA) - Desktop
      • 1.2.2 Recommendation
    • 1.3 State of accordion elements are not announced to screen reader users (H)
      • 1.3.1 WCAG 1.4.10 (AA), 4.1.2 (A) - Desktop, Mobile, iPad
      • 1.3.2 Recommendation
    • 1.4 Insufficient visible focus (H)
      • 1.4.1 WCAG 1.4.11 (AA), 2.4.7 (AA) - Desktop
      • 1.4.2 Recommendation
    • 1.5 User forced to tab through all navigation and sub-navigation items (H)
      • 1.5.1 WCAG 1.3.1 (A), 2.1.1 (A), 4.1.2 (A) - Desktop
      • 1.5.2 Recommendation
    • 1.6 Link text does not help users identify link purpose (H)
      • 1.6.1 WCAG 2.4.4 (A) - Desktop, Mobile, iPad
      • 1.6.2 Recommendation
    • 1.7 Links that open in a new tab window is not communicated to the user visually or programmatically (H)
      • 1.7.1 WCAG 1.3.1 (A) - Desktop, Mobile, iPad
      • 1.7.2 Recommendation
    • 1.8 Buttons and links styled the same (H)
      • 1.8.1 WCAG 3.2.4 (AA), 4.1.1 (A), 4.1.2 (A) - Desktop
      • 1.8.2 Recommendation
    • 1.9 Skip navigation links take users to the same location (M)
      • 1.9.1 WCAG 2.4.1 (A) - Desktop, Mobile, iPad
      • 1.9.2 Recommendation
    • 1.10 Skipped headings (M)
      • 1.10.1 WCAG 1.3.1 (A), 2.4.6 (AA) - Desktop, Mobile
      • 1.10.2 Recommendation
    • 1.11 Visible focus is not on the correct element (M)
      • 1.11.1 WCAG 1.3.1 (A), 2.4.7 (AA) - Desktop
      • 1.11.2 Recommendation
    • 1.12 LJMU logo does not help users identify link destination (M)
      • 1.12.1 WCAG 1.4.5 (AA), 2.4.4 (A) - Desktop
      • 1.12.2 Recommendation
    • 1.13 Decorative images are announced by screen readers (M)
      • 1.13.1 WCAG 1.1.1 (A) - Desktop
      • 1.13.2 Code Snippet
      • 1.13.3 Recommendation
    • 1.14 Search button announced as ‘go button’ (L)
      • 1.14.1 WCAG 1.1.1 (A), 1.3.1 (A) - Desktop, Mobile
      • 1.14.2 Code snippet
      • 1.14.3 Recommendation
    • 1.15 Multiple page landmarks with the same id (O)
      • 1.15.1 WCAG 1.3.1 (A), 4.1.2 (A) - Desktop
      • 1.15.2 Recommendation
  • 2 Content
    • 2.1 Embedded videos do not use audio descriptions or text transcripts (H)
      • 2.1.1 WCAG 1.2.3 (A) - Desktop
      • 2.1.2 Recommendation
    • 2.2 Inconsistent identification of accordion elements (M)
      • 2.2.1 WCAG 3.2.3 (AA), 3.2.4 (AA) - Desktop, Mobile, iPad
      • 2.2.2 Recommendation
  • 3 Generic
    • 3.1 Required fields are not marked programmatically (H)
      • 3.1.1 WCAG 1.3.1 (A) - Desktop, Mobile, iPad
      • 3.1.2 Code Snippet
      • 3.1.3 Recommendation
    • 3.2 Multiple non-breaking space elements used (M)
      • 3.2.1 WCAG 4.1.1 (A) - Desktop
      • 3.2.2 Code snippet
      • 3.2.3 Recommendation
    • 3.3 Inconsistent identification of accordion elements (M)
      • 3.3.1 WCAG 3.2.3 (AA), 3.2.4 (AA) - Desktop, Mobile, iPad
      • 3.3.2 Recommendation
    • 3.4 Unhelpful alt text (M)
      • 3.4.1 WCAG 1.1.1 (A) - Desktop, Mobile, iPad
      • 3.4.2 Code Snippet
      • 3.4.3 Recommendation
    • 3.5 Carousel indicators do not help screen reader users identify link purpose (M)
      • 3.5.1 WCAG 1.1.1 (A), 1.3.1 (A), 2.4.4 (A), 4.1.1 (A), 4.1.2 (A) - Mobile
      • 3.5.2 Recommendation
    • 3.6 Containers are close to one and other (L)
      • 3.6.1 WCAG 1.3.1 (A) - iPad
      • 3.6.2 Recommendation
  • 4 Landing
    • 4.1 Text is obscured when text spacing is applied (H)
      • 4.1.1 WCAG 1.4.12 (AA) - Desktop
      • 4.1.2 Recommendation
    • 4.2 Two elements receive focus (L)
      • 4.2.1 WCAG 2.4.7 (AA), 4.1.1 (A) - iPhone
      • 4.2.2 Recommendation
  • 5 Research
    • 5.1 Text is obscured when text spacing is applied (H)
      • 5.1.1 WCAG 1.4.12 (AA) - Desktop
      • 5.1.2 Recommendation
    • 5.2 Inconsistent identification of accordion elements (M)
      • 5.2.1 WCAG 3.2.3 (AA), 3.2.4 (AA) - Desktop, Mobile, iPad
      • 5.2.2 Recommendation
  • 6 Intranet landing page
    • 6.1 Accordion elements can’t be expanded with VoiceOver activated (H)
      • 6.1.1 WCAG 2.1.1 (A), 4.1.1 (A) - iPad, iPhone
      • 6.1.2 Recommendation
    • 6.2 Link does not fit within the container (H)
      • 6.2.1 WCAG 1.4.3 (AA), 1.4.10 (AA) - iPhone
      • 6.2.2 Recommendation
    • 6.3 Link does not fit within the container (H)
      • 6.3.1 WCAG 1.4.3 (AA) - iPhone
      • 6.3.2 Recommendation
    • 6.4 Links are not programmatically associated to headings (M)
      • 6.4.1 WCAG 1.3.1 (A) - Desktop
      • 6.4.2 Recommendation
    • 6.5 Decorative images with unnecessary alt text (M)
      • 6.5.1 WCAG 1.1.1 (A) - Desktop, Mobile, iPad
      • 6.5.2 Recommendation
    • 6.6 Links are announced multiple times by screen reader (M)
      • 6.6.1 WCAG 1.1.1 (A), 1.3.1 (A), 4.1.1 (A) - Desktop, Mobile
      • 6.6.2 Code Snippet
      • 6.6.3 Recommendation
    • 6.7 Right-pointing chevron is announced by screenreaders as ‘greater than’ (L)
      • 6.7.1 WCAG 1.3.1 (A) - Desktop, iPhone
      • 6.7.2 Recommendation
    • 6.8 Image alt text is the same as adjacent headings (L)
      • 6.8.1 WCAG 1.1.1 (A), 1.3.1 (A) - Desktop, Mobile
      • 6.8.2 Recommendation
  • 7 Intranet content page
    • 7.1 Content obscured when browser zoom is applied (H)
      • 7.1.1 WCAG 1.4.10 (AA), 1.4.4 (AA) - Desktop, Mobile
      • 7.1.2 Recommendation
    • 7.2 Insufficient colour contrast (M)
      • 7.2.1 WCAG 1.4.3 (AA) - Desktop
      • 7.2.2 Recommendation
    • 7.3 Background images use unnecessary alt text (L)
      • 7.3.1 WCAG 1.1.1 (A) - Desktop, Mobile, iPad
      • 7.3.2 Code Snippet
      • 7.3.3 Recommendation
  • 8 Undergraduate course page
    • 8.1 Information is presented as headings instead of a table (H)
      • 8.1.1 WCAG 1.3.1 (A) - Desktop
      • 8.1.2 Code Snippet
      • 8.1.3 Recommendation
    • 8.2 Content within the accordion is not announced (H)
      • 8.2.1 WCAG 2.1.1 (A), 4.1.2 (A) - Desktop
      • 8.2.2 Code Snippet
      • 8.2.3 Recommendation
    • 8.3 Insufficient alt text provided for the image of text (H)
      • 8.3.1 WCAG 1.4.5 (AA), 4.1.3 (AA) - Desktop, Mobile, iPad
      • 8.3.2 Recommendation
    • 8.4 Video is not accessible using the keyboard alone (H)
      • 8.4.1 WCAG 2.1.1 (A) - Desktop
      • 8.4.2 Recommendation
    • 8.5 Video links do not inform the user of where the link will take them (H)
      • 8.5.1 WCAG 2.4.4 (A), 3.2.4 (AA), 4.1.2 (A) - Desktop, Mobile, iPad
      • 8.5.2 Recommendation
    • 8.6 Colour contrast for Play button is insufficient (M)
      • 8.6.1 WCAG 1.4.11 (AA) - Desktop, Mobile, iPad
      • 8.6.2 Recommendation
    • 8.7 User not informed that the link will initiate a downloaded and the size of the download (M)
      • 8.7.1 WCAG 1.3.1 (A), 2.4.6 (AA) - Desktop, Mobile, iPad
      • 8.7.2 Recommendation
  • 9 Postgraduate course page
    • 9.1 Information is presented as headings instead of a table (H)
      • 9.1.1 WCAG 1.3.1 (A) - Desktop
      • 9.1.2 Code Snippet
      • 9.1.3 Recommendation
    • 9.2 Content within the accordion is not announced (H)
      • 9.2.1 WCAG 2.1.1 (A), 4.1.2 (A) - Desktop
      • 9.2.2 Code Snippet
      • 9.2.3 Recommendation
    • 9.3 Important information is not accessible using the keyboard alone (H)
      • 9.3.1 WCAG 1.3.1 (A), 2.1.1 (A), 2.4.6 (AA) - Desktop
      • 9.3.2 Recommendation
    • 9.4 Video uses autogenerated German captions (H)
      • 9.4.1 WCAG 1.2.2 (A) - Desktop
      • 9.4.2 Recommendation
    • 9.5 Elements are not accessible using the keyboard alone (H)
      • 9.5.1 WCAG 2.1.1 (A) - Desktop
      • 9.5.2 Recommendation
    • 9.6 Important information does not render correctly on mobile devices (H)
      • 9.6.1 WCAG 1.4.10 (AA), 4.1.1 (A) - Mobile
      • 9.6.2 Recommendation
    • 9.7 Video links do not inform the user of where the link will take them (H)
      • 9.7.1 WCAG 2.4.4 (A), 3.2.4 (AA), 4.1.2 (A) - Desktop, Mobile, iPad
      • 9.7.2 Recommendation
    • 9.8 Video uses autogenerated German captions (H)
      • 9.8.1 WCAG 1.2.3 (A) - Desktop
      • 9.8.2 Recommendation
    • 9.9 Carousel indicators do not help screen reader users identify link purpose (M)
      • 9.9.1 WCAG 1.1.1 (A), 1.3.1 (A), 2.4.4 (A), 4.1.1 (A), 4.1.2 (A) - Mobile
      • 9.9.2 Recommendation
  • 10 News article
    • 10.1 Social media icons open in a new tab window (H)
      • 10.1.1 WCAG 1.3.1 (A), 2.4.4 (A), 2.4.6 (AA) - Desktop, Mobile
      • 10.1.2 Recommendation
    • 10.2 Links do not provide the user with additional information (H)
      • 10.2.1 WCAG 2.4.4 (A) - Desktop, Mobile
      • 10.2.2 Recommendation
    • 10.3 Dates are not programmatically associated to the relevant news article (M)
      • 10.3.1 WCAG 1.3.1 (A), 2.4.6 (AA) - Desktop, Mobile, iPad
      • 10.3.2 Recommendation
    • 10.4 Background images use unnecessary alt text (L)
      • 10.4.1 WCAG 1.1.1 (A) - Desktop, Mobile, iPad
      • 10.4.2 Code Snippet
      • 10.4.3 Recommendation
    • 10.5 Incorrect focus order (L)
      • 10.5.1 WCAG 2.4.3 (A) - Desktop
      • 10.5.2 Recommendation
  • 11 Staff profile
    • 11.1 Article information is not associated to the relevant article (H)
      • 11.1.1 WCAG 1.3.1 (A), 2.4.4 (A) - Desktop, Mobile, iPad
      • 11.1.2 Recommendation
  • 12 Homepage
    • 12.1 Visible focus indicator fails to meet non-text colour contrast requirements (H)
      • 12.1.1 WCAG 1.4.11 (AA) - Desktop
      • 12.1.2 Recommendation
    • 12.2 Text is obscured when text spacing is applied (H)
      • 12.2.1 WCAG 1.4.12 (AA) - Desktop
      • 12.2.2 Recommendation
    • 12.3 Focus order not in a logical sequence (H)
      • 12.3.1 WCAG 2.4.3 (A) - Mobile
      • 12.3.2 Recommendation
    • 12.4 Content is hidden off screen when browser zoom is applied (H)
      • 12.4.1 WCAG 1.4.10 (AA) - Desktop
      • 12.4.2 Recommendation
    • 12.5 Left and Right-pointing arrows are focusable but nothing is announced to the user (H)
      • 12.5.1 WCAG 1.1.1 (A), 2.4.4 (A), 2.4.6 (AA), 4.1.3 (AA), 4.1.2 (A) - iPad
      • 12.5.2 Recommendation
    • 12.6 Covid-19 information modal cannot be dismissed with VoiceOver activated (H)
      • 12.6.1 WCAG 2.1.1 (A), 2.4.3 (A) - iPad
      • 12.6.2 Recommendation
    • 12.7 Skip to content link not rendering correctly on mobile devices (M)
      • 12.7.1 WCAG 2.4.1 (A) - Mobile, iPad
      • 12.7.2 Recommendation
    • 12.8 Chinese language attribute has not been assigned to interactive elements (M)
      • 12.8.1 WCAG 3.1.2 (AA) - Desktop, Mobile
      • 12.8.2 Recommendation
    • 12.9 Down Arrows are focusable on iPad (M)
      • 12.9.1 WCAG 1.1.1 (A), 1.3.1 (A) - iPad
      • 12.9.2 Recommendation
    • 12.10 Search button announced as ‘go button’ (L)
      • 12.10.1 WCAG 1.1.1 (A), 1.3.1 (A) - Desktop, Mobile
      • 12.10.2 Code snippet
      • 12.10.3 Recommendation
  • 13 High Traffic page 1
    • 13.1 User is not aware that they interacting with tab elements (H)
      • 13.1.1 WCAG 4.1.2 (A) - Desktop, Mobile
      • 13.1.2 Recommendation
    • 13.2 Virtual tour video does not use audio description (H)
      • 13.2.1 WCAG 1.2.3 (A), 1.2.5 (AA) - Desktop
      • 13.2.2 Recommendation
    • 13.3 Map is not accessible to the user (H)
      • 13.3.1 WCAG 1.3.1 (A), 3.3.2 (A) - Desktop
      • 13.3.2 Recommendation
    • 13.4 Video links do not inform the user of where the link will take them (H)
      • 13.4.1 WCAG 2.4.4 (A), 3.2.4 (AA), 4.1.2 (A) - Desktop, Mobile, iPad
      • 13.4.2 Recommendation
    • 13.5 Carousel indicators do not help screen reader users identify link purpose (M)
      • 13.5.1 WCAG 1.1.1 (A), 1.3.1 (A), 2.4.4 (A), 4.1.1 (A), 4.1.2 (A) - Mobile
      • 13.5.2 Recommendation
  • 14 High Traffic page 2
    • 14.1 Elements are not accessible using the keyboard alone (H)
      • 14.1.1 WCAG 2.1.1 (A) - Desktop
      • 14.1.2 Recommendation
    • 14.2 User is not aware that they interacting with tab elements (H)
      • 14.2.1 WCAG 4.1.2 (A) - Desktop, Mobile
      • 14.2.2 Recommendation
    • 14.3 Dynamic content not announced by screen reader (H)
      • 14.3.1 WCAG 4.1.3 (AA) - Desktop, Mobile, iPad
      • 14.3.2 Recommendation
    • 14.4 Loading message is not announced by screen reader (H)
      • 14.4.1 WCAG 4.1.3 (AA) - Desktop, Mobile, iPad
      • 14.4.2 Recommendation
    • 14.5 Bookmarks and courses are not programmatically associated (H)
      • 14.5.1 WCAG 1.3.1 (A), 2.4.4 (A) - Desktop
      • 14.5.2 Recommendation
    • 14.6 Links which are inactive are announced by screen reader (M)
      • 14.6.1 WCAG 1.4.1 (A), 2.4.4 (A) - Desktop, Mobile, iPad
      • 14.6.2 Recommendation
  • 15 Timetables
    • 15.1 Content within the accordion is not announced (H)
      • 15.1.1 WCAG 2.1.1 (A), 4.1.2 (A) - Desktop
      • 15.1.2 Code Snippet
      • 15.1.3 Recommendation
    • 15.2 Important information does not render correctly on mobile devices (H)
      • 15.2.1 WCAG 1.4.10 (AA), 4.1.1 (A) - Mobile
      • 15.2.2 Recommendation
    • 15.3 Screen reader does not announce the full address from the address dropdown (H)
      • 15.3.1 WCAG 4.1.3 (AA) - Desktop
      • 15.3.2 Recommendation
    • 15.4 Error messages are not announced by the screen reader (H)
      • 15.4.1 WCAG 3.3.1 (A) - Desktop
      • 15.4.2 Recommendation
    • 15.5 Colour alone has been used to identify an error (H)
      • 15.5.1 WCAG 1.4.1 (A), 1.4.3 (AA) -
      • 15.5.2 Recommendation
    • 15.6 Incorrect number of dropdown options are announced by the screen reader (M)
      • 15.6.1 WCAG 4.1.2 (A) - Desktop
      • 15.6.2 Recommendation
    • 15.7 CAPTCHA content has audio alternative but this is not accessible to users (M)
      • 15.7.1 WCAG 1.1.1 (A), 2.1.1 (A) - Desktop
      • 15.7.2 Recommendations
  • 16 Registration form
    • 16.1 Bookmarks and courses are not programmatically associated (H)
      • 16.1.1 WCAG 1.3.1 (A), 2.4.4 (A) - Desktop
      • 16.1.2 Recommendation
    • 16.2 Screen reader does not announce the full address from the address dropdown (H)
      • 16.2.1 WCAG 4.1.3 (AA) - Desktop
      • 16.2.2 Recommendation
    • 16.3 Form fields are not programmatically associated (H)
      • 16.3.1 WCAG 1.3.1 (A), 4.1.1 (A) - Desktop
      • 16.3.2 Recommendation
    • 16.4 Error messages are not announced by the screen reader (H)
      • 16.4.1 WCAG 3.3.1 (A) - Desktop
      • 16.4.2 Recommendation
    • 16.5 Colour alone has been used to identify an error (H)
      • 16.5.1 WCAG 1.4.1 (A), 1.4.3 (AA) -
      • 16.5.2 Recommendation
    • 16.6 Links which are inactive are announced by screen reader (M)
      • 16.6.1 WCAG 1.4.1 (A), 2.4.4 (A) - Desktop, Mobile, iPad
      • 16.6.2 Recommendation
    • 16.7 Incorrect number of dropdown options are announced by the screen reader (M)
      • 16.7.1 WCAG 4.1.2 (A) - Desktop
      • 16.7.2 Recommendation
    • 16.8 CAPTCHA content has audio alternative but this is not accessible to users (M)
      • 16.8.1 WCAG 1.1.1 (A), 2.1.1 (A) - Desktop
      • 16.8.2 Recommendations
  • 17 Micro site
    • 17.1 Link URL is announced by screen reader (H)
      • 17.1.1 WCAG 2.4.4 (A) - Desktop
      • 17.1.2 Recommendation
  • I Recommendations
  • 18 Suggested Next Steps
  • APPENDIX
  • A Automated Findings
  • Contact Details
  • Prepared by User Vision for LJMU

UV2635- Liverpool John Moores University Accessibility Audit

13.5 Carousel indicators do not help screen reader users identify link purpose (M)

Carousel-indicators on Generic page

FIGURE 13.8: Carousel-indicators on Generic page

Navigation elements highlighted on the postgraduate page on an iPhone

FIGURE 13.9: Navigation elements highlighted on the postgraduate page on an iPhone

13.5.1 WCAG 1.1.1 (A), 1.3.1 (A), 2.4.4 (A), 4.1.1 (A), 4.1.2 (A) - Mobile

The carousel indicators on the Faculty of Arts landing page is announced to TalkBack users as ‘1,2,3,4,5, double-tap to activate.’

On iOS devices, this interaction is even more confusing as the carousel indicator elements are announced by VoiceOver but the elements do not receive focus.

This does not help users identify link purpose. See Link text does not help users identify link purpose (H)

13.5.2 Recommendation

Options are:

  • Place descriptive information at the beginning of the link by adding the text and displaying it off-screen with CSS to remove content from visible display, but keep it available to screen readers.

  • Use the aria-label attribute to add a descriptive text label to the link.

  • Use the aria-descibedby attribute to indicate the IDs of the elements that describe the object. This will establish a relationship between the carrousel links and text that described them.