A11y fixes #40
Open
A11y fixes #40
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
this changes the Sponsors main menu link to go to the list of sponsors rather than the prospectus also we have 2 sponsors now, both bronze, one streaming Index Data details are here but commented out until they finalize payment
Add first couple sponsors
skip the logo link by adding aria-hidden and tabindex -1 the 'home' link goes to the same location so this saves keyboard users a step
this is an accessibility best practice, we had <div id=main> but needed to use either <main> or role=main, using the element works
I don't think we'll need to return to this commented out structure and if we do, we have previous versions of the site on github
Member
Author
|
The sponsors commit is here because I based this off the wrong branch then messed up a force push (good lesson to be more careful). It shouldn't be a problem when merging. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
While reviewing the site, I noticed a few accessibility improvements we can make.
Document does not have a main landmark — a Lighthouse recommendation. We have
<div id=main>in our templates but that's not semantic, we need either<main>or<div role=main>. After this PR, the recommendation no longer appears in Lighthouse (Chrome > Dev Tools > Lighthouse > use the Accessibility category).Redundant link — a WAVE warning because the Code4Lib logo and "home" links both go to the site home page. Visually, they float to opposite sides of the page, but they are adjacent in the source code. I added
aria-hiddenandtabindex=-1to the logo link so keyboard users skip it and interact only with the "home" link. If you run WAVE, this warning still appears because WAVE intentionally ignores aria-hidden and tabindex=-1. To verify the fix: confirm that keyboard navigation first goes to the "skip to main content" link, then the "home" link, skipping the logo.Finally, I also removed a bunch of commented out code in our nav.html template. Please confirm the mobile site view is not broken (e.g. use dev tools to emulate a phone screen).