Label is an important piece of text that tells you what the purpose of the control is. Users can decide based on the label if clicking or activating the button will submit the form details or reset the form!
Unique and descriptive labels must be provided for all types of controls.
Adding visual labels is beneficial for all users but it is essential to remember to programmatically define the labels. A programmatically defined label will tell assistive technology users about the purpose of the control when they navigate between different controls on a web page or an application. In the absence of label, assistive technology will identify the control as unlabeled! Furthermore, off-screen labels should be avoided as they are not available for everyone!
Labels can be provided in the form of text, images, symbols, text along with images or symbols. In the case of images used as labels, make sure that textual descriptions are added such that the information can be made available for assistive technology users!
Generally, textual labels are provided for input fields, drop-downs, checkboxes, and radio buttons whereas symbols or icons are used for menus and buttons. It is recommended to place labels to the left or top of input fields and drop-downs and on the right of checkboxes and radio buttons.
For Global Accessibility Awareness Day, (GAAD 2023), BarrierBreak ran a campaign “#LabelYourControls” as we believe Accessibility is a journey and labelling your controls is a crucial step of this journey when it comes to making your digital solutions accessible for people with disabilities! Our team shared helpful tips throughout the day i.e. 18th May, 2023 marking GAAD on Twitter, LinkedIn and Facebook.
Download the 12 tips on how to #LabelYourControls on web, android and iOS and feel free to share these tips with your colleagues, friends, or anyone who may be interested in promoting accessibility.