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

[blocks] optional labels for certain inputs #946

Closed
pngwn opened this issue Apr 7, 2022 · 2 comments · Fixed by #1105
Closed

[blocks] optional labels for certain inputs #946

pngwn opened this issue Apr 7, 2022 · 2 comments · Fixed by #1105
Assignees
Milestone

Comments

@pngwn
Copy link
Member

pngwn commented Apr 7, 2022

For most form elements, labels are required for accessibility reasons but for outputs the case is less clear. They certainly need useful descriptions but since they are not interactive form elements, the accesibility considerations are more around readability.

We need to figure out how/ where we can make certain labels optional without compromising end user usabilty or accessibility.

Continuation of #704.

@abidlabs abidlabs added this to the 3.0 milestone Apr 19, 2022
@abidlabs
Copy link
Member

abidlabs commented Apr 20, 2022

@pngwn I was looking into this and it looks like labels needed to be provided for accessibility reasons, but they don't necessarily need to be visible:

A label for a form control helps everyone better understand its purpose. In some cases, the purpose may be clear enough from the context when the content is rendered visually. The label can be hidden visually, though it still needs to be provided within the code to support other forms of presentation and interaction, such as for screen reader and speech input users. The method used in this tutorial to hide an element visually but make it available for assistive technologies is explained in Note on hiding element.

Source: https://www.w3.org/WAI/tutorials/forms/labels/

I think it would be nice if people can make the labels invisible because sometimes they clutter up the UI or look out of place. What do you think about adding a "hide_label" boolean parameter to each of the form elements? False by default, but can be set to True, which makes the label invisible.

@pngwn
Copy link
Member Author

pngwn commented Apr 21, 2022

Works for me, tailwind has a class for that: https://tailwindcss.com/docs/screen-readers

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

Successfully merging a pull request may close this issue.

2 participants