Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Gallery image: fix the elements order #14931

Closed
afercia opened this issue Apr 11, 2019 · 3 comments
Closed

Gallery image: fix the elements order #14931

afercia opened this issue Apr 11, 2019 · 3 comments
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Bug An existing feature does not function as intended

Comments

@afercia
Copy link
Contributor

afercia commented Apr 11, 2019

Noticed while testing #14822

In the gallery images, the order of the elements should be improved. Currently, the order is:

  • "Remove Image" button (see block-library-gallery-item__inline-menu)
  • the image (which is focusable)
  • the caption field

With this order, there are at least 2 issues:

  • when using a keyboard, the "Remove Image" button gets skipped because it appears after the image is focused
  • even if it wasn't skipped, the "Remove Image" button doesn't give any context on which image it will remove because it's before any relevant information related to the image

I'd propose to:

  • move the "Remove Image" button after the image: shouldn't be a big problem as it's absolutely positioned
  • make sure the button appears both when tabbing forward and when tabbing backwards
@afercia afercia added [Type] Bug An existing feature does not function as intended [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). labels Apr 11, 2019
@oandregal
Copy link
Member

Closing this in favor of pre-existing #14814 I went ahead and added your feedback there.

@oandregal
Copy link
Member

oandregal commented Apr 12, 2019

Also: there is a PR at #14821 to solve that issue. Looking for some feedback there :)

@afercia
Copy link
Contributor Author

afercia commented Apr 12, 2019

Thanks @nosolosw ! Was searching through the "Accessibility" label and missed it. Added the label there.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

2 participants