If you browse a lot of websites, you have probably come across broken links many times. Most people are familiar with the “404 Not Found” page that usually appears if some content is not where it should be. If you have a website, there is a chance that people may come across such an error as well. In this article, we will explore how you can turn the Not Found page of your site into an opportunity to grab the attention of your visitors and stop them from leaving the site. We will also look at some good practices regarding the page. Of course, we will also share what steps you can take to prevent the page from appearing in the first place.

• What exactly is a 404 Not Found page?
• Should you fix the 404 Not Found error?
• Why should you customize your 404 page?
• Good practices for creating a memorable 404 Not Found page
• How to add a custom 404 Not Found page
• In conclusion

What exactly is a 404 Not Found page?

The name of the page comes from the standard 404 HTTP client response code, which indicates that a particular URL is not recognized. In other words, the web page requested from the server does not exist. There are other reasons to see the page as well, but they are much less common - if a valid API endpoint leads to a resource, which does not exist; if the connection is refused; or if the access is restricted. Although another status code is usually used for the latter, it is sometimes masked as a 404 page to avoid frustrating users.

The 404 error code is popular because it is the most common one on the Internet, and anybody who browses websites has seen it. The term “404 Not Found” was introduced by Tim Berners-Lee, the inventor of the World Wide Web. The status code first appeared in 1993 on the NCSA website when a user tried to reach a page, which had been moved to a different location. After the user reported the bug, the site administrators added a witty message to their 404 page: "We're sorry, but the document you requested is not here. Maybe you should try someplace else."

Should you fix the 404 Not Found error?

While we will discuss how you can turn a missing page into an advantage, 404 is still an error code, so you should do what it takes to track broken links and fix them as soon as possible. As appealing as your Not Found page may be, seeing it too often can discourage visitors from staying on your site. This is why you should take measures to make sure they don’t see the error page. Here are a couple of things you can do:

• Use online tools. You will find several tools that you can use, such as Google Analytics, Search Console, Ahrefs’ Broken Link Checker or SEMrush Site Audit. There are even desktop applications that can browse your site, looking for broken links. Usually, you can choose how many levels deep they should crawl, and whether they should follow external links or not. You can run automatic or on-demand scans.

• Browse your website thoroughly. You know your content better than anybody else, so you should go through it every now and then. Double-check all links, including links that should lead to the exact same page. Only one of the links may be broken, while all the other ones work properly. Sometimes links may be behind a paywall, or in a client account (i.e. automatic tools cannot access them). In such a case, browsing the site manually is the only viable option to find broken links.

Once you know where the broken links are, you can go ahead and fix them or remove them.

Why should you customize your 404 page?

No matter how much you check, there may always be a link that leads to a non-existent page. This is valid especially if you have a large website with lots of pages. The more content you have, the more likely it is for broken links to appear. Content or software updates can also lead to a 404 page. Here is an example – if you accidentally mess up the permalink setting of a WordPress website, the links across the entire website may stop working, causing a 404 error on almost all pages.

This is why you should be prepared - make sure the page people will see if they follow a broken link won’t look generic and won’t stress them. After all, nobody likes seeing errors, especially people with less experience on the web. Some of the reasons to customize the 404 Not Found page on your website are:

• Improve the user experience. Remember how you have felt every time you have stumbled upon a Not Found page instead of the page you were trying to reach. You will probably say “frustrated” or “disappointed”. You can easily avoid making your visitors feel this way by customizing the Not Found page. People who come across the page for one reason or another will certainly appreciate not seeing some default page with no information on it. It doesn’t take much to create a good informational page, and maybe to add a little bit of fun to improve the overall experience of your visitors.

• Increase user engagement. If you customize the Not Found page on your website, you can increase user engagement. This page doesn’t necessarily need to display only a message that a certain resource is not available. You can use it to guide visitors to other parts of your website. Continue reading to find out what content you can include if you want them to interact more with your content.

• Reduce the bounce rate. If people see a generic 404 page that doesn’t really tell them anything, they will most likely get frustrated and leave, especially if this happens more than once. Using a custom page that includes information and feels as a part of your website can guide them what to do or how to find the information they need. As a result, you can keep them on the site and reduce the overall bounce rate.

• Build up a brand image. A custom 404 page can contribute to building up a brand name which people see as reliable. Thinking about small details such as having a user-friendly page with relevant content will make a good impression. This way, you can create a positive brand perception.

Good practices for creating a memorable 404 Not Found page

If users come across a 404 Not Found page on your site, you can easily turn the odds of them leaving by customizing what they will see. Nonetheless, doing that can backfire if you don’t do it the right way. We have collected some of the good practices you can follow:

• Add a clear message. When people click on a link, they expect to reach a specific page or see specific content. If this doesn’t happen, they will probably get frustrated. This is why you should add a clear message about what has happened, why it may have happened, and what the visitor can do. The ambiguous “Page not found” error that usually appears by default without any other information is not helpful to people at all.

• Use the same design as the rest of your website. Visitors should not feel that they have ended up on another website if they don’t see the page they were looking for. The 404 Not Found page should have the same style as the rest of your website – logo, colors, fonts, etc.

• Keep your navigation. When visitors come across the 404 Not Found page on your website, they should still be able to reach other sections of the site if they want to. This is why you should either keep the main navigation on the page (main and/or footer menus) or add several links on the page that can take people to the main sections of the website.

• Don’t redirect visitors automatically to the home page. Although some online resources suggest that you do that to prevent people from seeing an error page, redirecting them to the home page will most likely confuse them. They were trying to reach a particular page, and if they land on the home page instead, they will have no idea why. Instead of telling them what has happened, you will only make them wonder why they don’t see the content they want. As a result, they may simply leave the site. Of course, they should have the means to reach the home page, but only if they want to. If there is no other navigation, you can add a link/button on the Not Found page that leads to the site home page.

• Add a search box. If visitors end up on a 404 Not Found page, they were obviously trying to reach some content on your website. They have probably followed a wrong link in the site navigation or on one of the pages. Adding a search box on the Not Found page will allow them to quickly find what they are looking for in case they can find it on a different page. Even if you already have a search box on the site, the one on the 404 page should be larger and more visible.

• Add a Report option. When somebody comes across an error page, they may want to report it. Adding an easy-to-find Report option will allow them to do that without searching for contact information. Sometimes a 404 error may appear even if a particular page exists and the link to it is formatted properly. In this case, receiving a report from visitors can help you to detect and fix possible issues on the site faster.

• Make sure contact options are listed. Add one or more ways for visitors to reach you if they don’t see the page they were looking for. This way they will feel less frustrated, and they will know that there will be somebody to assist them. This is necessary especially for online stores or websites that offer services, as any visitor who does not reach a particular page and does not receive any assistance is a lost potential customer. To prevent that, you can even add a contact option that is not usually listed on your Contact page. Of course, you should state explicitly that the option in question is not a standard way to reach you and should be used only in case of encountering an issue while browsing your website.

• Suggest popular content. You can add some useful or popular articles or products on the Not Found page. Users may not have reached the content they wanted, but you can offer them something else instead. If they have followed an external link to your site and they see an error page, they may simply leave without visiting any other pages. By displaying some popular articles or products, you can grab their attention, and they may change their mind and give your site a chance.

• Don’t go too far. Contrary to what some people believe, customizing the 404 Not Found page of your website does not necessarily mean making it very funny. While you may have come across various animated images or witty slogans on such pages, most people will not be amused. Of course, this doesn’t mean you shouldn’t add something funny, but don’t go too far. Find the balance between fun and usefulness. You can add a good slogan there instead of an error message, but if possible, make sure that users can find their way around the page to reach the actual content of your site.

How to add a custom 404 Not Found page

If you don’t have much experience building websites, you may wonder how you can add a Not Found page of your own. There are many platforms out there, but since we offer WordPress-oriented services on a LAMP setup (Linux, Apache, MySQL, PHP), we will show you how to change the page if you use WordPress or an HTML/PHP website.

If you use WordPress, the header and the footer of the site will always load unless there is a more serious technical issue, but you may still want to change the default page that appears. There are different ways to do that:

• Use a plugin such as Smart Custom 404 Error Page, Custom 404 Pro or Colorlib 404 Customizer to create a new page or use any existing page as the one that appears when visitors encounter a 404 error code. The advantage of this option is that such plugins usually include templates, so you can create the page you need in no time.

• Use the Block editor to edit the default WordPress 404 page if you use a block theme. Since WordPress 5.0 the Block editor replaced the old classic editor and became the default WordPress editor. Once you log in to the site dashboard, go to Appearance -> Editor, find the 404 page and select to edit it. You can replace any content on that page with your own text and images. An advantage of using this option is that you don’t have to install anything, and you can add widgets or any other content that you can add on any other page of your website.

• Use a page builder. If you use a page builder plugin, you can create a 404 Not Found page through it. In Elementor, for example, go to Home (or click on the Elementor icon on the top left, if you are editing a page) and select the Theme Builder option. There, click on the “404” page to create a custom page. The option is available in the paid version of the plugin.
  
  The process is similar for other builders. With Divi, for instance, go to Theme Builder -> Add New Template -> New -> Build New Template -> 404.

A more general and platform-independent way is to create the page as a separate file. This option is suitable for HTML or custom PHP websites that were not built using a CMS or a PHP framework (since the latter usually allow you to add or replace the page by using a dashboard or by editing the PHP code directly). Once the page is ready, you can add the following piece of code in a file named .htaccess, which should be in the site root directory:

ErrorDocument 404 /path-to-the-file/404.html

This way, the page will be loaded every time a 404 Not Found error should be displayed. Just make sure that you replace the path and the file name above with your newly created file and the exact path to it.

In conclusion

Even if you check your website for errors regularly, every now and then users may come across a 404 Not Found page for one reason or another. Sometimes the reason may even be beyond your control – a link on another website may lead to the wrong location on your own website. In such a case, you should turn the error code to your advantage by customizing the page people will see.

There are different ways to customize the Not Found page, so users can land on a user-friendly page that looks like a part of your site. Adding useful links, navigation, or interesting content (within reasonable limits) will help you to keep these users on your site, boosting the user engagement, and reducing the bounce rate on the site.