Currently cloud link chat fails the following WGAC tests WCAG 1.4.10 WCAG 1.4.3 and WCAG 2.4.11 for reference see ticket PRB000279814

WCAG 1.4.10 Reflow

Explanation

Reflow or ‘responsive web design’ helps users with low vision who may need to enlarge text on a webpage and read it in a single column without scrolling in more than one direction. It also helps users who are viewing the page on a mobile device.

If a page does not support reflow it can appear smaller and more difficult to use or content may be cut off.

Navigation menus often collapse into fewer items or into a single menu button to take up less space. All content and functionality must still be fully available.

Issue Description

At 400% zoom and in mobile view (320 x 256 pixels), once the 'Live Chat' box is expanded, it is not possible to read all of the content within it.

WCAG 1.4.3 Contrast (minimum): Elements must have sufficient colour contrast.

Explanation

Poor colour contrast makes it difficult for someone with sight loss to see the content properly. If there is a big difference between the background and foreground colours it should be much easier to see the difference between them.

Issue Description

Both the red and blue text that appears when the keyboard tabs onto boxes within the 'Live Chat' box. This includes 'Required' and 'Optionally type your phone number' when the user selects the box.

WCAG 2.4.11 Focus Not Obscured (Minimum)

Explanation

Users who navigate a website using a keyboard need to know where they are on a page. A focused element must not be hidden by other content on the screen.

Components such as menus, cookie prompts and pop-up messages can hide focused elements and cause people to lose their place.

Focused elements must always be at least partially visible.

Issue Description

At 400% zoom, when the Live Chat box has been expanded, the keyboard focus can move to the page content behind it if the user tabs away from it. This results in the focused element being completely hidden from view.

More Info

After zooming the browser so that the chat box window fills the screen, hit tab a few times and you’ll eventually move keyboard focus to the web page behind. Unfortunately, the chat window remains on top so that the web page/next focussed element is not visible. Suggested reading ‘How to code accessible modals’.