RE: Mandatory fields

Whilst I prefer (required) I would argue that the asterisk is such a common convention visually (in the context of forms) that it stands alone as an indication in the same way that the 3.5” floppy graphic means save.



From: Russ Weakley - Intopia <russ@maxdesign.com.au>
Sent: Saturday, 14 May 2022 1:13 pm
To: w3c-wai-ig@w3.org
Subject: Re: Mandatory fields

CAUTION: This email originated from outside of the organization.

Hi Sarah,

All mandatory form fields should be:

  *   Programmatically identifiable
  *   Visually identifiable

Programmatically

Either of the solutions below will set the field as “required" in the accessibility tree:

<input> with required
https://russmaxdesign.github.io/accessible-forms/required01.html


<input> with aria-required
https://russmaxdesign.github.io/accessible-forms/required02.html


Visually

There are a range of methods that visually identify mandatory fields. As Marc Haunschild mentioned, an asterisk on its own would not comply - unless there was also some sort of key above the form. Even then, this solution presents accessibility concerns. One solution is to add text saying "(Required)" to the label, so that this information is presented visually.

<input> with required and "(Required)" added to label text
https://russmaxdesign.github.io/accessible-forms/required04.html


<input> with aria-required and "(Required)" added to label text
https://russmaxdesign.github.io/accessible-forms/required08.html


You COULD choose to hide the visual "(Required)" text from the accessibilty tree using aria-hidden="true", but be aware this could possibly present issues for some voice command tools in some situatiosn

<input> with required and aria-hidden="true" applied to "(Required)" text
https://russmaxdesign.github.io/accessible-forms/required05.html


<input> with aria-required and aria-hidden="true" applied to "(Required)" text
https://russmaxdesign.github.io/accessible-forms/required07.html


HTH
Russ






Kevin Prince  
Product Accessibility & Usability Consultant
 
  
Foster Moore 
A Teranet Company 
  
 
E kevin.prince@fostermoore.com 
Christchurch 
fostermoore.com 
On 13 May 2022, at 11:48 pm, Ms J <ms.jflz.woop@gmail.com<mailto:ms.jflz.woop@gmail.com>> wrote:

Hello

For 3.3.2 do mandatory fields need to be identifiable as such in the label in the first instance? Or is it sufficient to use error handling to prompt users to complete the form?

If fields are marked with an asterisk and error handling is used to inform users when they have missed a required field, but the asterisk is not explained, does this fail 3.3.2?

Thanks

Sarah