Accessibility improvements
What does this MR do and why?
Remediates low-hanging accessibility issues reported by Lighthouse.
Issues fixed in this MR
| Issue | Fix |
|---|---|
[user-scalable="no"] is used in the <meta name="viewport"> element or the [maximum-scale] attribute is less than 5 |
Removed user-scalable="no" attribute from page templates |
| Heading elements are not in a sequentially-descending order | Changed headings used in the Help & Feedback block |
| Links do not have a discernible name | Added screenreader-only text to the footer logo |
Lighthouse scores:
- Before: 79/100
- After: 88/100
Screenshots, screen recordings, or links to review app
| Before | After |
|---|---|
 |
 |
 |
 |
(The help/feedback block does not include the Comments link in non-prod environments, so the block looks smaller in the "after" shot; this is not related to this MR)
No visual differences expected.
How to set up and validate locally
Numbered steps to set up and validate the change are strongly suggested.
-
Configure a local GitLab Docs environment: https://gitlab.com/gitlab-org/gitlab-docs/-/blob/main/doc/setup.md and check out this branch. -
Compile the site and run the local web server ( make view). -
Check for visual differences in the following components: Help & Feedback box (bottom of interior pages), interior page footer/logo
Merge request acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this merge request.
Edited by Sarah German