matatk / landmarks

Allows you to navigate a web page via WAI-ARIA landmarks, using the keyboard or a pop-up menu
http://matatk.agrip.org.uk/landmarks/
MIT License
123 stars 7 forks source link

Feedback from a visual keyboard-only user #477

Closed kimviens closed 2 years ago

kimviens commented 2 years ago

Hi Matatk! Do you still maintain the landmarks extension? We have feedback from a keyboard-only user:

Do you still support the use of this extension and would consider these enhancements? If so, what are your timelines?

matatk commented 2 years ago

Thanks for passing on your user's feedback @kimviens. I can imagine this keyboard behaviour change being useful for most keyboard-only users (if not all), and plan to make that change. Whether it becomes the default behaviour, or an option (and, if an option, how that option is exposed), I'm still considering. Further feedback on that is welcome; I do plan to make the change, though.

For the border size suggestion: do you mean that your user would like to adjust the thickness of the border? It seems that, at high screen resolutions, the border might look quite thin. My preference here would be to come up with a border thickness that "just works" most of the time, as I'd generally like to keep the number of options to a minimum. Will see if I can make the default better across screen resolutions.

I still maintain this extension. My free time is a bit limited at the moment, and I was in the middle of making some significant changes when I last worked on this code, but I'll see if I can either complete those changes quickly, or make this one before completing the others. Will let you know about timelines when I've checked that out.

kimviens commented 2 years ago

Hi @matatk! I apologize for the late reply, I don't know how Github notifications work but I was not notified of your response!

When it comes to the option to go straight to the landmark from the menu, I would recommend making it an option, I can see beginner users might tend to use the menu while experts would use the shortcut. Unfortunately my knowledge of browser extension is not great, but maybe each button can be made expandable? or it could pop up a button saying "go to landmark".

About the border: the problem is not the thickness of the border it is rather that the control for the thickness of the border is the same as for the size of the text. Therefore, if I want large text it will set a large border and therefore cover content. I would like to know if it would be possible to decouple the controls?

Finally, thank you so much matatk, I would offer to help out but I honestly don't know where to start to learn this. If you have any resources to recommend I would definitely appreciate it! Thank you so much for working on this much needed extension. This can really make a difference for keyboard-only users!

matatk commented 2 years ago

Hi @kimviens. No worries about the speed of your reply; everyone's busy :-). I've been thinking about the keyboard part of this (we should have a separate issue for the border thickness—I'll file one in due course). Regarding the keyboard, my current thinking is:

I have implemented the option in the code, but not the Preferences UI for adjusting it yet. It seems to work quite well so far though.

I've also been experimenting with a new related feature: when you focus, or hover over, the buttons in the pop-up, the corresponding landmark gets highlighted. However, this doesn't scroll the page (doing so would be too jarring) so if the landmark isn't visible on the page, you won't see it getting highlighted. This doesn't lose anything relative to current behaviour, and feels like it may be generally helpful.

I will need to implement the GUI side of the option setting, and do more testing before releasing this.

Would you be interested in testing it before I release it? There are a couple of options for testing it: one is slightly technical (though there are instructions in the README of this repository) and would be usable from the moment you try it; the other way is much simpler, but only available on Chrome (because it involves publishing a test version of the extension separate from the main one, on the Chrome Web Store), and it could be slow, depending on how long it takes Google to review and publish the test version.

matatk commented 2 years ago

I noticed something whilst working on this that I didn't make clear before: if you just press Escape to manually close the pop-up after activating one of the landmark buttons, focus on the page will have moved to that landmark, so you can then start tabbing from the start of that landmark (I'd actually forgotten about this!) The border, if being shown only momentarily, may no longer be displayed, but focus will have been set.

I'm still adding an option to close the pop-up immediately, as discussed, but until that version is released, you can let your user know that they can still navigate around the page after selecting a landmark via the pop-up, with that one extra keypress.

matatk commented 2 years ago

@kimviens: This issue has been closed, as I've added the code to fix it. You won't see the changes until I've made a new release and that has been reviewed by the browsers' teams, however. Until then your user can use the technique mentioned above to navigate after closing the pop-up manually.

If you'd like a test release, let me know—though I intend to make a new release within the next couple of weeks.

Thanks for your feedback and suggestions!

P.S. I opened #479 to deal with the other issue you raised.

kimviens commented 2 years ago

Oh wow, I just got the notification of your last message two days ago but not your message from 18 days ago. My apologies!

Woohoo! I can't wait to see the new release, I really like the idea to make this an option for users!

Yes, I am interested in testing anything you need testing for this extension. I can definitely try the technical testing, which branch would you like me to test?

You said: "I've also been experimenting with a new related feature: when you focus, or hover over, the buttons in the pop-up, the corresponding landmark gets highlighted. However, this doesn't scroll the page (doing so would be too jarring) so if the landmark isn't visible on the page, you won't see it getting highlighted. This doesn't lose anything relative to current behaviour, and feels like it may be generally helpful." And I love that idea, it only adds to the extension without removing anything. Great idea!

Note: I just tested the "using ESC after activating a landmark in the pop up menu in order to focus the landmark". I noticed that it seems to work if I use my mouse on Edge but not when I use my keyboard. In Chrome and Firefox, I was not able to get either of the two to work.

Thank you so much for your hard work on this @matatk! I can't wait to show my keyboard user these new features!

matatk commented 2 years ago

No worries; dealing with notifications these days is a full-time job.

There are actually three ways you could try this out...

The main branch is unlikely to change for a couple of days at least (and when it does, it should still work fine :-)) but for reference, the state of main at the time of writing can be downloaded as a ZIP file, and the extension can be built from there.

Thanks for the update on how closing the pop-up manually is (not) working for you. I have been testing on Firefox mainly, and haven't encountered that problem. I'll have to check it out on some more pages, across browsers. In fact, because of this feedback, I think I will re-open this...

kimviens commented 2 years ago

Hi Matatk!

I tested the main branch on Chrome, Edge and Firefox. It works exactly like you said in Chrome and Edge but not in Firefox.

In Chrome and Edge: When I choose the option, activating a landmark in the menu get me there immediately and I like that. It is easier to navigate.

In Firefox (both through local loading and web-ext): When I activate the landmark, it focuses the body of the HTML document not the first link in the landmark. It failed everytime, no console log error appeared. The spacebar and the enter key were both used.

I was thinking once more about the suggestion of highlighting landmarks as they focus an option in the menu. When testing the main branch I can really see the value of having that by default when the user chooses the "Close the pop-up immediately when activating a landmark button" option. I know that scrolling the page" on focus" is a bad idea. But I would be a little frustrated to have to go out of the landmarks menu and have to scroll myself.

Then I was thinking of a crazy idea... What if, to use the behavior to go into the landmark a user can click the same menu item twice? First click does the default behavior. The second click brings the user into the landmark.

The benefactors of this extension are visual keyboard-only users. Within that category we have (to name a few):

The more we can diminish how many actions they have to perform to access landmarks the better. Thats why I am not sure if a double click solution would work because it could increase the clicks required. The benefits of the menu vs using the keyboard shortcuts seems to be cognitively I can see the structure of the page and understand where I want to go, quicker than if I jump from a landmark to another.

Maybe the "Close the pop-up immediately when activating a landmark button" option. I know that scrolling the page" option could also appear in the landmarks menu? Like the "Show all landmarks"?

Screenshot of the landmarks menu of the browser extension
matatk commented 2 years ago

Thanks for testing this out. Are you finding the keyboard problem with Firefox on the wombat-themed test page (I think your screengrab is from Chrome, but I see you were using the test page there)?

I'm using Firefox 104 on a Mac and I'm not getting the problem where it's focusing the body. In case you're using Windows, and that there's a cross-platform difference, I'll try it on Windows.

Please could you confirm which browser versions and OS you're using, and the address of a publicly reachable page on which the body-focusing bug happens?


Background info:

It's funny that you mentioned putting some options inside the pop-up—given that 'show all landmarks' is already there; I considered it. I'm not sure how many people who aren't developers or accessibility consultants might use 'show all landmarks' (maybe it should be just in the DevTools), but the reason it's in the pop-up is because it's really a command, rather than an option. (When I redo the UI, I should really make it a button that can be toggled, rather than a checkbox.) The reason why I put the 'close the pop-up...' option in the preferences page is because I imagine most users will set it and then not want to change it.

Thanks for your thoughts on the people using the extension; it's important to keep them in mind, and I'll endeavour to keep considering them. Whilst almost all of the people who use the extension that I've heard from are developers or accessibility consultants, it's really important that the extension is an assistive technology first.

I'm planning to replace the current pop-up UI with a 'proper' tree (and, at some point, for the extension to support headings too). When the pop-up includes a more standard tree control, I think that'll be a good time to consider the sorts of things you've suggested around interaction with the pop-up.

Even more backgroundy background info:

It's also a tough balance when it comes to publicising the DevTools part of the extension (i.e. how much I bother people about it, who may just be trying to use the extension as an assistive technology). The DevTools pane is mentioned in the docs, but unless people notice that, it's really hidden by browsers by default.

I am going to be forced to move the extension to the 'Manifest V3' API soon, and at that point there will need to be an 'onboarding' process, due to the changes that the API brings. At that point, it may be a good move to publicise the DevTools a bit louder during the on-boarding.

These changes have to happen this calendar year, so you can expect to see work on them soon.

kimviens commented 2 years ago

Hi @matatk, I just retested on Firefox 104, on Windows OS using the Wombat page: https://matatk.agrip.org.uk/landmarks/world-of-wombats/

It focuses the main element everytime:

. I am testing the following commit: Commit: 0e5228915c918d520bdbb3fbdfa95804f3bff6d0 [0e52289] Parents: 35aeebe494 Author: Matthew Tylee Atkinson matatk@users.noreply.github.com Date: September 3, 2022 3:51:10 PM Committer: GitHub fix(Help): Reflect that the sidebar was reinstated on Opera (#483)

kimviens commented 2 years ago

Responding to: "I'm not sure how many people who aren't developers or accessibility consultants might use 'show all landmarks' (maybe it should be just in the DevTools), but the reason it's in the pop-up is because it's really a command, rather than an option."

I like how its available in the pop up and the preferences. Giving the user multiple ways to using that feature, I think, is a good idea. I actually toggle it often because I like to see whats included in what landmark. Then, I deactivate it because I find it distracting to always have the landmarks.

Responding to: "it's really important that the extension is an assistive technology first."

I agree very much with that statement and I am ready to get more users to download this as an assistive technology. WCAG already supports this idea: ARIA11: Using ARIA landmarks to identify regions of a page

Responding to: "I'm planning to replace the current pop-up UI with a 'proper' tree"

Yes, that would be excellent!!

Thank you so much for your hard work @matatk! Once your changes roll out I will start to get more users to try the extension out.

matatk commented 2 years ago

I tested the latest released version (2.11.1) on Firefox, Chrome and Edge, in both macOS and Windows (11), to see if I could use Tab to start navigating from the selected landmark, after pressing Enter on its button in the pop-up, followed by Escape to close the pop-up. It did work for me (pressing Tab moved me to the first interactive element in the selected landmark). I understand that you were getting variable results, though as I am unable to reproduce the problem for now, and the latest main code worked for you, I will re-close this. Naturally, please re-open if it's still/becomes a problem in future.

I plan to make a release soon.

kimviens commented 2 years ago

Hi @matatk! Sounds great! I don't know why I had a different behavior. Hopefully, this might just be an issue on my side. If you need future testing for this extension, feel free to send me an email: [redacted by @matatk], subject line: "Landmarks Extension Required". I can test your future releases!

matatk commented 2 years ago

Thanks @kimviens. I've made a note of your email, and I also made the assumption that you'd probably not want it to be publicly reachable, so I've redacted it from the above message (feel free to put it back if you prefer). (Normally GitHub stores the edit history for comments, but I was able to remove it, as an admin for this repo.)

I've not made the next release yet, because I found a bug with the highlighting when permanent borders are in use, but I am working on fixing it, and expecting to make that release this weekend, hopefully.