January 24, 2018

Why Your Website Needs a Custom 404 Page: Use the 404 Error to Your Advantage

The dreaded 404 error. Does it have to be so dreaded?

It happens all the time:

You try to visit a specific page on a website only to find a message saying “Error 404” or “404 page not found.”

As a website visitor, that’s no big deal—the search simply didn’t fulfil what you were looking for, so you can choose to search for something else that will.

But what happens if the website is yours?

You certainly don’t want people landing on a generic error page on your website, do you?

In this post, you will see great examples of effective custom 404 pages and learn everything there is to know about the benefits of having a custom 404 page. You’ll also learn about how to use your 404 page as a tool to improve your website!

Let’s jump in!

Reasons to have a custom 404 page

If people land on your 404 error page, it's not a big deal: But it better be custom

Some people are under the misconception that they should overlook 404 pages because they are the last place you want your users to end up on your website.

However, not having a custom 404 page can be detrimental to the user experience of your website and reflect poorly on your search rankings.

Your 404 page is your chance to turn a negative situation into a positive one and if you haven’t taken advantage of it already, you should.

Sometimes it can be hard to imagine why someone would ever land on your 404 error page. Even if you think you’ve built your website flawlessly, it’s much more common than you think.

Here are a few examples:

1. People can misspell urls

Consider our website, sweor.com for a moment. A user may want to find our recent Content Tips which can be found at www.sweor.com/contenttips. Instead, they type in 'www.sweor.com/contentips'. That’s an honest mistake that you, as a webmaster, cannot control. But you can control the page they land on if they misspell the url. And if that page keeps them on your website, you can still retain that traffic because they can still find what they need.

2. You may change a page’s url but forget to 301 redirect

A 301 redirect tells Google that a previous url should be “redirected” to a new url moving forward. Say you make a modification to a url on one of your site’s pages and do not perform a 301 redirect (this happens often after a website redesign). Anyone searching for that url or clicking on a previous link to it will land on a 404 page. Make sure what they see when they get there is in your best interest.

3. You deleted old content and now it’s back to haunt you

Well, it doesn’t have to haunt you. It’s common to delete old, irrelevant and/or underperforming content from your website. It can actually help your website perform better if you do so. But what happens if there were links to that content somewhere on the internet and one of those links happened to be the only way a user would find you? If the user clicks on it and finds a generic 404 page, they won’t think you exist. If they find one that gives them access to your site, you have a better chance of retaining this visitor.

So what’s the general benefit of having a custom 404 page vs. a generic one?

A custom 404 page takes away the confusion of not landing on the page they had intended to land on. It lets your user know that there is an error with their request. Perhaps they mistyped the URL, the page is temporarily unavailable, or the page no longer exists. An effective 404 page will recognize the mistake and guide them back to relevant pages of the site.

This provides you with the opportunity to put valuable links in front of your users that would have otherwise been lost with a default HTTP error page. These links could be to your homepage, your FAQ or any other relevant links that will keep them on your website when they could have otherwise left.

In our first example above, someone searching for our Content Tips blog post using the wrong url won’t be too far away from what they’re looking for if they find this:

sweor 404 page

They’re only one click away from our blog and will be able to easily find the post.

Obviously, it’s not quite as perfect as landing on the exact page a user is looking for, but as we mentioned above, that’s just not always possible.

Now imagine this:

You type in a url for a specific page you’d like to visit on a particular website and get the image below:

generic 404 page

What do you do?

Well, the generic 404 page gives us nothing to work with. We don’t really know if the website we thought housed the page even exists, and we obviously have no links on the 404 page to guide us to different pages on the site.

Personally, I would click the back button and search for something else.

An easy hack: Use analytics to improve site performance by tracking 404 traffic

Having a well-designed custom 404 page isn’t good enough.

In fact, the goal of any custom 404 page, in addition to keeping people on your site, should be to give you insights on how you can improve your website’s performance.

You can track hits on your 404 page using tools like Google Analytics, which allows you to check for broken links and the origin of traffic to the page.

Here’s a quick step by step guide using Google Analytics:

STEP 1: Open Google Analytics
STEP 2: Under the “Behavior” tab in the toolbar, click on “Behavior Flow”
google analytics menu

You will see a visual representation of the traffic flow through your site. Your 404 page will not be listed under “Starting Pages” (if it is, then this step by step guide should be the least of your concerns).

STEP 3: When you’re in “Behavior Flow,” find your 404 page
google analytics behavior flow

You should find it among your user interactions listed as “/404”. Hover the mouse over “/404”.

STEP 4: Click and you will see a drop down menu with three options. Click on “Explore traffic through here.”
google analytics interactions

This brings you to a new page that shows how people arrived at your 404 page and where they navigated from there.

STEP 5: Use this data to identify broken links you may not have known about and take action by fixing them.
google analytics broken links

If you find that users are regularly misspelling a url (which leads them to the 404 page), consider simplifying the url and setting up a 301 redirect away from the old url.

You can also determine the effectiveness of your 404 page in retaining traffic. If everyone is leaving, you may want to provide more helpful links or make the page more engaging.

If people do stay on the site after landing on the 404 page, you will be able to see the subsequent pages they visit, which can help you identify what’s working and double down.

For example:

If people tend to go straight from your 404 page to your contact page, consider customizing your 404 page with direct contact information.

[Want to learn more about using insights from your site’s analytics to drive traffic and improve your website? CLICK HERE]

Your 404 page: What to do

Above all else, your 404 page should explain why your users are seeing the unexpected error message and direct them back to helpful links on your website so that you don’t lose visitors.

Be honest about what’s going on and don’t be scared to own the error with some humor and personality to make the situation less frustrating for your users. This will also help them find what they are looking for.

Not only does a custom 404 page point out that something went wrong, it can also make light of the situation by adding your company’s personality or a brand-reinforcing design to the page, further enhancing the user experience.

Examples of great custom 404 pages:

Here are some of the companies that are absolutely owning the 404 error and spinning it to their advantage:

Airbnb:

airbnb 404 page

Airbnb uses a light-hearted animation of a girl dropping her ice cream to distract from the unfortunate situation of landing on a 404 page in addition to a list of helpful links.

GitHub:

github 404 page

GitHub uses humor and pop culture references on their 404 page that is on-brand, and directs users to a search bar to find what they are looking for.

The Atlantic:

the atlantic 404 page

The Atlantic’s 404 page doesn’t use comedy, but it does a great job creating consistency with the rest of the website and includes a relevant graphic to draw you in.

Entrepreneur:

Entrepreneur 404 page

Entrepreneur’s 404 page is neither funny nor especially pretty, but it does a tremendous job predicting what a user may be looking for and makes it easy to click on one of their top resources.

Basecamp:

basecamp 404 page

Another great example of an on-brand, useful 404 page. This one from Basecamp even helps users understand the issues that may have led them to the 404 page in the first place.

NFL.com:

nfl.com 404 page

It doesn’t get much more on-brand than this 404 page from NFL.com. The very relevant page also includes a link straight back to the homepage, along with the navbar for accessibility to all other major pages.

A few additional 404 page recommendations to keep in mind:

  • Make the 404 page design consistent with that of your website. If a user has been there before, they will be more likely to stick around due to the familiarity
  • Make sure the user understands they have found the page in error
  • Use Google’s Webmaster Tools to verify that your 404 page actually returns a 404 error, or ensure the content depth is deep enough to avoid triggering a “Soft 404”.

Your 404 page: What not to do

There are a certain cardinal sins your 404 page should never commit:

1. Don’t use a generic page that fails to link back to your website

We’ve already covered that.

2. Don’t use a random page on your website as your 404 page

Perhaps the biggest faux pas is making  your 404 error be a copy of your home page, contact page, or really any other unexpected page without any explanation. You don’t want to leave your users confused, or worse have them leave your site to find business elsewhere.

Not only that, but redirecting a 404 error to a homepage or similar page on your website can cause major SEO issues.

Here’s why:

If nonexistent pages are redirecting to irrelevant pages on your website, Google starts to associate those pages with 404 errors, which can put you at risk of Google de-indexing one of your website’s major pages.

Google actually wants you to have a custom 404 page, and it indexes these pages just like any other page on your website.

3. Don’t use your 404 page as a crutch

And although it’s important to have a custom 404 page, it’s also important that people aren’t landing on it too often–stay on top of your broken links and eliminate/reduce them as much as possible.

Your 404 error page won’t be harmful for your SEO efforts unless it becomes a crutch for too many links. If it does, your SEO will suffer because Google will recognize the fact that people are failing to find what they need on your website.

The bottom line

As meticulous as you may be with the construction and management of your website, the occasional 404 error is nearly impossible to avoid.

The best plan of action is to use your 404 page to your advantage. Give users access to the pages they may have been looking for, reinforce your brand, and be honest. This can only be done through a custom 404 page.

Finally, be sure to use your 404 page as a tool for the improvement of your website—a security system of sorts. By having a great 404 page, and tracking traffic to it, you can make sure users are finding what they need on your website.

Our resource guides

Win SEO Through Content Marketing with the Tandem Bike Technique

Learn more

Ideal SEO Content Length: Flushing the Goldfish Cliche Down the Toilet

Learn more

"What is Your Most Actionable Content Writing Tip?"

Learn more

13 Mind-Blowing Statistics About Responsive Web Design in 2018: Entering a Mobile-First World

Learn more

The Definitive Web Design Resource Guide: 2018 (updated)

Learn more

16 Actionable SEO Tips You Can Implement Today to Avoid the Most Common SEO Mistakes

Learn more
share this
April 19, 2018

Everything You Need To Know About GDPR And How To Prepare

Read more
March 26, 2018

It’s Official: Google’s Mobile-First Indexing Rollout Starts Today [3.26.18]

Read more
February 21, 2018

7 Actionable Tips To Drive Your Organic Clickthrough Rate Through The Roof

Read more
February 8, 2018

Content Promotion: The Key To Earning Backlinks and Dominating SEO

Read more
February 1, 2018

The Anatomy of Effective Content

Read more
January 12, 2018

Backlinks: What are they and what do they mean for SEO?

Read more

Ready to drive traffic and earn qualified leads?

Request a free, comprehensive digital audit

It will hit your inbox in under 24 hours.

white arrow pointing right
simple dark grey arrow

Keep up with the latest

Get actionable monthly tips on creating an industry leading web presence.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Sweor, LLC

225 S. 6th Street Suite 3900
Minneapolis, MN 55402
612-562-9193
info@sweor.com

Keep up with the latest. Join our email list.

Oops! Something went wrong while submitting the form.
612-562-9193