phetsims / chipper

Tools for developing and building PhET interactive simulations.
http://scenerystack.org/
MIT License
12 stars 14 forks source link

Improve formatting of A11y View. #1510

Open pixelzoom opened 3 weeks ago

pixelzoom commented 3 weeks ago

In https://github.com/phetsims/models-of-the-hydrogen-atom/issues/67#issuecomment-2443052757, @DianaTavares mentioned a number of presentation improvements that would make things clearer in A11y View.

For example, this part of the A11y View shows 4 different UI components in the Spectra screen -- from top-to-bottom, a NumberControl, CheckBox, non-modal Dialog, and ABSwitch.

screenshot_3564

The lack of spacing and organization in the above layout makes it difficult to parse -- especially since spacing seems to be within UI components, and there is no spacing between UI components. In this screenshot, I've drawn red boxes around the 4 UI components to demonstrate:

screenshot_3565

I discussed this with @jessegreenberg. He said that A11y View is currently primitive, just displays the PDOM, and that there's very little massaging of the visual layout. It's unclear how much work on A11y View should be done, what would benefit designers & developers, etc. But worth a discussion.

pixelzoom commented 3 weeks ago

@jessegreenberg I've assigned this to you, but feel free to unassign if you don't think it's in scope for the current "description refinement" work.

jessegreenberg commented 2 weeks ago

Another improvement would be to display other aria attributes. We currently only show aria-valuetext and aria-expanded.

For example, in https://github.com/phetsims/models-of-the-hydrogen-atom/issues/76, it would be nice to see aria-pressed, and possibly role.

jessegreenberg commented 5 days ago

We discussed this during a planning meeting today. We are marking it as "priority 2". We think the changes with the most value are things that would make it easier to understand the structure of the PDOM as a development tool. When we work on this, think about improvements with that in mind.