When Things Go Wrong, Keep It Human
Most platforms show generic error messages that make you feel stupid. We use jobsite metaphors to turn frustrating moments into something relatable—and actually helpful.
Why Jobsite-Themed Error Pages?
Turning technical failures into human moments
🤝 Respectful Communication
Errors are frustrating. But treating users like they're dumb makes it worse. We use language tradespeople already know instead of condescending tech-speak.
😄 Reduce Frustration with Humor
"404 Not Found" is clinical and unhelpful. "Lost in the Toolbox" makes you smile and immediately understand what happened—it's missing, like that specific part you need.
🎯 Actually Helpful
Each error page provides clear next steps, suggests alternative pages, and offers easy ways to get help. The humor doesn't replace functionality—it enhances it.
🏗️ Brand Consistency
The jobsite theme runs throughout SideJob—from circuit breaker settings to LOTO permissions to error pages. It's not decoration; it's how we communicate.
🏗️ dignity.ink Principle: Technology should respect human dignity, even (especially) when things go wrong. These error pages treat users like the professionals they are—with humor, respect, and actual help.
All Error Pages
Error Free For
Thrown a Monkey Wrench in the Works
Bad Request - Like trying to thread a 3/4" fitting on a 1/2" pipe
Error Free For
No Badge Displayed!
Unauthorized - Can't access the jobsite without proper ID
Error Free For
Unauthorized Jobsite Access
Forbidden - Your badge doesn't grant access to this area
Error Free For
Lost in the Toolbox
Not Found - That part you need 1 minute after the supply house closes
Error Free For
OSHA Violation!
Method Not Allowed - That's not the approved method for this operation
Error Free For
Not to Spec
Not Acceptable - What you're asking for doesn't meet our specifications
Error Free For
Waiting for Materials
Request Timeout - The delivery truck never showed up
Error Free For
Tool Busted
Internal Server Error - Something broke on our end
Error Free For
Apprentice Doesn't Know What to Do
Not Implemented - We haven't learned how to do that yet
Error Free For
Subcontractor No-Show
Bad Gateway - Upstream service didn't show up or sent back garbage
Error Free For
Waiting on Approval...
Gateway Timeout - Still waiting for the inspector to show up
Consistent Design
Every error page uses the same layout, navigation, and helpful features—just different jobsite scenarios
Technical Details Available
For the nerds who want them, technical HTTP details are available in a collapsible section
Navigation Help
Every page suggests relevant alternatives and provides easy ways to get back on track
Implementation Notes
How we built these
Reusable Component
All error pages use a single ErrorPage.astro component with props for customization. This ensures consistency and makes maintenance easy.
Astro Static Pages
Each HTTP status code gets its own page (e.g., /404.astro). Astro serves these automatically when errors occur.
Mobile-First Design
Error pages are fully responsive and work great on mobile devices—where users might hit them while looking for info on a jobsite.
Accessibility Considered
Proper heading hierarchy, semantic HTML, good color contrast, and keyboard navigation support throughout.
Want to See More Design Details?
Check out our other jobsite-themed UI patterns