Error Identification
When a form submission produces an input error, the error is identified in text and the specific field it relates to is described.
Why it matters
A red border alone communicates nothing to a screen reader user or someone who is colour-blind. Without text identifying which field failed and why, they're left resubmitting a form blind.
Detected by Openwell's judgement pass
axe-core can confirm an aria-invalid or aria-describedby association exists on a field. Whether an error is actually announced and textually identifies the problem requires exercising the form and reading the resulting state — Openwell's judgement pass, not a static rule.
Fails
<input class="error-border" name="email">
<!-- red border via CSS only, no text, no aria-invalid -->Only a visual color change indicates a problem — nothing is exposed to assistive technology and nothing tells the user what's wrong.
Passes
<input name="email" aria-invalid="true" aria-describedby="email-error">
<p id="email-error" role="alert">Enter a valid email address.</p>aria-invalid and aria-describedby programmatically link the field to a text error message, announced via role="alert".
Openwell finds violations like this one across your whole site, clusters them by the component that caused them, and generates a fix that's re-validated before you see it.
Scan your site free