WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Required and/or aria-required in Form Controls

for

From: Stella M
Date: Jul 9, 2015 7:09AM

> You can use aria-required if you only want to indicate required state to the Accessibility API but don't want to use browser native input validation.

> Use HTML5's required attribute to indicate state and also use the browser validation e.g. <input type=email> makes the user type something that looks like an email to be valid.

> You can use both if you're trying to cover for some UA/AT bug that won't read one or the other. No screen reader will speak required twice when using both attributes.

> Don't use hidden text for screen readers only unless that's the only possible way to indicate something to the AT. Just make it visible <label>First Name (required)</label>


Thanks Paul for your feedback. So all four options are possible to recommend to a client, depending on their website and what would be the easiest way for them to implement.

> Just on the topic of native validation on the part of the browser: if
> or some reason you want to suppress native validation (for instance, if
> a form offers both a "Submit" and a "Save for later..." button, and with
> the latter you'd expect some required etc. fields not to be filled in
> yet) you can use the novalidate (on the <form>) and/or formnovalidate
> (on the submit <input>) attributes
> http://www.w3.org/TR/html5/forms.html#attr-fs-novalidate

Thanks Patrick, A good method to keep in mind when reviewing designs to give a hint to developers before they start messing around:)

Thanks,

Stella