Identify Input Purpose
The purpose of each input field collecting information about the user can be programmatically determined when the field serves a purpose listed in the Input Purposes for User Interface Components section.
What it means
The intent of this success criterion is to ensure that the purpose of a form input collecting information about the user can be programmatically determined, so that user agents can extract and present this purpose to users using different modalities. The ability to programmatically declare the specific kind of data expected in a particular field makes filling out forms easier, especially for people with certain cognitive disabilities. Appropriate visible labels and instruction can help users understand the purpose of form input fields, but users may benefit from having fields that collect specific types of information be rendered in an unambiguous, consistent, and possibly customized way for different modalities - either through defaults in their user agent, or through the aid of assistive technologies. For some input fields, the type attribute already offers a way to broadly specify the intention of the input field, for example, <input type="tel"> , <input type="email"> , or <input type="password"> . However, these are only very broad categories, describing the type of input, but not necessarily its purpose, especially as it relates to user-specific input fields. As an example, type="email" indicates that the field is for an email address but does not clarify if the purpose is for entering the user's email address or some other person's email. This success criterion defines the types of user interface component input purposes, found in Section 7 of the WCAG 2.1 Recommendation , that must be programmatically identifiable. When these user input purposes are present, and if the technology supports doing so, the field purpose must be programmatically identifiable.
Failing example
<!-- Fails: no autocomplete on personal data fields -->
<input type="text" name="fname" placeholder="First name">
<input type="email" name="email" placeholder="Email">How to fix it
<!-- Pass: autocomplete values from WCAG SC 1.3.5 list -->
<input type="text" name="fname" autocomplete="given-name"
placeholder="First name">
<input type="email" name="email" autocomplete="email"
placeholder="Email">How A11yRisk detects this
A11yRisk detects this criterion automatically.
Scan your site for this violation →