404 Not Found: Why Pages Go Missing and How to Fix It

404 Not Found is the server's way of saying nothing exists at that address. The site works; this URL does not. Typos and deleted pages cause most 404s, but on sites you build, a refresh that 404s in a single-page app, a case mismatch, or WordPress rewrite rules are the usual culprits.

The 404s developers hit most
SymptomCauseFix
App works, but refreshing a route gives 404Static host has no file at that pathRewrite unknown paths to index.html
Works locally, 404 after deployFile name case or missing build outputMatch case exactly; check the build folder
WordPress posts 404, home page worksRewrite rules out of dateSave Settings, Permalinks
Old URL now 404sPage moved or deleted301 redirect to the closest new page

Updated

A 404 is the right answer for addresses that truly do not exist. The problems start when real pages return it, or when a page you removed had visitors and links. Fix the first by correcting routing or deploys; fix the second with redirects to the best replacement.

Single-page app fallbacks by host

Netlify: public/_redirects

The 200 makes it a rewrite, so the address bar keeps the original URL.

/*    /index.html   200

Vercel: vercel.json

Files that exist, such as scripts and images, are served before rewrites apply.

{
  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}

Nginx and Apache

The Nginx line goes in the location block; the Apache line in the site config or .htaccess.

# Nginx
location / {
    try_files $uri $uri/ /index.html;
}

# Apache
FallbackResource /index.html

Single-page apps: the refresh 404

React Router, Vue Router and similar tools change the URL without asking the server. That works until someone refreshes or opens a deep link, when the server looks for a file such as /dashboard/index.html and finds none.

The fix is a fallback that serves index.html for any path without a real file. On Netlify that is one line in _redirects, on Vercel a rewrite in vercel.json, on Nginx a try_files line and on Apache FallbackResource. Keep real 404s working by letting your app show its own not-found screen for unknown routes.

Deploys and moved pages

If a page exists in your repository but 404s after deploy, check the build output folder. Files outside the folder the host publishes, or generated during a step that did not run, never reach the server.

When you rename or remove pages, keep the old addresses working with permanent redirects. A redirect map in your host's config is easier to maintain than redirects scattered through code.

On a site hosted by We.Inc there is no web server, PHP process or function timeout of your own to tune. If a page on a We.Inc site returns this code, send support the address and the time so we can check our side.

How it works

  1. Copy the exact URL that fails, including case, trailing slash and query string.
  2. Check whether the file or route exists in the deployed build, not just in your code.
  3. If it is a client-side route, add a rewrite so the server serves your app's index page.
  4. If the page moved, add a 301 redirect from the old address to the new one.

Tips

  • Linux servers treat About.html and about.html as different files, while macOS and Windows usually do not. A link that works on your laptop can 404 in production.
  • Keep a useful custom 404 page with search and links to main sections, but make sure it still returns the 404 status.
  • After changing URLs, list the old ones from analytics or Search Console and redirect each to its closest match.
  • A page that returns 200 but says 'not found' is a soft 404; search engines flag it, so return a real 404 or 410 status.

Frequently asked questions

What does 404 Not Found mean?

The server was reached but has no page at that address. It does not say whether the page ever existed; 410 Gone is the code for content removed on purpose.

Why does my React app give 404 when I refresh a page?

The router handles paths in the browser, but on refresh the server looks for a real file at that path. Configure the host to serve index.html for unknown paths, and the router takes over.

How do I fix 404 errors in WordPress?

Go to Settings, Permalinks and click Save Changes without changing anything. That rewrites the rules WordPress uses for pretty URLs, which fixes most cases where posts 404 but the home page works.

Do 404 errors hurt SEO?

404s for pages that never existed are normal and harmless. Losing pages that had links or traffic wastes that value, so redirect them to a relevant page with a 301.

Should I redirect every 404 to the home page?

No. Search engines treat mass redirects to the home page as soft 404s and visitors find them confusing. Redirect only to a page that really replaces the old one; otherwise let it 404.

Related: Soft 404s, 404 page examples, 403 Forbidden, Redirect checker.

Start for free or see all free tools. We.Inc is free to start, with no card needed. AI building is on paid plans from $20 a month.

More in Guides

Product

Who It's For

Features

Resources

Company

View Sitemap