Accessibility: Form validation alerts not readable by screen reader

[Lizzam]

For Hubspot forms that we're using, the validation errors are not being read by screen readers. 

When inspecting the errors, it seems that the HTML code used is not allowing the alert to be read properly.

Below are the suggestions to allow the error messages to be accessible even when it's an inline messages.

• Removing role=alert from the error messages.
• Changing the error messages to be contained in an inline element like SPAN
• adding unique ID to the alert messages.
• The error messages and the fields are connected using Aria-Labelledby.

[AEaster]

I also would really love to see HubSpot form error messages made screen reader accessible!!

One thing to note, since there is already a label, it would be best practice to use `aria-describedby` instead of `aria-labelledby` for associating an error message to it's input element

Furthermore, it would also be incredibly helpful to have a built in option for auto-focusing on the errored form fields on form submit

[KApgar]

This is such an important thing that needs to be done. Thank you for considering!

[PGuinot]

In the same vein, this type of captcha is unusable to validate forms for the visually impaired and blind.

[PGuinot]

For french people i find a great website to test the accessibility WCAG / WEB of your forms : https://la-va11ydette.orange.com/?list=wcag-web&lang=fr

[jstrachan]

Agreed! We conducted a web accessibility audit this year and this was one of our findings. The function should also be updated to read out something more specific than "please complete this required field" to something more descriptive like "please complete the first name field".