404 Not Found Pages: The Good, The Bad & The Funny

When a customer lands on a 404 Not Found page, he or she is caught off guard – confused at best and downright frustrated and ready to shop somewhere else at worst. A 404 page is a customer service touchpoint. It’s an opportunity to be helpful, show a business’ personality and even merchandise. Do you treat your 404 page like a landing page?

When checking out how top online retailers do 404 pages, I found many simply redirect users to the home page, which is a perfectly fine way of handling things. For those of you who do use 404 Not Found pages, here are some examples from fellow retailers — the good, the bad and the funny.

404 Page Examples and Tips

1. Have a page

If you don’t automatically redirect, there’s nothing worse than landing people on a generic screen like this:

Generic Error Page

When you remove all navigation it’s like teleporting a customer out of your store and dropping them into the parking lot blindfolded. This happened on many top retailer sites I tested. What a shame.

2. Don’t blame the user first

I saw lots of cold messages like this that seem to blame the user for typing in the wrong URL. But 404 messages rarely come from type-in errors, they’re usually broken links from external sites or the site itself because the root URL must match the actual URL. Customers rarely type in deep link URLs manually.

Target Error

Gap’s approach is to assume its own fault first, a humbler approach:

Gap Error

But WetSeal goes a bit too far with “we’re working on this page.” Don’t imply your site is unfinished, it’s not professional. And don’t expect customers to try again later – like when, 3 months from now?

Wetseal Error

eToys also leads with “you probably screwed up” (paraphrase), and adds if it was a broken link it was “probably from another site ‘cuz we never mess up” (again, paraphrase).

eToys Error

3. Keep it short and sweet

Boden is known for being a personable company, but its 404 page reads like a novel.

4. Add a search box

Golfsmith uses a search box as a call to action to encourage customers to keep shopping on the site and find what they were originally looking for.

golfsmith error

But instructions on how to search like “enter a few words into the box” is unnecessary.

5. Remove calls-to-action that don’t make sense

Zappos is king of customer service, but a customer probably doesn’t want to submit a video testimonial for finding a broken link.

Zappos error

I’m surprised Zappos, as helpful as they are, doesn’t chime in with a live help prompt.

6. Think like a customer

If you mention customer service, make sure you link to the customer service page. Don’t make customers have to search it out themselves.

Circuit Error

List your hours of customer service (telephone) or an estimated email response time so customers can judge whether it’s worth it to contact you or not.

7. Merchandise

Bravo to Busted Tees for showing product on the 404 page, and linking to the catalog. If a link was from an external site (in other words, the customer may not be familiar with the product offering) this can be a compelling reason to stick around and check out the merch.

Busted Tees Error

8. Be funny

I knew Urban Outfitters would do something edgy, but don’t do this unless it’s consistent with your brand’s culture and target market’s expectations of you.

Urban Error

9. Provide multiple links back into the site

Northern Tool combines humor and usability, offering the most logical actions as links – go back one step, start from scratch, browse categories or talk to someone.

Northern tool error

10. Use product finders

I Want One of Those combines humor with search and a useful product finder.

iwoot error

11. Don’t yell or try to sound smart

This is funny, but not because Burberry has a sense of humor – rather it’s yelling big fancy words!

Burberry error

Going the Extra Mile

If something’s broken on your site, why not reward your customers for giving you a heads up? We’re busy people, and may not bother to contact customer service to let you know but an incentive could help you fix a problem that may be costing you far more than $5 in lost revenue. Plus, you could turn a comparison shopper into a buyer – now that person will hunt for something to buy to use the discount or at least visit you at a later date. If you sell higher ticket items, consider sending a higher value gift card to make it worth it.

And do thank people when they take the time to alert you of broken links. I do this often and haven’t been thanked, not that I expect thanks, but an acknowledgment that a link has been fixed, at the very least, would let me know my voice was heard.

Most Creative 404 Pages

This is one of the coolest “Results Not Found” page I’ve ever seen. You really have to see it to believe it – it has an interactive, microsite feel.

Bluedaniel Results Not Found

http://www.bluedaniel.com/404.shtml

Smashing Magazine has also collected some entertaining 404 pages worth checking out.


Related Articles

26 Responses to “404 Not Found Pages: The Good, The Bad & The Funny”

  1. M says:

    brilliant! i was just in the midst of writing such a post. partially, it’s because i get unusually pissed off when a website say i MIGHT have typed it wrong. even if i did, i’m the prospect, don’t point your grubby 404 fingers at me because i’ll leave.

    “I DIDNT FRIGGING ENTER IT WRONGLY!”

  2. Yeah, it’s like saying “we sent you a damaged product, you probably knocked it around a bit before opening it” or “the postman probably dropped it a few times before it got to you” :)

  3. Michael Feiner says:

    Great post. Have a look at the New Yorker 404 page – it really captures the essence of the brand while still including some of the features you mentioned in this post

    Thanks,
    Michael

  4. @Michael, that’s awesome!

    Check it out, it’s very clever:
    http://www.newyorker.com/foo

  5. Did you see any examples of auto sniffing for appropriate pages or products? i.e. if my entered or linked url was similar to one that actually did exist, they made a recommendation for the similar one.

  6. I did see some auto-correct, for example Moosejaw – if you navigate to a product page and start messin’ with the URL to break it in the browser bar, it just refreshes the product page. I saw lots of sites doing this, they could match the URL even if you buggered up some characters in the product ID, but it could be that it figured since I was already on that page that that was what I was looking for.

    I tried pasting a buggered-up URL into a new browser for Moosejaw and I hit their “sold out” page which is also funny. I think I’ll append this post to include it:
    http://www.moosejaw.com/moosejaw/product.asp?path=Search&path=Womens+Jackets&search_handle=A%3dWomens+Jackets%7eB%3dWomens+Jackets%7eD%3d36%7eE%3d1%5e1%5e2%5enum_Sort1%7eK%3d4%7eL%3d1%7eM%3d15%7e&scid=SearchResults&pf_id=1799&spoffset=2&s_id=0

  7. Linda, great article, thank you!

  8. A good book to handle all these things is ‘defective design for the web’ by 37 signals

    our own 404 error page, should get good marks here:

    http://www.bibleBible.com/ghkhhhkh

  9. suttonhoo says:

    great post. was disappointed to see my all time favorite didn’t make the cut (probably because del.icio.us is not ecommerce) — http://tinyurl.com/4vmqmf — and apple.com also does a lovely job with their 404 — http://www.apple.com/404

  10. @Suttonhoo

    Thanks for adding to the list! Del.icio.us is funny :) Also Apple’s is good in terms of design/layout and aiding in navigation. The goal is to keep the user on the site and to help guide them to what they are looking for.

    I forgot to mention that something Sitebrand’s keyword referral recognition feature could do is dynamically create a landing page that brings up suggestions if the searcher came through a search engine. For example “green widget holder” would display a message saying

    “We’re sorry, this particular page has moved or is no longer available. Were you looking for green widget holders? Just click “search” below to see related items we have in stock:

    ___________(prefill the search box with the term) [GO]

  11. neofob says:

    I like the 404 page on the official Sisters Of Mercy page: http://www.thesistersofmercy.com/error404page.html

  12. Wow, that one’s certainly different… :-O

  13. Roxana says:

    For Romanian speakers, this 404 page is really funny: http://www.pixelrage.ro/404

  14. I like The New Yorker’s 404 page.

    Great post, Linda! (Wow, you’re on a roll, lately!)

  15. Good article, Vanessa. It’s do as I say, not as I doogle :)

  16. @Linda *Groan* You are usually MUCH better with your puns.

  17. Does that mean you’re going to do a music video for “Achy Breaky Cart” now? Sam Decker can make a cameo.

  18. “Lost”… very inovativ! :)
    I think the best solution is Nr. 9

  19. Very good way to increase the customer satisfaction on the 404 pages could be including the sitemap of website.

  20. Any thoughts on how “cool” and “creative” do in terms of usability? For a site focusing on product sales, is a page like the last one you showed, worthwhile? (Other than perhaps getting you some inbound links, which would be nice.) I think #7 (product photos/links) is the best tip for retail sites.

  21. John Mountain says:

    I like it when the 404 page reflects the personality of the site, like the one for MagicTricks.com. Try http://magicshop.magictricks.com/badpage.htm to see what I mean. Very effective!

  22. Hi Linda,

    After reading this article, we decided to re design our own 404 page with our own spin on it to try and convert these lost shoppers. What do you think?

    http://www.boystomengifts.com/404errorpage

    Regards
    Simon

    • Hi Simon, that looks great. The promo code is motivational if they’ve landed for the first time on your site on a broken page (to use a pun, it’s “redeeming”) LOL. One thing you might want to do is link your logo back to your home page. Many will try to click on that as it’s a convention to link the logo from every page back home.

  23. Tropp says:

    Love Boden’s, keeping it short and sweet.

Leave a Reply

© 2014 Get Elastic Ecommerce Blog. All rights reserved. Site Admin · Entries RSS · Comments RSS