Accname-matches-autocomplete

Using a string of characters in the (Accessible) Name that matches the string in the corresponding HTML5.2 autocomplete attributes

<section id="meta">

Metadata

html

sufficient

</section> <section id="applicability">

When to Use

This technique works in technologies that provide an accessible name.

</section> <section id="description">

Description

The accessible name is a programmatically determinable string of text which can be used in place of the autocomplete attribute on input elements. In order to use this technique, the accessible name string would have to be identical the corresponding autocomplete string, except for the insertion of spaces in the place of hyphens in the autocomplete tokens. HTML 5.2 provides a list of autocomplete tokens written in English with hyphens to separate the words. In this technique, spaces will generally be used instead of hyphens to separate words although hyphens would be acceptable also. In this technique it is also sufficient to use capital letters as appropriate in the accessible name.

The objective of this technique is to allow assistive technologies to examine the accessible name as an alternative to the autocomplete attributes when providing supports for people with cognitive disabilities, such as adding icons or replacing the text string with the desired string by the user.

This technique provides a way for authors to use a label for an input without having to add any further attributes in order to meet success criterion 1.3.5, Identify Input Purpose or 1.3.6, Identify Purpose. Naturally, authors should use this technique only for fields where the string of text that makes up the corresponding HTML 5.2 autocomplete attribute is a logical name that they would've chosen anyway. This technique generally applies to the English language because the autocomplete attributes are written using strings of English text.

</section> <section id="examples">

Examples

<section class="example">

Example 1: Simple contact form First Name and Last Name

Description

<label for="p1">Given Name</label> <input type="text" ... id="p1"> <label for="p2">Family Name</label>
<input type="text" ... id="p2">

<label for="p3">Address Line 1</label>
<input type="text" ... id="p3">

<label for="p4">Address Line 2</label>
<input type="text" ... id="p4">

<label for="p5">Postal Code</label>
<input type="text" ... id="p5">

<label for="p6">Telephone</label>
<input type="text" ... id="p6">

<label for="p7">Email</label>
<input type="text" ... id="p7">

<label for="p8">Username</label>
<input type="text" ... id="p8">



Note: the HTML 5.2 autocomplete string for Telephone is "tel" which is contained in the string of the (Accessible) Name used.

Working example: link

</section> </section> <section id="tests">

Tests

<section class="test-procedure">

Procedure

1. Check the text string of the (Accessible) Name
2. Compare it to the text string of the corresponding autocomplete attribute from HTML 5.2
3. Is the text string of the (Accessible) Name's corresponding autocomplete attribute from HTML 5.2 contained in the Name. (Case insensitive, hyphens can be replaced by spaces.)

</section> <section class="test-results">

Expected Results

• Check #2 and #3 are true the test passes and the technique has been propoerly implemented.

</section> </section> <section id="related">

Related Techniques

• ID

</section>