Error messages should guide the user toward achieving their goal. If something goes wrong, inform the user what they need to do next—briefly, clearly, and without placing blame.

Key Principles:

  • Provide a way forward and maintain a sense of responsibility.

  • Use a concise, verb-first approach, focusing on what the user should do next.

  • Avoid technical jargon and unnecessary detail.

Do

  • Offer a clear next step
  • Take responsibility in a neutral manner
  • Keep instructions verb-first and concise
  • Maintain consistent voice and tone

Don't

  • Assign blame
  • Use technical jargon
  • Write overly detailed messages

Types of Errors

Inline Errors

Inline errors appear directly next to the problematic input field, helping users correct issues as they occur. They are often styled with red text or another attention-drawing color.

Example: “Enter a valid email address”


Detour Errors

Detour errors appear in a modal or pop-up that halts the user’s progress until they resolve the issue. They momentarily redirect the user’s focus, ensuring the problem is addressed before continuing.

Example: “Log in to continue”


Blocking Errors

Blocking errors redirect the user to a separate page or screen, typically when a resource is unavailable or an unexpected situation occurs. These errors may provide navigation options or search tools to help the user find what they need.

Example: “Oops, the page you were looking for could not be found. It may have been moved or deleted. Please use the navigation bar above or search bar below to find what you’re looking for.”