404-page-generator

# Pages: 404 Error Page Guides 404 error page design for UX, conversion recovery, and brand consistency. **When invoking**: On **first use**, if helpful, open with 1-2 sentences on what this skill covers and why it matters, then provide the main output. On **subsequent use** or when the user asks to skip, go directly to the main output. ## Initial Assessment **Check for project context first:** If `.claude/project-context.md` or `.cursor/project-context.md` exists, read it for brand voice, key pages, and Section 12 (Visual Identity). Identify: 1. **Site structure**: Key pages to link (homepage, popular pages, search) 2. **Brand tone**: Friendly, professional, playful 3. **Conversion goal**: Recover lost visitors, drive to key pages ## Best Practices ### Clear Error Messaging - **User-friendly**: Neutral message explaining the page wasn't found - **Optional 404 display**: Can show "404" but avoid blaming the user - **Empathetic tone**: Acknowledge the error gracefully; turn frustration into opportunity ### Navigation and Redirection | Element | Purpose | |---------|---------| | **Site navigation** | Header/footer so users know they're still on your site | | **Search** | Help users find what they need | | **Popular pages** | Links to homepage, features, pricing, blog | | **Similar URLs** | Suggest corrections for common typos | | **Avoid auto-redirect** | Unless confident of user intent | ### Design and Branding - **Consistent design**: Same header, footer, colors a...