How to Build a Better 404 Page

Author
Shane Melaugh   9

Updated on June 23, 2020

Update for March, 2020: With the release of Thrive Theme Builder, you now have total control over your 404 pages along with your sidebars, widget areas, footers, and more. Thrive Theme Builder is the first truly drag-and-drop WordPress theme builder on the market and gives you unparalleled design freedom for your entire site. Get inspired by the best 404 pages, and start building yours.

Your "page not found" 404 page is one only a small fraction of your visitors will ever see. It's still a page that can be worth optimizing, though and since it represents an error, it's a great opportunity to help your poor, lost visitors out and re-engage them.

In today's video, you'll get a quick tour through a new option added to all Thrive Themes plus 3 suggestions on how to build a better 404 error page.

More...

Don’t Waste Your 404 Traffic

Unless something on your site is seriously broken, very few visitors will ever see your 404 page. But that doesn’t mean that your 404 page doesn’t matter. On the contrary: when something goes wrong, it’s an opportunity to be exceptional.

Think of it like this: if you sell a product, it should be a rare exception that your customer receives an already damaged or broken product. But when it does happen, it’s an opportunity for you to shine with excellent customer service. It can make all the difference between an angry, disappointed customer and one you’ve just converted to a real fan.

Every hit you get on your 404 page is a (slight) disappointment and represents an opportunity to turn that disappointment into enthusiasm instead of a bounce.

The Basics

There are some important basics that you need to cover on your 404 page. These are the things that we already take care of in every Thrive Theme – you don’t need to do anything to set this up.

Clear Communication

First and foremost, there needs to be clear communication about what just happened. The page should very clearly state that something went wrong and the requested page couldn’t be found. There’s nothing worse than an error followed by confusion.

Navigation & Next Steps

Make it as easy as possible for your visitor to find what they were looking for (or something similar to it). In our themes, there are 3 elements on the 404 page to take care of this:

  1. A large search bar invites the visitor to search the site for existing content on whatever topic they were looking for.
  2. The site’s navigation and footer area are displayed on the 404 page, so that all your most important links are accessible.
  3. Optionally, you can add a sitemap which shows lists with links to your posts, pages and archives.

Advanced 404 Page Optimization

Beyond the basics, there are a few more things you can do to improve your visitor’s experience on this page. Here are the top 3 ways to capitalize on visitors that got lost on your site:

1) Provide Step-by-Step Instructions

A great example of this comes from the Conversion Rate Experts site:

cre-404-example

Instead of leaving your visitors up to their own devices, give them a clear set of steps they can follow to find what they need. This is also a great place to ask visitors to get in touch with you or your support team, to get help finding what they need (this can be the start of a sales process as well).

2) Add an Opt-In Form or Call to Action

If you have one main conversion goal across your entire site, why not also add a call to action or opt-in form to your 404 page? It could net you a few more leads that you would otherwise have missed.

However, what’s very important here is that you don’t just turn your 404 page into a landing page. The basics covered above need to be taken care of first! Driving visitors towards a conversion goal must be a secondary thing on your 404 page.

3) Advertise Your Best Content

Add a list of your most popular blog posts or your most important content. You can use the post list or post grid short codes from our themes to do this. If your visitor can’t find what they were originally looking for, this is a way to keep them interested by showing them some of your best stuff that they can go check out instead.

If you have any thoughts or questions about this latest addition, don’t hesitate to leave a comment below!

Shane

by Shane Melaugh  June 16, 2014

9

Enjoyed this article ?

You might also like:

Leave a Comment

  • Over deliver once again Shane. Your forward thinking has moved your work to the top of my “important” website list. Thanks!

    • Thank you, Miles! I’m glad you like the new feature. Many more awesome features to come. 🙂

  • I love this feature Shane. I was just thinking of asking about it. You beat me to the punch! I can’t wait to see what else you come up with! Thanks!

    • Next week, we’ll introduce the “Thrive Mindreader” plugin, so you can do the same with your customers. 😛

  • I just saw an idea of a 404 page that includes a video of outtakes recorded after someone needs to try again. Kind of humorous and is a chance to see one of the executives of the company on video showing a sense of humor.

  • Hi Shane, where do we find the Sitemap to be able to create a link like you did in the example? (for me ticking the box to show it on the #404 page looks cluttered, so I’d like to do what you’ve done here. Thanks!

  • This is a terrific idea in theory. The problem in reality is that the Rise theme’s default content keeps the number “404” in a huge font. This is unhelpful, because codes like this are scary to non-tech viewers. In fact, on a small screen, the user can’t see anything but the huge “404.” Thrive Themes needs to add an option to make the number “404” appear in a very small font.

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >