Yesterday evening I sat down to buy my cousin a birthday present from ToysRUs.com. I had bookmarked the item a few weeks ago, and assumed my advanced planning would lead to a quick, painless transaction. However, when I selected my bookmark, it took me directly to the site’s homepage. Frustrated, I tried again. Same result. Was this how Toys ‘R’ Us, #39 in the Internet Retailer’s Top 500, dealt with “Page Not Found” errors?

Many times the 404 page is an afterthought for companies building stores online. Some don’t consider it at all, content to leave the default 404 page provided to them. Disregarding this part of your site can be a big mistake. To your customers, this is a brick wall, and if you don’t offer helpful options, they’re likely to leave your store for a less frustrating experience elsewhere. We’ve put together 23 examples of well-done 404 pages, along with some bad examples to show you what NOT to do. With a little bit of tweaking, a 404 page demonstrate how helpful and customer-oriented your company is, instead of driving them away. Click on the thumbnails to see full versions of all of the examples.

Essential Elements of a Great 404 Page

Your 404 page, like the rest of your site, should be a reflection of your company. Default 404 screens are confusing and offer nothing to a customer in need of help. Design a 404 page with the following elements:

It can also be helpful to incorporate your site’s navigation into the 404 page, as well as a call-to-action button like the one that Wal-Mart employs below. Remember that the goal here is to get the customers back into your store without extra hassle. Your focus should be making this page as straightforward and helpful as possible.

Also consider providing a specific 404 page for missing product pages, letting the customer know that a bookmark is out of date or that you’ve stopped carrying a product. This encourages them to search for the product or a variation instead of leaving your store.

What to Avoid in Your 404 Page

Don’t Redirect with No Explanation

Redirecting your customers immediately to the homepage may seem like it’s helping, but it leaves them confused and frustrated when they don’t know what’s wrong. If you want to redirect to your homepage, make sure to have a 404 notification before redirecting. Netflix, below, informs the customer that there was a problem before redirecting, instead of leaving the customer wondering if they’ve done something wrong.

Don’t Lie About Why a Customer Can’t Find a Page

Most 404 pages at least admit that there was a problem. Sephora, below, claims that their site is undergoing maintenance when faced with a missing page. This approach doesn’t help anyone… your customer walks away either annoyed or disgusted at the lie, and you lose sales when a customer repeatedly visits only to find you’re still “under-going maintenance.” Be upfront and outline the problem so that the customer can fix it.

Don’t Overwhelm Your Customer with Too Many Options

It’s good to give your customer navigation options on a 404 page, but there is such a thing as too many options. 404 pages, like the one from Drugstore.com, overwhelm the customer and only add to missing page confusion.

Don’t Focus on the Negative

Remember, you’re trying to get the customer past the mistake. Dwelling on it, like the Zappos 404 below, offers no help to the customer at all, instead focusing on the fact that something went wrong, leaving your customers with a bad taste in their mouths.

Below are twenty more great 404 pages. Check them out, and see where you can improve your site’s “Page Not Found” experience, and turn your dead end into a simple speed bump.

AbeBooks

Abercrombie & Fitch

Best Buy

Buy.com

CD Baby

CDW

Crutchfield

Dell

eToys

Gap

Home Depot

Macy’s

NewEgg.com

Nordstrom

Overstock.com

Petsmart

Shopping.com

Target

Threadless

Williams-Sonoma

Click on the thumbnails to see full versions of each. Have any examples of nicely done (or poorly done) 404 pages on major retailers’ sites? Leave a link in the comments.