Template · reference

Error message component

GOV.UK / Government Digital Service · GOV.UK Design System Free Beginner

This is a ready-made, accessible pattern for error messages with real wording examples you can adapt (it even shows the phrasing to use for common cases). Because it is a component spec, it also covers the markup so your errors are announced to screen readers. Use it as a template rather than inventing error styling from scratch.

  • Start the error with what the user must do to fix it
  • Keep error wording consistent with the question or field
  • Errors must be reachable by keyboard and screen readers

The question it answers

  1. How do I write clear button and error messages so users know exactly what to do next?

Read with it

  1. This is the book most working UX writers point to when they need a system, not just tips, for the exact text on buttons,... O'Reilly Media Book Strategic Writing for UX (2nd Edition) Torrey Podmajersky
  2. Nielsen Norman Group is the closest thing to a standard reference in usability, and this piece is a clean, specific checklist... Nielsen Norman Group Article Error-Message Guidelines Tim Neusesser and Evan Sunwall (Nielsen Norman Group)
  3. This is the reference everyone quietly copies when they first try to write down their brand voice, and it is public, free, and... Mailchimp Content Style Guide Article Voice and Tone, Mailchimp Content Style Guide Mailchimp
  4. If you are a founder or designer writing your own product copy without a UX writer on the team, this is the most practical... Smashing Magazine Article · About a 20 minute read How To Improve Your Microcopy: UX Writing Tips For Non-UX Writers Irina Silyanova
  5. Concrete rules for writing the words on your buttons and menus so nobody has to decode them. It covers using a verb plus a noun... Nielsen Norman Group Article · ~9 min read UI Copy: UX Guidelines for Command Names and Keyboard Shortcuts Anna Kaley
  6. This is the single most practical book written entirely about the tiny words in your product (buttons, error messages, empty... microcopybook.com (Nemala) Book · ~350 pages Microcopy: The Complete Guide Kinneret Yifrah
eChai Partner Brands The partnership →