This looks nice
The main areas you could improve this are in terms of form accessibility like
- programmatically linking the error message to its input. The best way to do that is wrapping the hidden error in an element with an aria-live attribute and unique ID, and using aria-desciribedby on the input pointing to that ID
- wrapping the thank you in an aria-live div
- making sure focus moves to the thank you. I'd probably use tabindex -1 on the heading and move focus there on successful submit (and a similar approach on dismiss/reset)
Steps like this really helps assistive technology users
Marked as helpful
1
Josh• 1,070
@josh76543210
Posted
Thank you @grace-snow for the feedback. Much appreciated!
0
