Considering order: labels for checkboxes and radio buttons

Hi Folks,
For blind access and accessibility does it matter if the HTML label element comes before or after its associated input element?

This seems like a really basic question, and I am not sure why I don’t actually have a solid answer for myself. Obvious for some control elements the label should, indeed come first, but for checkboxes, does it matter? Is there a preferred order?

Code sample:
<label for=“my-checkbox”>My Accessible Checkbox</label>
<input type=“checkbox” id=“my-checkbox” >

<input type=“checkbox” id=“my-checkbox” >
<label for=“my-checkbox”>My Accessible Checkbox</label>

Taliesin

Received on Thursday, 4 July 2019 11:00:57 UTC