search

felixarntz / bootstrap-for-contact-form-7

This plugin modifies the output of the popular Contact Form 7 plugin to be styled in compliance with themes using the Bootstrap CSS framework.
https://wordpress.org/plugins/bootstrap-for-contact-form-7/
GNU General Public License v2.0
24 stars 18 forks source link

Added code to properly label elements for screen readers #27

Closed acrawly closed 8 years ago

acrawly commented 8 years ago

Two changes:

  1. Changed code to add <label for='id'> when the id field has been specified on a field.
  2. For radio groups, wrapped them in <fieldset> element.

I don't know how to do versioning so I changed the version to 1.3.1 where applicable.

felixarntz commented 8 years ago

I see the issue with the missing <label for=""> attributes, but why do we need a <fieldset> on radio groups?

acrawly commented 8 years ago

Because under the WCAG 2.0 standards, radio buttons must be grouped together within a fieldset tag to show they are related. Technically, we must also have a <legend> element as well but I couldn't figure out a way to easily do this with existing code. Adding the fieldset tag has no affect on Bootstrap's styling from my reading.

We could take it out or perhaps add an option which wraps checkboxes and radio buttons in the field set? Let me know your thoughts around this and I can change a few more things.

UPDATE: forgot my reference, here

felixarntz commented 8 years ago

I think you might have forgotten to add the fieldset to the checkbox group, I only see it for the radio group right now.

Anyway, I like this conditional approach with a setting. Can you add the fieldset to the checkbox group too? Then I'll merge it in and create a setting for it.

acrawly commented 8 years ago

Right, I forgot. I've added the fieldsets for the options, let me know what option you end up making it! :) Thanks for your help.