Descriptions not programmatically associated with fieldsets

[plousia]

Saw this in the Accessibility newsletter and thought I'd give it a quick whirl...tested in NVDA. I'll post each issue separately.

The descriptions about how many checkboxes to select are not programmatically associated with their fieldsets, so are not read by the screen reader when focus enters the fieldset. Blind users are likely to never come across them, particularly when tabbing through the form using a keyboard or keyboard-alternate device.

You want to give each description a unique ID and use aria-describedby to programmatically associate them with their fieldset.

[aarongustafson]

Thanks for flagging this. That's weird. I wondered if I messed something up when I converted it over from a codepen.. I'd attached thearia-describedby to the legend which should be read out when the first checkbox is navigated to. I'll do some additional testing when I'm back from vacation and not on my mobile device.

[aarongustafson]

I tweaked the way the description is associated so that both the legend and description are now part of the fieldset label itself (rather than relying on aria-describedby). This should resolve the issue you were seeing. I also forgot that the ul structure I used in the demo would cause issues with the semantics of the fieldset, so I fixed that as well. Please confirm when you have a moment.

[plousia]

That works as well, tested working in NVDA. I'd be a little wary about it overriding the native legend labelling, interesting how you've accounted for that. I hadn't seen that technique before.

[aarongustafson]

I don't remember exactly where I found the technique in use but I did did some digging around in examples from WebAIM and Adrian Roselli.