Skip to content

fix(core/structure): improve "back to top" link accessibility - #5391

Open
marcoscaceres with Copilot wants to merge 6 commits into
mainfrom
copilot/accessibility-improvement-back-to-top-icon
Open

fix(core/structure): improve "back to top" link accessibility#5391
marcoscaceres with Copilot wants to merge 6 commits into
mainfrom
copilot/accessibility-improvement-back-to-top-icon

Conversation

Copilot AI commented Aug 11, 2026

Copy link
Copy Markdown
Contributor

Accessibility audits flagged the "back to top" link as too small/hard to click and misusing role="navigation" on a single link rather than a group of navigation links.

Markup

  • Removed role="navigation" from the #back-to-top element.
  • Replaced the icon-only <abbr title="..."> (accessible name hidden in a title attribute) with visible link text plus a decorative, aria-hidden="true" arrow:
<!-- before -->
<p role="navigation" id="back-to-top">
  <a href="#title"><abbr title="Back to Top"></abbr></a>
</p>

<!-- after -->
<p id="back-to-top">
  <a href="#title"><span aria-hidden="true"></span> Back to Top</a>
</p>

Styling

  • Added padding to #back-to-top a for a larger, easier-to-click/tap target.
  • Hid #back-to-top in print media, since it has no purpose on paper.

Tests

  • Updated existing structure-spec.js tests (title link, French localization) to match the new markup.
  • Added a test asserting role="navigation" is absent and that the link exposes visible accessible text.
Copilot AI changed the title [WIP] Improve accessibility for back to top icon Aug 11, 2026
Copilot AI requested a review from marcoscaceres August 11, 2026 13:03
@marcoscaceres marcoscaceres changed the title Fix accessibility of "back to top" link Aug 19, 2026
@marcoscaceres
marcoscaceres marked this pull request as ready for review August 19, 2026 09:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants