Explore Scroll down navigation options to ease alt nav users

[ClementineHahn]

📆 Study info

• Accessibility testing - July 2023 - Facilitator: @Lu-stack-art & @ClementineHahn
• Name of the test :
• Triage Board : link to the associated trello board

🚦 Issue severity : Low / Moderate / Severe ?

📝 What happened? Describe what the participant encountered as a problem, barrier or event.

📗 User story As a user, I need to ....., so that....

📜 Recommendations Researcher informed recommendation on possible actions to be taken

ℹ️ More info Add here any relevant links or context that could help find a solution

[Lu-stack-art]

Fake App Scenario-User Moderated testing for Screen Reader

https://trello.com/c/mK2JMSj9

User is prompted to locate the allergy considerations on the page. The expectation was for user to locate this section and then detailed content would display itself, beneath the heading/navigation link/tab. User was unable to easily locate the allergy section, as the tech didn't detect it, and when researcher explains that it is a link, the user retraces their steps and double taps on the link, and details do not drop down. The voice over tech is unable to read or clearly detect this section.

Researcher give hints which directed user to the navigation link/tab, prompting user to double tap. Otherwise this section would easily be missed, using this assertive tech. The drop down is not detectable or at least not clearly by the voice over. The expectation would be the (open/close). And when user located the section, the voice over did not indicate that the screen change or new content was added.

[ethanWallace]

After watching the video and doing some tests with voice control, it seems the user's AT was malfunctioning. I don't know what more we could explore or do to help when that type of situation happens.

[Lu-stack-art]

Compatibility testing on fable, for GC DS webpage navigation. User is tasked to find "Radio Component"

Assistive tech is Screen Magnification

https://trello.com/c/ec4ysD4J

User found it difficult to tell where my focus is: multiple hover text boxes

While using hover text in the same boxes, in this case the 'Radio component' box, there are 3 different hover text boxes, and it is not only confusing but it is tough to use the hover text on mouseover. The title, in this case is a link, as illustrated by my bright pink text against the dark blue background, and then there are 2 sections, one starting with the words "Other names..." and then a section below it "A short set..." While magnified, and seeing only sections of this, and the hover text scroll/starting at the end all make this much harder than it needs to be. Suggestions: If the title is the link, then make the other descriptions static, and all programmatically determinable using the OS and AT

Dev Notes- swap to card components which will resolve this issue

[Lu-stack-art]

Compatibility testing on Fable, for GC DS webpage navigation

Assistive tech being Screen Magnification

https://trello.com/c/KZOaYEHI

User found it difficult to read text due to colour contrast: Even while very magnified, the hover text appears very light white/cream as background, which makes it challenging to see. Consider what text looks like while inverted. The text and background are too close in colour range (white on cream) diluting any clear contrast between text and background.

Dev notes-work in progress, they will be replacing the overview component preview boxes with existing card component, and the Designers agree

[Lu-stack-art]

Compatibility testing on Fable, for the GC DS webpage navigation. user is tasked to copy the code

Assistive tech is Screen Magnification

https://trello.com/c/m28QuNhx

Buttons and links: Other-does copy button work/display more clearly Once clicking the “copy” button, there was no indication of that being copied onto the clipboard. Participant clicked 3 times to be sure…process unclear/no indicator os task being successful/complete.

possible suggestion (I think) : Some kind of popup that would be in focus, and remain visible long enough for me to make the magnification setting changes I needed to make. ideal to have indicator that code was copied correctly.

Dev Notes-button does say ‘copied’ versus copy. Devs will make button bigger to show better visibility

Designers notes-option could be to add lighter border to also show better visibility, or change the fill to a lighter colour...however, the easier fix is to place border around, (same colour as the text)

[Lu-stack-art]

Self-guided testing on fable, for GC DS webpage navigation. User is tasked to locate the find the “text area” component's coding guidance

Assistive tech is Screen Reader

https://trello.com/c/HgfXijul

The skip to main page has never been boxed in, and unsure if there should be a skip to content link

A skip to main content often has text announced, and in this case the skip to main content was reading the coding of the area versus the content in the box

Instructions are to “skip to main content, main navigation region, and then there’s an actual skip to main content link, and navigation end” this seems “verbose” and confusing for user/participant…unclear what the take away is for tester and users

Most websites have a ‘skip to main content link’ provided

Dev Notes-still looking into this issue

Focus is more with navigation landmark and with link in it…by default are the same

Devs are wondering if they remove label from navigation, or rename navigation landmark

currently work in progress