Accessibility Issues
-
With website accessibility lawsuits on the rise, I decided to run a few different accessibility website scanners. The scanner at accessible ( https://accessibe.com/accessscan ) may be the most picky scanner of them all. It’s returning the following issues with the form:
ISSUE 1 –
Font icons, SVGs, or images used as spacers, decorations, or when their purpose is already described by other content, should include a role=”presentation” or role=”none” attribute.
2 Code snapshots of failed elements
- <span class=”wpuf-wordlimit-message wpuf-help” ></span>
ISSUE 2 –
Required form fields should include aria-required=”true” to inform screen-reader users of the field’s validation.
3 Code snapshots of failed elements
- <input name=”name[first]” type=”text” placeholder=”” value=”” size=”40″ data-required=”yes” data-type=”text” data-style=”wpuf-style” class=”textfield wpuf_name_548″ autocomplete=”given-name”>
- <input name=”name[last]” type=”text” class=”textfield” placeholder=”” value=”” size=”40″ autocomplete=”family-name” data-style=”wpuf-style”>
- <input id=”email_548″ type=”email” class=”email wpuf_email_548″ data-duplicate=”” data-required=”yes” data-type=”email” data-style=”wpuf-style” name=”email” placeholder=”” value=”” size=”40″ autocomplete=”email”>
ISSUE 3 –
Form fields should include either an “aria-label” attribute or an associated “label” element to describe the field’s purpose (e.g., email, phone, name).
2 Code snapshots of failed elements
- <input name=”name[first]” type=”text” placeholder=”” value=”” size=”40″ data-required=”yes” data-type=”text” data-style=”wpuf-style” class=”textfield wpuf_name_548″ autocomplete=”given-name”>
- <input name=”name[last]” type=”text” class=”textfield” placeholder=”” value=”” size=”40″ autocomplete=”family-name” data-style=”wpuf-style”>
If you believe these are valid issues, do you have any solutions?
- You must be logged in to reply to this topic.