Hi all,
I am a totally blind user, relying on a screen reader.
I'm building my first eurorack setup and would really love to create a modulargrid version so that I can share it out with others.
This is sort of usable, but it's a bit tough. I'm curious if there's a chance that I could help work on this to make it accessible (I'm fluent with python/php/javascript) or if people here are open to suggestions.
Here are my ideas just starting:

  • add a role of h2 to all the module titles in search results; this will make it faster to view.
  • When adding modules, it would be really helpful if there was a "row" combobox that was bounded from 1 to max rows, so if I click add and I'm on row 2, I can add it to row 2 (right now, I can only make one horribly long row)
  • Can you add the module name to the alt text of a module? This would make it easy to view. Maybe even (hp) at the end so you know how many hp the module is?
  • The following won't change the appearance but will make this navigable by table:
    • The enclosing container is a div with id of restraint. Add role="table" to this.
    • The rows are a div with class grid-row. Add role="row" to this.
    • for cells, add role="cell".
  • A switch in the module build to make modules focusable. This would add tabindex="0" to the module images. Then you can focus on it and use the keyboard commands.
  • Some way to select a slot (if I have module A and B and move B to the right, I might want to add a blank panel here.
  • Where you have icons (like on the "add" links, for example, consider adding an aria-label like aria-label="add", which will announce the link as what it is. Right now they read as questionmarks.

These would make this much more usable.
Thanks,