Ghost: Various accessibility problems in the admin screens

[MarcoZehe]

Issue Summary

There are various problems in the Admin UI of Ghost(Pro) that make it difficult for screen reader users to operate Ghost. These include missing labels for graphical buttons, missing roles for actionable items, and other semantic problems with custom markup.

To Reproduce

With a screen reader such as VoiceOver on the Mac and a compatible browser such as Safari or Chrome, or on Windows, using NVDA and Firefox, navigate to the main admin screen and the post screens.

Examples:

1. The button to expand and collapse post types has no label.
2. On mobile, the Nav bar More item doesn't tell VoiceOver that it's a button.
3. When creating or editing a post, the button to add a card has no label.
4. When viewing the post settings side bar, the Close button has no label.
5. The side bar is visible to screen readers even when it is hidden visually.

These make it more difficult for blind users to operate the Ghost admin UI.

Technical details:

• Ghost Version: 3.16.1, but also happens in 3.17.1.
• Node Version: 12 LTS
• Browser/OS: Firefox 76 on Windows 10, Safari 13 on MacOS Catalina, Safari 13 on iOS 13.5.
• Database: Default.

I have created some pull requests that deal with these issues except the side bar that is only visually hidden. Someone who is not blind should deal with that one: The side bar needs to be either display:none; or visibility:hidden; via CSS, or if that's not possible, aria-hidden="true" if it is hidden, otherwise aria-hidden should be removed to make it show up for screen readers.

Pull requests:

https://github.com/TryGhost/Ghost-Admin/pull/1583

https://github.com/TryGhost/Ghost-Admin/pull/1584

[ErisDS]

Hey @MarcoZehe thanks for this, really appreciate it.

Will get someone to figure out what the best solution for the sidebar is, thanks for the advice.

[MarcoZehe]

Thank you @ErisDS ! I have one more that deals with various Close buttons throughout the UI.

https://github.com/TryGhost/Ghost-Admin/pull/1585

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[MarcoZehe]

This is still present in current Ghost.