Error summary

A focusable digest of everything wrong with a submitted form.

There's a problem with your application

Enter the business name
Enter the rabies certificate number

Show the markup

<div class="cc-error-summary" role="alert" tabindex="-1">
  <h2>There's a problem with your application</h2>
  <ul>
    <li><a href="#ex-tf-err">Enter the business name</a></li>
    <li><a href="#ex-val">Enter the rabies certificate number</a></li>
  </ul>
</div>

Accessibility

Move focus to the container (tabindex="-1") after a failed submit. Use role="alert" only when the summary is injected after load and focus is not moved — doing both makes many screen readers announce it twice.
On failed submit, render this above the form and move focus to it (tabindex="-1" + .focus()).
Each item links to the failing field; each field repeats its own validation message.
This is the GOV.UK-proven pattern — the single biggest usability win on long civic forms.