Table of Contents
    Understanding WCAG Success Criterion 4.1.2 Name, role, value (A)

    All interactive components must have an accessible name and role, and the state of the component must be communicated to assistive technologies. This ensures that screen reader users understand the purpose (role) of every component, how to identify it (name), and what state it is in.

    Accessibility Requirements for 4.1.2 Name, role, value (A)

    • All interactive elements and components have an accessible name;
    • All interactive elements and components have a role (either implicit or explicit);
    • All interactive elements and components communicate information about their state.

    Common mistakes for 4.1.2 Name, role, value (A)

    • An <a> or <button> element contains no text content, and so has no accessible name;
    • A form field has no associated <label> element, and so has no accessible name;
    • A set of tabs is created using <ul><li>, and <a> elements, but ARIA has not been used to provide the tablisttab, and tabpanel roles;
    • An <a> element has been used as the basis for a button, but the ARIA button role has not been applied;
    • A button is used as the trigger to disclose content, but the aria-expanded attribute has not been used to communicate the disclosure component’s current state;
    • <div> or <span> has been used as the basis for an interactive component, but ARIA has not been used to identify the purpose of the component (or its constituent parts).

    Techniques for 4.1.2 Name, role, value (A)

    HTML Technique

    Common Failures for 4.1.2 Name, role, value (A)

    The following are common mistakes that are considered failures of Success Criterion 4.1.2 by the WCAG Working Group.

    FAQS for Name, role, value

    How to test this success criteria?

    Visiting your web page using an assistive technology such as a screen reader.
    Checking that every interface component contains a name and role/
    Changing the value on each applicable component, and confirm that your tech is alerted to the value change (i.e. click an element to bring it into focus and make sure your screen reader caught the change).

    What are standard web specification for this guidelines?

    1.Every control has a name or label
    2. Role of each control e.g. pull down menu, link, radio button, etc. is identified
    3.The state of each control is visible and announced by AT
    notifications about changes of focus are made to AT, such as -whether or not the control has focus.
    -whether or not a control option is selected
    -which option was selected, such as a checkbox, radio button, or if a collapsible list is expanded or collapsed.

    Related to 4.1.2 Name, role, value (A)

    1.1.1 Non-Text Content (A)

    4.1.1 parsing (A)

    Useful resources for 4.1.2 Name, role, value (A)

    Leave a Reply

    Your email address will not be published. Required fields are marked *