Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Accessibility] Select Element must have an accessible name #851

Open
We13b-MD opened this issue Mar 22, 2024 · 6 comments
Open

[Accessibility] Select Element must have an accessible name #851

We13b-MD opened this issue Mar 22, 2024 · 6 comments
Labels

Comments

@We13b-MD
Copy link

We13b-MD commented Mar 22, 2024

The accessibility issue I encountered with the element pertains to ensuring that the element has an accessible name. An accessible name is essential for users who rely on screen readers or other assistive technologies to understand the purpose or function of the element. According to https://dequeuniversity.com/rules/axe/4.2/select-name?a Effective form labels are required to make forms accessible. The purpose of form elements such as checkboxes, radio buttons, input fields, etcetera, is often apparent to sighted users, even if the form element is not programmatically labeled. Screen readers users require useful form labels to identify form fields. Adding a label to all form elements eliminates ambiguity and contributes to a more accessible product. When labels for form elements are absent, screen reader users do not know the input data expectations. Screen readers cannot programmatically determine information about input objects without an established label relationship (or redundant text serving as a label). Screenshots ) Before change After Changes

@We13b-MD We13b-MD added the bug label Mar 22, 2024
@Ayesh-07
Copy link
Contributor

It sounds like you're working on improving the accessibility of form elements by ensuring they have appropriate labels for screen reader users. This is a crucial step in making your website more accessible. :

  1. An accessible name is essential for users who rely on screen readers or other assistive technologies.
  2. Effective form labels are required to make forms accessible.
  3. Screen reader users require useful form labels to identify form fields.
  4. Adding a label to all form elements eliminates ambiguity and contributes to a more accessible product.
  5. When labels for form elements are absent, screen reader users do not know the input data expectations.

@We13b-MD
Copy link
Author

Yes sure exactly let us find more ways to improve the Accessibility of the website am still going through the workbench page if you have more suggestions let me know

@We13b-MD
Copy link
Author

Alright thank you noted

@Ayesh-07
Copy link
Contributor

Skip Links: Include a "Skip to main content" link for keyboard users.

Headings and Structure: Use proper heading tags for a logical structure.

Focus Order: Ensure a logical tabbing order for keyboard navigation.

Landmark Roles: Use ARIA landmark roles to define page regions.

Descriptive Links: Use descriptive link text instead of generic phrases.

Text Resize: Allow text resizing up to 200% without issues.

Timeouts and Sessions: Avoid disruptive session timeouts.

Language Attribute: Specify the language of each page.

Accessible Tables: Ensure tables are marked up correctly for screen readers.

Consistent Navigation: Keep navigation menus consistent across pages.

Implementing these can make your website more accessible.

@Ayesh-07
Copy link
Contributor

@We13b-MD

Thank you for your understanding. I wanted to clarify an accessibility issue. I'm eager to start my journey in open-source contributions as an Outreachy applicant. My goal is to learn and grow while making meaningful contributions.

@We13b-MD
Copy link
Author

Great same here 👍if you have any questions am willing to help

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants