Error notification pattern

[cehfisher]

Issue

Beyond the normal notification alert pattern, make an error notification pattern.

Example

When errors can be detected programmatically, provide clear informative messages that succinctly tell the user where the error is and suggestions, tips or instructions on how to correct it. Ensure it is easy for the user to return to the input/control that needs correcting, and other content.

For example, on a form submission, a list of all fields needing correction could be added to an aria-live area above the form, with aria-invalid and inline visual cues to provide guidance. Be careful to avoid a keyboard trap and use ARIA or standard operating system notifications for users of assistive technology, such as screen readers.

https://designsystem.digital.gov/components/alerts/