Feedback target results page canvas elements are not accessible

[HRemonen]

The canvas elements of the result page are not accessible at all.

Complex elements like bar graphs and pie charts require a full text alternative of all the text and data presented in the complex image. ARIA role="img" designates the as an image for the screen reader, and an accessible name can be created with an aria-label string value or an aria-labelledby ID reference to other strings in the DOM. The image can also have an accessible description via aria-describedby ID reference to text in the DOM.

Take in to account as well

All canvas mouse operations such as hover actions must be keyboard accessible. Now this is not the case.

Now the graph about feedback count distribution by date is hidden on smaller screen which is a WCAG 1.4.10 violation. All content must be visible on smaller screens also.

How to fix

As alt-text should not be more than 150 characters long a better way would be to fully describe the tables data in a separate dialog window opened via a link from the canvas. The canvas element should have aria-describedby pointing to the dialog window. Aria-labelledby should point to the question label that is now visible to sighted users.

Text alternatives for complex image data can also be presented as an accessible data table. But this would make the UI more gluttered I guess.

To make the hover actions also keyboard accessible further investigation must be conducted to the underlying package used to draw these.

Enable the feedback count distribution by date on mobile devices and ensure that the content may be enlarged 400%.