Support » Plugin: Contact Form 7 » first_as_label NOT WCAG Level A Compliance for Select Lists

  • Resolved Trible

    (@trible)


    After trying to resolve so many errors in the forms, I could NOT resolve the one for Select lists.

    VIOLATIONS
    Provide a valid label for form fields
    Severity: 10

    When on-screen labels are present, they must be programmatically associated with form fields. When on-screen labels are not present, form fields must be given an accessible label.

    When form fields do not have a programmatic (accessible) label, assistive technologies may incorrectly render the label or provide no label at all to users. When labels are not present or are incorrect, users of assistive technologies may not be able to complete a form.

    The HTML5 specification has a new form field attribute called placeholder. This represents a label or hint, such as a word or short phrase, that is assigned to a form field such as an input field. The label or hint appears within the form field and goes away when users start typing. When the placeholder attribute is used, the label or hint may not be detected by assistive technologies. Therefore, developers should provide off-screen text in the label element of the form field or provide a title
    Violations Identified (2)

    `<select aria-invalid=”false” aria-required=”true” class=”wpcf7-form-control wpcf7-select wpcf7-validates-as-required” name=”menu-407″>
    <option value=””>How Did You Hear About Us</option>
    <option value=”Referral”>Referral</option>
    <option value=”Online”>Online</option>
    <option value=”Signs”>Signs</option>
    <option value=”Other”>Other</option>
    </select>`

    Please advise?

    Thank you in advance,
    Trish

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Takayuki Miyoshi

    (@takayukister)

    The accessibility alert is saying about the lack of valid labels, saying nothing about first_as_label.

    I checked the form on your site. Indeed, none of the form fields has a <label> element.

    Use <label> correctly. A placeholder is not a substitute of a label.

    See https://www.w3.org/WAI/tutorials/forms/instructions/

    Thread Starter Trible

    (@trible)

    @takayukister Thank YOU ever so much for pointing that issue out Takayuki.

    I took over keeping this site updated from someone who had outsourced the development, therefore I didn’t even THINK to look at the elements within the forms themselves.

    This issue is all fixed now.

    Now, if I can just get the theme fixed too, I’m laughing.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘first_as_label NOT WCAG Level A Compliance for Select Lists’ is closed to new replies.