Users encounter the dreaded “error 404 page not found” message when your server can’t find a web page for the URL they entered. It’s an unpleasant experience that immediately impacts their impression of your site.

It isn’t always the designer’s fault — users might have mistyped the URL or found a dead link from elsewhere that leads to a deleted file — but it is their responsibility to discover why it happened and try to fix it. You should audit your site regularly to find any broken links, typos in code, and web server issues that could lead to a 404 error.

This article explains why 404 error codes happen, as well as giving tips on how you can fix them and guidance for future-proofing your designs against this common dead end.

What causes the 404 error?

When a user enters a URL into their web browser, it sends an HTTP request to your web server. The server responds with a three-digit HTTP status code indicating whether it was successful, had to redirect, or couldn’t find the resource. 

A 404 error means the web server couldn’t find anything at that URL, halting the user experience. Below are several reasons why your web server might respond with the 404 HTTP status code.

Mistyped URL

The simplest reason for a 404 error is that the user mistyped the URL. That’s easy to do if they’re trying to navigate directly to a specific page from the browser bar.

For example, web destinations that aren’t a landing page often include a backslash in their address. If users enter a forward slash instead, they get an error, since there’s no page with that name or format. 

Deleted page

Using a similar example, imagine a user who bookmarked a product page and wants to return to it. If that page has since been deleted, their bookmark will now be a broken link because the page no longer exists at that URL.

Broken or moved links

It’s also possible that other sites have outdated or dead links to your site. If an affiliate writes a guide with an external link to the product page mentioned above, but the designer moves that page, the affiliate’s link will no longer work. 

DNS issues

It’s rare, but sometimes your DNS configuration can cause a 404 error for any web page under your domain name. If your DNS settings aren’t correctly pointing HTTP requests to your server, they’ll result in a 404 status code every time.

Corrupted .htaccess file

If you use an .htaccess file to manage access to certain parts of your site, it’s possible to accidentally lock down the wrong web pages. When a user who doesn’t have access tries to navigate to a URL under access restrictions, they’ll get a 404 response code.

Impacts of 404 errors

You want to avoid 404 errors as much as possible and ensure visitors get where they want to go.

Negative impact on user experience

A 404 error always negatively impacts the user’s experience with your site. It’s a dead end, and encountering one will harm the user’s impression, whether or not it was your fault. A custom 404 page can help make the experience less jarring, but it’s still an undesirable error.

Search engines can’t crawl and index your content

When search engine crawlers like the Google Bot encounter a 404 error, they immediately remove the associated URL from their index. If this happens frequently, they may reduce your site’s rankings. Even if you redirect pages, which return a status code in the 300s, crawlers might still dock you for having too many HTTP requests between the user and the URL they want.

How to fix error 404 page not found results

How you can fix a 404 status code depends on the issue that led to it. Some common solutions that’ll help you find and address broken links, deleted files, and configuration errors that lead to a 404 are listed below.

Set up a redirect

One solution is to create a redirect that directs users from a moved or deleted page to a new destination. However, this option becomes unsustainable as your website scales up and your redirect file grows. Consider whether you should move or delete pages in the first place or simply repurpose them.

Find and fix external links

Check the traffic source of users who landed on your 404 error page. If they came from another site, you know that site has broken external links. Contact the website owner directly or set up new redirects for the relevant pages.

Check your DNS settings

To fix a 404 error caused by DNS issues, check your hosting provider settings to ensure you entered the proper name and top-level domain. If not, you might have bought the wrong domain name or made a spelling mistake when configuring your settings.

Check access controls

To handle errors related to access controls, check the .htaccess file. Validate its code to check for errors, then verify that you’re blocking access to the right web pages.

If you’re using a website builder, regularly check for errors to detect any potential issues with your .htaccess file and review your access controls to ensure they’re accurate.

4 best practices for avoiding 404 errors

The best way to handle 404 errors is to prevent them from happening at all. Here are four best practices that’ll help you avoid 404 errors altogether:

1. Perform regular site audits

Use a tool like the Google Search Console to run a complete audit of every web page on your site. It’ll return a list of any dead or broken links, along with their URLs and HTTP status codes. This helps you determine if there are too many redirects on your site and how you can streamline your sitemap.

2. Use a link checker tool

Add a link checker tool to your web-building environment. These check HTML codes for dead and broken links before any content is published. Most development environments come with built-in link checker features, and you can add them to website builders with integrations like LinkNavigator.

3. Add redirects to your publishing workflow

Add a step to your standard operating procedures for deleting or moving a page that directs content creators to set up a redirect at the same time. That way, there’s no moment between them when users could get a 404 error. If a user’s cache is holding on to a broken link, it’ll be sorted once the browser cache refreshes.

4. Design a custom 404 error page

Even though your users won’t spend much time on this page, it’s still a design opportunity. With a custom 404 error page, you can teach users why they reached a 404 status code and how to avoid it in the future. You can include some interesting and even playful visuals, too, but the main goal is to tell users, “That page doesn’t exist. Check the URL, and try again.” 

Design better 404 pages with Webflow

404 errors will happen from time to time, even on a perfectly optimized site. Whether they’re caused by broken links, URL spelling mistakes, or .htaccess file issues, the chances are you’ll encounter them eventually. But if you want to build a custom 404 error page that can save the user experience and gently redirect users, Webflow can help.

To get started, take a look at some examples of 404 error page designs, or start building your own in Webflow.