Fix: Accessibility roles and aria labels

[jhildenbiddle]

Summary

Improves site accessibility by assigning proper roles and aria attributes to elements by implementing all non-breaking recommendations from #2295.

Note: You may have to unmute the videos below to hear VoiceOver audio.

Before

• Landmark elements are not properly identified
• Search results not identified

2295-before.mp4

After

• Landmark elements are properly identified
• Search results are identified

2295-after.mp4

Related issue, if any:

#2295

What kind of change does this PR introduce?

Accessibility
Fix
Feature

Does this PR introduce a breaking change?

No

Tested in the following browsers:

• Chrome
• Firefox
• Safari
• Edge

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
docsify-preview	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 17, 2023 1:28pm

[trusktr]

The changes look good for non-ecosystem-breaking changes. Are there any other elements that could possibly need aria labels?

[jhildenbiddle]

Are there any other elements that could possibly need aria labels?

See #2254.

There is another issue I'd like to resolve, but I don't think it will be possible without a breaking change...

The hyphens used in our sidebar navigation are rendered as ::before pseudo content. As far as screen readers are concerned, this is content that should be read just like any other content on the screen. For example:

Quick start - Initialize - Writing content - Preview your site - Manual initialization - Loading dialog 

The result is that links are announced as follows using macOS VoiceOver:

"Link. Quick start",
"Hyphen. Link. Initialize",
"Hyphen. Link. Writing Content."
"Hyphen. Link. Preview your site."

Ideally, the hyphen would don't be announced.

I don't think this is a big deal though, especially if we intend to update our UI in the relatively near future. My preference is to merge these changes without introducing breaking changes and address the hyphen issue when we tackle UI updates.