Posts

avatar of @aiyumi
25
@aiyumi
·
0 views
·
2 min read

Whoa, I hadn't expected @risingstargame to come here! :D

It's great to know that you guys are willing to consider improving the game's accessibility.

For now, I've been using the browser's inspector tool to examine the HTML and trying to memorize the order of the icons, and have gone through a couple of missions. Maybe I can manage, but of course it would be great if accessibility could be improved!

We just have to let the mission (and the music) play out, and read the results on the "diary," right? That doesn't need a different interface. It should be just a matter of improving the accessibility of the buttons and icons for the "mission preparations" part. Most of the problems I've found so far have to do with images that have no text describing them (and unfortunately, I have the same kind of problems on Discord!). So, I'll have to write the "report" here:

  • The icons to control the radio playback are clickable images with no text. For these, using the "aria-label" attribute should improve things. It would be ideal if those icons from the radio were turned into buttons that activate from the keyboard (by pressing "Enter" or the space bar), but just the aria-label would already help a lot.
  • The main menu options are also images. Using "aria-label" with text on the links would probably solve the problem too), though the menu navigation (with links inside buttons) feels a bit strange to me. As I navigate using the keyboard and pressing "Tab," the screen reader announces a button, and when I press "Tab" to go to the next element, the screen reader announces the inner link (neither the button or the link have text).
  • Wherever there are buttons (for example in the menus and also the buttons to accept the terms and conditions), they aren't activating from the keyboard like normal buttons should (the links inside activate with "Enter" normally, but the outer buttons don't). The buttons will probably need some JavaScript to respond to "Enter" ("event.keyCode 13") and space bar ("event.keyCode 32").
  • Then, there are icons like the stats icons, which - according to the browser's HTML inspector - are supposed to have tooltips explaining what they are, but the screen reader doesn't catch the tooltips. The tooltips would need a unique ID and the "aria-tooltip" role, and the icons would need the "aria-describedby" attribute indicating the unique ID of the tooltip.
  • The cards, band members etc. also are images with no text, and could use some aria-labels too. It would also be nice to have something indicating which ones are locked.
  • Edit: I found another problem. The "+" next to the energy bar which opens the energy boosts menu isn't focusable and doesn't activate from the keyboard. It would need something like 'role="button"' for the screen reader to see it as a button, 'tabindex="0"' to be focusable from the keyboard, and some JavaScript to respond to "Enter" and "space" keypresses.

I hope these suggestions are useful! I believe they shouldn't be hard to implement.

Thank you!

Posted Using LeoFinance Beta