8.3 Insufficient alt text provided for the image of text (H)

96 percent rating course data highlighted on the Undergraduate- accounting and finance page

FIGURE 8.8: 96 percent rating course data highlighted on the Undergraduate- accounting and finance page

98 percent rating course data highlighted on the Undergraduate- accounting and finance page

FIGURE 8.9: 98 percent rating course data highlighted on the Undergraduate- accounting and finance page

8.3.1 WCAG 1.4.5 (AA), 4.1.3 (AA) - Desktop, Mobile, iPad

The ‘Undergraduate- Accounting and Finance’ page includes a widget for student ratings. When the user navigates to this element, it is announced as ‘Unistats KIS Widget frame main’ which gives the user no indication as to what the image is of.

As the information within the image is not conveyed in the surrounding text, this will result in screen reader users not being able to access this information.

Alternative text is read out by assistive technology in place of images, allowing the same content visually to be available to those with visual or certain cognitive disabilities.

Furthermore, the image changes automatically with another student rating but this information is not communicated to screen reader users.

Blind users need to be informed of changes happening on screen as they have no visual frame of reference and require up to date information in order to make informed decisions.

8.3.2 Recommendation

Images of text should be avoided especially where lots information is conveyed. Therefore we recommend this image being redeveloped as html that can be made properly accessible.

If this is not possible, then an alternative would be to provide an alt text that reads out all of the text. Therefore the alt text would be ‘Course rating- 96% of students were satisfied overall with their course, Data for courses in Accounting and Finance at Liverpool John Moores University’

When on the link (see course data) it will also need to reference to the course this button/ link is related to and state, and state the additional text of “for more official course information…see course data…discover uni”

Furthermore, dynamic content must be communicated to screen reader users. Depending on the context and importance of the dynamic content on screen, the information can be indicated by using aria live regions setting aria-live=‘assertive’, aria-live=“polite” or role=“alert”. The purpose of this ARIA content is to notify assistive technologies that a change has occurred and not have users assume that the form is functioning incorrectly.