Skip to content

Conversation

@DNin01
Copy link
Member

@DNin01 DNin01 commented Oct 23, 2025

Changes

These changes are the start of improvements to screen reader accessibility.

Screen reader users will notice the following enhancements:

  • Landmarks have been added.
  • Semantics have been added to the addon list.
  • More icons have been assigned labels or alt text.
  • Groups of related content and important region markers have been labeled.

Let me know if I missed anything.

Commit summary

  • Initial changes (1-5)
    • 🏷️ Add labels to icons — adds either alt text or tooltips to several graphics.
    • 🏳️ Label groups and landmarks — adds landmarks to the banner, navigation, and main content, and adds ARIA attributes to blocks of content like addon bodies, addon group separators, and info boxes.
    • 🫧 Popup updates — applies the above changes to the extension's popup.
    • 🔖 Label blocks and inputs — adds ARIA labels to addon checkboxes/inputs, setting description tooltip containers, and "new features" message boxes.
    • 📂 Semantics in addon list — turns some elements in the addon listing page into headings.
  • Revisions since pull request open (6-10)

Tests

Tested with:

  • Edge 141
  • Windows Narrator

@DNin01 DNin01 requested a review from Samq64 October 23, 2025 01:51
@DNin01 DNin01 added type: enhancement New feature for the project scope: addon api Related to the addon.* JS APIs or other ways for addons to provide features scope: webpages Related to the web pages (settings page, pop-up, etc) scope: user experience Related to the user experience (UX) aspect of the extension scope: accessibility Addresses an accessibility issue and removed scope: addon api Related to the addon.* JS APIs or other ways for addons to provide features labels Oct 23, 2025
Copy link
Member Author

@DNin01 DNin01 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some things to consider…

"description": "A label used by screen readers."
},
"enabledAddon": {
"message": "$1, add-on, on",
Copy link
Member Author

@DNin01 DNin01 Oct 23, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why did I write the string like this?

  • Some synthesizers mispronounce "addon" and it is technically a contraction of the full word "add-on", so that was used here.
  • We usually refer to an addon's state as either "enabled" or "disabled", but Windows Narrator uses the term "disabled" to indicate a grayed-out control, so for distinction, I used "on" and "off" here.

src="../../images/icons/help.svg"
class="icon-type setting-help-icon"
tabindex="-1"
:aria-labelledby="'setting-description-' + setting.id"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here we have a graphic (image) whose label—alt text, essentially—is the full description of the setting. Is that right?

@DNin01 DNin01 requested a review from mxmou October 25, 2025 15:44
@DNin01 DNin01 requested a review from Samq64 October 26, 2025 16:38
@DNin01 DNin01 added this to the v1.45.0 milestone Oct 26, 2025
@DNin01 DNin01 removed the request for review from Samq64 November 15, 2025 22:51
@DNin01 DNin01 changed the title Webpages: Improve screen reader support Webpages: Improve screen reader navigation experience Nov 21, 2025
@DNin01 DNin01 modified the milestones: v1.45.0, v1.46.0 Dec 5, 2025
@WorldLanguages
Copy link
Member

Great work!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: accessibility Addresses an accessibility issue scope: user experience Related to the user experience (UX) aspect of the extension scope: webpages Related to the web pages (settings page, pop-up, etc) type: enhancement New feature for the project

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants