Quando utilizzare l'attributo richiesto vs l'attributo aria-required per gli elementi di input?

Question

Sto provando a rendere accessibile un modulo. Devo fare in modo che i miei input abbiano entrambi gli attributi required e aria-required o uno solo?

<label for="textbox1">Input</label> 
<input id="textbox1" type="text" name="Text Box" required> 

O come questo?

<label for="textbox1">Input</label> 
<input id="textbox1" type="text" name="Text Box" aria-required="true"> 

O come questo?

<label for="textbox1">Input</label> 
<input id="textbox1" type="text" name="Text Box" aria-required="true" required> 

L'articolo Accessible HTML5 Forms – Required Inputs rivendicazioni è meglio implementare entrambi.

Answer 1

Quando John Foliot ha scritto quell'articolo nel 2012 era molto vero. Avevi bisogno di entrambi.

Oggi non è più così. Posso prendere il vostro esempio, metterlo in a CodePen, e controllarlo in JAWS e NVDA (sorry, no VoiceOver oggi):

<label for="textbox1">Input</label> 
<input id="textbox1" type="text" name="Text Box" required> 

sarete felici di sapere che sia NVDA e JAWS annunciano il campo come richiesto.

In breve, è non necessario più aria-required. Basta usare required.

Si può leggere un po 'di più sul ARIA attributi si può scaricare in questo articolo da Steve Faulkner (uno dei redattori della specifica ARIA) dal 2015: http://html5doctor.com/on-html-belts-and-aria-braces/

Answer 2

HTML5 ha ora l'attributo richiesto, ma aria-richiesta è ancora utile per i programmi utente che non supportano ancora HTML5.

Rif: Using the aria required attribute post on MDN