Any time you click on a link or type a URL into the address bar, you make a request to a remote server. You are essentially asking a distant computer to look around in its files for a particular page and then show it to you if the computer happens to have that file on hand.
What Is a 404 Redirect?
If you follow a broken link, you’re asking the other computer for a page that isn’t in their files., which results in a 404 error. This could be because they never had it, they used to have it but it’s been deleted or renamed, or simply because you misspelled the URL. When 404 errors occur, you will usually be redirected to a generic 404 page, the website’s homepage, or a customized 404 page.
Why Is a 404 Page Important?
The main benefit of a 404 page is to notify the user that:
- Something went wrong, and
- Offer potential remedies.
If a user follows an old link to your site and encounters a generic 404 message, their first impression will be that your site is either very low-quality or nonexistent. These generic messages don’t convey a sense that the creator cared about the site and the user experience. Users tend to bounce away from these pages rather quickly because they can tell that the site isn’t working the way they hoped. Consequently, broken links and generic no-effort 404 messages can drive valuable traffic away from your site.
On the other hand, if you can create a custom 404 page that is useful to the end-user and consistent with your website’s overall style — you can hold onto new viewers a little longer. Once a user sees the site is running and well-crafted, it signals that while the particular page they were expecting isn’t working, the site is up to date and may still hold some value for them by providing a search function or a list of popular pages.
404 Redirects and SEO
By designing a clever and useful 404 redirect page, you’ll ensure that your users stick around on the site for a longer period of time, perhaps finding the page they were looking for and engaging with it further. The reduced bounce rate and increased session times do not go unnoticed by search engine algorithms, which means that a well-made 404 redirect can work wonders for your site’s SEO.
Benefits of Custom 404 Pages
A custom 404 page makes the web surfing process more intuitive by eliminating the confusion that users experience when their expected page doesn’t load. Instead of an error occurring and dropping the user off on a nondescript, uninformative error page, the user knows they have reached the correct site but that an old link or a misspelling has landed them on the wrong page. With built-in search functionality or suggested links, you can make the 404 page even more helpful, getting users to the page they were hoping for whenever possible.
Best Practices for Custom 404 Pages
Here are a few tips for taking your 404 pages from a simple error message to an engaging piece of content in its own right.
Make It Casual and Fun
From the user’s point of view, the generic “file not found” 404 message usually comes out of nowhere to interrupt what they’re doing. The abrupt and bothersome message seemingly appears and disrupts the flow of the session, not just in terms of intent but in terms of design as well. Here they are, trying to find something cool, but suddenly, an ugly technical page comes out of nowhere to tell them the thing they want doesn’t exist.
For that reason, it’s often a better idea to lighten the mood with a message that either makes the reader chuckle or — at the very least — something accessible that describes the problem in casual, friendly language.
Include Suggested Links
Provide a list of your most popular links on the 404 page. This allows users to see the useful resources you have available on the site while enticing them to stick around for more.
Include Search Functionality
Include a search bar on your custom 404 page to equip your users with another tool to help them find what they’re looking for. Perhaps they landed on the 404 page because of a misspelling or an old link to an existing page. If that’s the case, a quick search of the terms they were looking for could be the quickest route to finding them.
Don’t Make the User Feel Stupid
Too many 404 pages convey their message with the subtlety and bedside manner of a sledgehammer. If your 404 page unironically gives the impression that the user has made a major mistake or that they or their computer are somehow in danger, then you’re doing it wrong. Bombarding the average user with a cold 404 error page full of technical jargon is an intimidating way to begin a conversation, so it’s no wonder that most people find these types of error pages off-putting.
How to Fix 404 Errors
To fix a 404 error that’s losing you traffic, you’ll want to bust out Google Search Console so you can monitor your site and identify when crawl errors and redirects are happening. Google Analytics can also help you keep tabs on just how many 404 errors are occurring on each page, which will allow you to figure out how much of an effect the errors have on your SEO.
Once you know which pages are causing you problems, your best bet for solving them is to create custom 404 redirect pages that fit your branding and offer additional utility to the user. When you have a custom 404 page ready, your next task will be redirecting your errored pages.
How to Redirect a URL to a Custom 404 Page
- Start by gaining access to Google Search Console. This will allow you to review any 404 errors.
- Once logged in to Google Search Console, go to the dashboard and click on “Coverage” in the sidebar on the left-hand side of the screen.
- Under “Details,” click “Error Submitted URLs not found (404).”
- Ignore errors labeled as “soft 404.”
- Click on the “Not Found” tab, and you’ll see a list of URLs causing errors. Copy down these URLs.
Your next steps depend on your CMS. Here, we’ll tackle Shopify and WordPress.
- Log in to Shopify.
- Click “Navigation” on the left side of the Shopify dashboard.
- Click “URL Redirect” on the top center of the Shopify dashboard. This will open a pop-up.
- In the pop-up, paste the URL you obtained from Google Search Console into the “Old URL” field, not including your domain’s URL.
- In the “Redirect” field, paste the link to your custom 404 page, including your domain name in the URL.
- Log in to WordPress.
- Install the “Redirection” plugin and make sure it’s activated.
- Go to “Tools” on the left side of the dashboard and select “Redirection.”
- Scroll down to “Add new redirection.”
- Paste the URL you obtained from Google Search Console into the “Source URL” field.
- Type or paste the URL of your custom 404 page into the “Target URL” field.
- In the “Action” field, select “Redirect to URL.”
- Click the “Add Direction” button.
Take back your lost SEO and user engagement by shoring up your errored pages and creating a more seamless browsing experience on your company’s website.
What was the best custom 404 page you’ve seen, and how did it tie in with the site’s unique voice and brand identity? What clever strategies have you seen for adding utility and engagement to 404 pages? Let us know in the comments!