error-handling-recovery_skill

Overview

This skill teaches how to design error states and recovery workflows that guide users to resolution. It focuses on clear, context-aware error messages, graceful degradation, and accessible recovery patterns for validation, network, permission, and system errors. The goal is to turn inevitable failures into helpful, actionable moments for users.

How this skill works

The skill inspects error types and maps each to a clear message anatomy: what happened, why, what to do, and where to get help. It prescribes placement, language, visual cues, accessibility attributes, and recovery UI patterns (inline, modal, progressive). It also includes CSS/HTML snippets and workflows for retries, offline continuation, and error IDs for support.

When to use it

• Form validation failures (email, password, required fields)
• Network interruptions and request failures
• Permission and access-denied scenarios
• System or unexpected server errors with error IDs
• 404 or missing-resource flows

Best practices

• Never blame the user; use friendly, human language
• Be specific: explain the exact problem and how to fix it
• Place errors next to the related input or element
• Offer actionable recovery: retry, continue offline, request access, or alternate flows
• Use visual indicators plus text and icons; avoid relying on color only
• Announce errors for screen readers and include aria attributes

Example use cases

• Validation: show field-specific guidance on blur and suggested corrections
• Network: display a connection-lost state, save changes locally, offer Retry and Continue Offline
• Permission: explain reason, suggest who to contact, provide a Request Access button
• System: show an apology, Error ID, Try Again and Contact Support options
• 404: show search, home/help links, and suggestions for alternatives