WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using required attribute with a star mark VS Marking as optional

for

From: Isabel Holdsworth
Date: Jan 31, 2019 2:44AM

Hi,

The best implementation of marking up optional fields that works for
me personally is to somehow have the word "optional" in the label
belonging to each optional field. This could be inserted as an
aria-label or as the alt text of a graphic.

This is purely personal opinion.

Cheers, Isabel

On 31/01/2019, Graham Armfield < <EMAIL REMOVED> > wrote:
> Hi Ramakrishnan,
>
> My own view is that it doesn't matter which way you do it as long as users
> know what's going on.
>
> The 'convention' of indicating required fields with a * goes back at least
> to the early 2000s when I started building web things professionally. As
> far as I am aware all screen readers announce the asterisk (*) as 'Star'
> when in a page in English, but best to include it in the <label> element
> though. And it's also a good idea to have a message at the top of the form
> that reads "Required data is marked with *" or similar.
>
> Lately, probably as a result of the onset of greater scrutiny around
> privacy, online forms are asking only for the data they really need. So the
> tendency is much more that most input fields are required. So the reverse
> approach of saying "All data fields are required, unless indicated." at the
> top of the form seems much more common now.
>
> Using the 'required' attribute does mean that screen readers announce the
> field as required. However, I'm not a big fan of the default error messages
> generated by browsers. In Firefox the "Please fill out this field" message
> (and screen reader announcement) is just not specific enough - especially
> if there are multiple required fields that have not been completed.
>
> So I favour the use of aria-required="true" on the inputs, and some more
> robust client-side validation that generates more meaningful error
> messages, and also adds aria-invalid="true" to the input element if errors
> are detected.
>
> The challenge comes around radio button groups where the error might be
> that the user hasn't selected one of the options, rather than the
> individual options themselves. Is aria-required appropriate there I wonder?
> Maybe a required message in the <legend>?
>
>
> Regards
> Graham Armfield
> coolfields.co.uk <http://www.coolfields.co.uk/>;
> M:07905 590026
> T: 01483 856613
> @coolfields <https://twitter.com/coolfields>
> > > > >