Accessible Components: Labeling — Polycasts #51

Video News
Today we’re wrapping up our series on accessibility by talking about labeling. While it’s important to make sure our elements have great keyboard support and semantics, we also need to make sure we can tell the user what our control is being used for. For example, if you were using a screen reader and you landed on a control that just said “”button””, you wouldn’t really know what to do with it. Imagine instead that the button said “”Main Menu, button””, that would be much nicer! The way we achieve that affect is by providing our element with an appropriate label.

In the world of ARIA there are three ways to label an element.

– aria-label: This generates a text alternative for an element and it will be read instead of reading the element’s contents
– aria-labelledby: This let’s us point at another element to say “”that element is my label””!
– name by content: For small elements it’s possible to just generate the label by its content

In this episode of Polycasts I’ll demonstrate all three approaches so you can better understand when to use each in your specific app or element.

W3C ARIA Authoring Practices 1.1

Polymer Slack:

Subscribe to the Chrome Developers channel at

Products You May Like

Articles You May Like

Cult Shock X Review: An Average Budget Fitness Tracker That Gets the Job Done
GTA San Andreas Cheat Codes: Full List of GTA San Andreas Cheats for PC, PlayStation, Xbox, Switch and Mobile
Fortnite Maker Epic Games Moots Google Play Store Reforms After Antitrust Win
How to Do Steel Wool Photography: The Essential Guide
Fairphone Fairbuds With Active Noise Cancellation, Replaceable Battery Launched

Leave a Reply

Your email address will not be published. Required fields are marked *