Error summary

Recipe 9.4 Highlight erroneous fields

Sample:

Code:

<div role="region" aria-labelledby="error_heading" tabindex="0">
  <h2 id="error_heading">2 issues found</h2>

  <ul>
    <li><a href="#email">Please enter a valid e-mail address</a></li>
    <li><a href="#password">Passwords must contain at least one number</a></li>
  </ul>
</div>

<form>
  <p>
    <label for="email">Your e-mail address</label>
    <input type="email" id="email" required aria-invalid="true" value="kubidus21@">
  </p>
  
  <p>
    <label for="password">Password</label>
    <input type="password" id="password" required aria-invalid="true">
  </p>
</form>