huangkevin-apr opened a new pull request, #1061: URL: https://github.com/apache/incubator-seata-website/pull/1061
## What is the purpose of the change This PR fixes an accessibility violation where the `<section>` element in the feature component lacks an accessible name. By adding proper ARIA labeling (`aria-labelledby` attribute), screen reader users can now identify and navigate to this landmark region effectively, improving the overall accessibility compliance of the website. **Screenshot of Detected Violations:** <img width="2560" height="921" alt="image" src="https://github.com/user-attachments/assets/2f5bd0ca-8176-4d49-babc-f087ac02f3aa"; /> **Violation Details:** ``` **Content is not within a landmark element** All content must reside within an element with a landmark role ``` **Why is this important?** Landmark roles provide programmatic access to sections of a web page, making it easy for the user to understand the structure of the page and easily navigate to different sections. They also enable users to skip over blocks of content that are repeated on multiple pages. **Violation Elements:** <img width="1920" height="820" alt="5" src="https://github.com/user-attachments/assets/fd67c3ec-e009-4eb1-8b36-fa3c5defcb77"; /> **Violation Report:** [http%3A%2F%2Flocalhost%3A3000%2F_llm_processed_group_size_final.json](https://github.com/user-attachments/files/24552676/http.3A.2F.2Flocalhost.3A3000.2F_llm_processed_group_size_final.json) ## Brief changelog - Added `aria-labelledby='feature-title'` attribute to the feature section element - Added `id='feature-title'` to the existing `<h3>` heading element - This creates a programmatic relationship between the section and its heading, providing an accessible name for the landmark region Follow this checklist to help us incorporate your contribution quickly and easily: - [x] Make sure there is a [GITHUB_issue](https://github.com/apache/incubator-seata-website/issues) filed for the change(usually before you start working on it). Trivial changes such as typos do not necessitate a GITHUB issue. Your pull request should solely focus on addressing this specific issue without incorporating any other modifications. Each PR should resolve a single issue. - [x] Format the pull request title like `doc: add an operations guide document`. Each commit within the pull request should contain a meaningful subject line and body. - [x] Write a pull request description that is detailed enough to understand what the pull request does, how, and why. - [x] Test your code locally by running `npm run build`, and make sure it works as expected. - [x] Ensure that no files under the `build` folder are included in the commit, as well as the `package-lock.json` and `yarn.lock` files. -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
