Make announcement banner into a landmark (aside/complementary) #1793
+40
−10
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.
One of many fixes for #1428.
Axe-core wants: all page content should be contained by landmarks.
The announcement banner was not a landmark, nor contained by one, so this PR:
div
to anaside
, making it into a "complementary" landmarkaside
This follows the implementation of the Black Lives Matter banner on a11yproject.com (i.e, an aside + aria-label).
I thought about putting both banners (version warning + announcement) together into a single landmark, but my thinking is that for sighted users, both banners are visually distinguishable and draw attention to themselves on every page, so I think making them both into separate landmarks achieves the same level of emphasis for both sighted and non-sighted users. It's also the simpler, more straightforward implementation.
After this PR, the landmarks read:
Note: we need to fix the section navigation landmark since it repeats the word navigation twice.