Open klohman opened 6 months ago
Desc:
Below are the places that need correction:
Note This H1 creates an inappropriate jump in heading levels within the document heading hierarchy
when top menu is not clicked, run AMP, it will render Color contrast ratio issue, it looks like pointing to menu, but with further look, it seems generated automatically and not direct code managed by us. Note: I searched from our code in VSCode, can't find those with class ="item-tooltip">, but when I search the home page source code (rendered html), I found those hidden element below. Looks to me it is auto generated and not code we directly managed, but I am not sure if this is auto generated by astro or USWDS. @mark-meyer or @jfredrickson would you mind double checking this issue, and see if this issue can be addressed or ignored?
click expand for top menu, then run AMP. Below errors are identified: @mark-meyer would you mind taking a look as well since you are currently working on top menu?
Description
Note
This A is focusable and has an aria-hidden attribute set to true
All other pages passed excerpt for Home page:
- Low color contrast ( Can be ignored, please see comment below for manual color ratio test results)
-Heading level jump (Same as AMP)
-Heading level jumps.
@rosamundtgov For DPA page, there are same" OASIS+ Interact Community" text linked to slightly different URL, which cause accessibility complaints , one is https://buy.gsa.gov/interact/community/196/activity-feed, another one is https://buy.gsa.gov/interact/community/196, can we sync both using same link, e.g. both use https://buy.gsa.gov/interact/community/196/activity-feed?
For Home page color contracts issue (AMP & WAVE), for "Find out what’s next" section, actually we are using a dark background image, but these automated tool are checking against background color (white) vs foreground text color( also white), I did manual color contrast ratio test for the foreground text vs background image, the color contrast ratio is good and passed the accessibility requirement, please see screen shot below. So this color contrast ratio issue on home page can be ignored.
How about adding pa11y to do a bit of automated testing?
Seems like a good idea to me @jfredrickson5 , @mark-meyer @weiwang-gsa ☝ what do you think?
@vickimcfadden yes, we will add the pa11y for automated testing, just let you know that pa11y can only catch obvious accessibility issue, it can't catch intense accessibility issues like AMP does though, manual testings are still needed.
@rosamundtgov For DPA page, there are same" OASIS+ Interact Community" text linked to slightly different URL, which cause accessibility complaints , one is https://buy.gsa.gov/interact/community/196/activity-feed, another one is https://buy.gsa.gov/interact/community/196, can we sync both using same link, e.g. both use https://buy.gsa.gov/interact/community/196/activity-feed?
Let's use https://buy.gsa.gov/interact/community/196 across the board. I'll make a note on another ticket to update this other places if needed.
@vickimcfadden automated accessibility test pa11y is added to the project and code merged into main. @rosamundtgov the link update for "OASIS+ Interact Community" is completed and code also merged into main.
Just confirmed with @klohman, the "OASIS+" as H1 header causing two H1 header on one page issue can be ignored for now until we get new OASIS+ logo to replace it.
@rosamundtgov, for Contact page, the page title currently set to "Contact", which is too short and AMP doesn't like it, is it possible we change both page title and h1 header to "Contact OASIS+" or something longer that you think more appropriate? I tagged you in the accessibility findings as well just in case you want to know what is the issue.
For items under 3.Top Menu
Keyboard testing complete and no issues found.
Also reviewed with 200% zoom on Chrome and saw no issues. @brentryanjohnson If you want to take a quick look as well.
I tested the main
branch at 200%...I didn't noticed any specific problems, other than the side (in-page) nav gets cropped out of the viewport, which likely isn't a huge deal.
As an aside, I did notice the button link on this page is broken. I suspect that's probably a known issue. (Also, these icons are 💯!)
@brentryanjohnson Thanks for the review. I added the broken link to #120
I think we have all of the issues identified in other cards and/or done. Moving this to done.
Before the new OASIS+ site goes live, we need to do some manual & automated testing, to ensure the new program site is accessible: