KittyGiraudel / ama

Ask me anything!
43 stars 4 forks source link

is an unlabeled 'trend' graph ok? #119

Closed MilesHeise closed 2 years ago

MilesHeise commented 2 years ago

big fan of your work, have shared several of your posts as our company is trying to greatly improve our accessibility

have 2 sort of related questions, both having to do with the following use case:

we have a table showing rows of results from, for instance, blood tests, and we wanted to add a column 'trend' to that table which is a small line graph going up or down to show how this result relates to your past few results

finding a lot of info on accessibility for charts in general, saying that charts have to have things like visible value numbers for the points and visible meanings for the axes, but there wouldn't be room for that in this case, by definition the space is only big enough for a small unlabeled line with no text

so,

question 1:

if hitting that cell on the table with the small line graph worked as a button that opens a full size modal with a larger version of the graph, including labeled axes and so forth, would that count as acceptably adaptable, and make the small original graph ok as is?

question 2:

I tried researching this myself but couldn't seem to find answers. in accessibility, is there any distinction between items which are necessary to use an app (and obviously must be fully accessible) and items which are essentially just icing on the cake, unnecessary extras like this would be?

KittyGiraudel commented 2 years ago

Hello Miles, and thank you for the kind words. :)

I hope you understood the interface you described correctly.

Regarding your first question, I think you’re onto a good approach. You can have a lightweight version of your graph (just showing the trend as a line, without axis or numbers) which is hidden from the accessibility tree for simplicity (with aria-hidden="true"), and replaced with screen-reader only text that describes the trend—“Improving” or “Degrading” for instance. You can have a button next to it or on top of it depending on design expectations, which says (screen-reader only again I suppose) “Open trend details” or something along these lines. This opens a dialog with a properly accessible graph this time.

About your second question, there is no such guide, because it really depends on what you’re building. A good way to figure out whether something is ornamental/anecdotal is to remove it and ask yourself whether things still make sense. If they do, that means that element could be removed from the accessibility tree for sake of simplicity. Generally speaking though, it’s better to keep the visual document and the accessibility tree somewhat in sync because some people rely on both (screen-readers are used by non-blind people).

I hope this helps. :)

MilesHeise commented 2 years ago

thanks so much, have a great day!