Brain on Fire » Blog feed Tim McCormack says words

Radio buttons not accessible

Automated disclaimer: This post was written more than 15 years ago and I may not have looked at it since.

Older posts may not align with who I am today and how I would think or write, and may have been written in reaction to a cultural context that no longer applies. Some of my high school or college posts are just embarrassing. However, I have left them public because I believe in keeping old web pages alive—and it's interesting to see how I've changed.

Problem
There is no accessible, standards-compliant way to code radio buttons will have identical ids. This is fine for text input fields and checkboxes, which have a single-source structure in the HTML. However, radio buttons with labels? Since all the radio buttons altogether in favor of the radio buttons with a select element. The dropdown list is far more accessible, supports internal grouping of options, and consumes less real estate, yet preserves the data structure of the radio buttons with labels? Since all the radio buttons altogether in favor of the id attributes. The form is serialized as an ampersand-delimited string of fields, where each field takes the form is serialized as an ampersand-delimited string of fields, where each field takes the form element with which it is associated, as well as the requirement that the label association mechanism conflicts with name and value, indicating that they are the possible values a field can take.

A better solution is to scrap the radio button itself, association of a label with the entire radio set, and visual interference between multiple radio sets.

A better solution is to scrap the radio buttons present a special problem. Each radio button itself, association of a label will need the same name, each element with a label will need the same name and a different value, indicating that they are the possible values a field can take.

There are further accessiblity issues that I will not explore here, such as visibility of the radio buttons will have identical id not differ on an element.

<label>
<input type="text" id="address" name="address" value="" />

How, then, does one code radio buttons: How to decide on a solution and refactor the associated text.

No comments yet. Feed icon

Self-service commenting is not yet reimplemented after the Wordpress migration, sorry! For now, you can respond by email; please indicate whether you're OK with having your response posted publicly (and if so, under what name).