Crafting effective error messages (cute is not enough!)

I encountered this 404 page after following a link in a blog post (only a day old). Either the referring URL was wrong or the backend (not WordPress, apparently) didn’t have the information on the new URL in its database.

It’s not clear when looking at the two URLs which might have been the culprit:

• Link that did not work:  http://seattletimes.nwsource.com/html/politics/2026290113_huffbriefxml.html?syndication=rss
• Link to actual story: http://www.seattletimes.com/seattle-news/politics/king-county-elections-director-wont-seek-re-election/

My initial reaction was a big smile. I appreciated the local humor.

But upon reflection, I realized that the page wasn’t helpful.

I couldn’t find the story I was looking for by shortening the URL “back” to the word “politics” as a way to get to stories about politics.

• This tactic was not successful: http://seattletimes.nwsource.com/html/politics/

And there is no “politics” bucket in the main navigation.

I didn’t see a search box. Only now, while reflecting on the screen capture, do I see the magnifying glass (metaphor for search). But it’s to the right of the login/subscribe links … my brain does not put “search” in the same functional bucket as login.

Plus, when looking for a way to search, I look for a search box (something to type in).

So I went back to the Seattle Times home page, where I finally saw the magnifying glass icon.

How might the 404 page be more helpful?

• Provide a more detailed content outline on the 404 error page
• Provide redirects from “for the backend” URLs to “how people see the site” pages. Any URL that suggests it is a content bucket (“politics”) should “work”
• Provide 404 error pages customized to the directory where the error occurred

***

Related to Jakob’s 10 heurestics. Cross-posted from UX Notes.