问题
I'm trying to make a form accessible. Should I make my inputs have both required and aria-required attributes, or just one?
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" required>
Or like this?
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" aria-required="true">
Or like this?
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" aria-required="true" required>
The article Accessible HTML5 Forms – Required Inputs claims it is best to implement both.
回答1:
When John Foliot wrote that article in 2012 it was very much true. You needed both.
Today that is no longer the case. I can take your example, put it in a CodePen, and check it in JAWS and NVDA (sorry, no VoiceOver today):
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" required>
You will be happy to know that both NVDA and JAWS announce the field as required.
In short, you do not need aria-required any longer. Just use required.
You can read a bit more about the ARIA attributes you can dump in this article by Steve Faulkner (one of the editors of the ARIA spec) from 2015: http://html5doctor.com/on-html-belts-and-aria-braces/
回答2:
HTML5 now has the required attribute, but aria-required is still useful for user agents that do not yet support HTML5.
Ref: Using the aria required attribute post on MDN
来源：https://stackoverflow.com/questions/37974796/when-to-use-the-required-attribute-vs-the-aria-required-attribute-for-input-elem