RO
← Back to the blog

Optical Web Design

A 404 page that doesn't lose the visitor

What a website's 404 page should include, why the server must return a real 404 status code, and when a 301 redirect or a 410 is the better choice.

The Optical Design desk · web writer3 min read

A 404 page shows up when someone lands on an address that doesn't exist on your site: an old link, a typo, a product you no longer sell. A good 404 page tells the person clearly what happened and gets them moving again in two seconds. On the technical side, there's one more thing: the server has to answer with a real 404 status code, not "everything's fine."

What a 404 actually is

The 404 Not Found status code means the server can't find the requested page. MDN's documentation adds one detail: a 404 doesn't say whether the absence is temporary or permanent. For a page removed for good, there's 410 Gone.

Every living website has 404s. You change the menu structure, drop a service, rename a page, and the old links on Facebook, in emails and on other sites stay where they are. You can't prevent all of them. You can make sure people don't get lost.

What goes on the 404 page

Google has clear recommendations for custom 404 pages:

  • Say plainly that the page wasn't found, in everyday language, no codes or jargon. "This page no longer exists, or the address is wrong."
  • Keep the site's look and navigation. People need to see they're still on your site, not on a blank server page.
  • Link to what most people are looking for: services, menu, popular products, contact, plus a link to the home page.
  • Offer a way to report the broken link, for example a link to the contact form.

Where it makes sense, we also add a search box and a tappable phone number. For a restaurant, a link to the menu and a booking button solve almost everything. A drawing or a short joke can work if it fits the brand's tone, but it doesn't replace useful links.

The technical mistake: "soft 404"

Plenty of sites show an error message while the server responds with status 200, meaning "this page exists." Google calls this a soft 404: an address that tells people the page doesn't exist but tells the search engine everything's fine. The result: Google may try to index empty pages.

Google says custom 404 pages are made for people, and the server still needs to return a real 404 code. URLs that return a 404 aren't indexed, and ones already indexed get removed from the index.

How to check: open a made-up address on your site, say with "/test-xyz" at the end, and look in Chrome DevTools, under the Network tab, at the status the page got. It should say 404.

When you want a redirect, not a 404

If a page moved or has a clear replacement, don't leave people on the 404 page. Set up a 301 redirect from the old address to the new one. Google treats it as a strong signal that the new address is the right one.

SituationWhat you do
The page moved to a new address301 to the new address
The service was replaced with a similar one301 to the new service page
The page was deleted and has no replacement404 or 410
Wrong address typed by the visitor404 with the custom page

Don't redirect everything that's missing to the home page. Google advises against sending many old URLs to a single unrelated destination like the home page, because it confuses people. Someone looking for a specific service lands there with no explanation.

A check every time you change things

Whenever you change your site's structure, make a list of old addresses and where each one points now, as Google's guide to site moves also recommends. When we launch a new site on top of an old one, that list is one of the first things we prepare, so old links from Google and social media still lead somewhere useful. We explained addresses and domains in plain terms in our article on domains, hosting and HTTPS.

See what we do for websites on our Web services page.

Sources

  1. Soft 404 errors, Troubleshoot Google Search crawling errors, Google Search Centralwhat a soft 404 is, what a useful 404 page contains, returning a real 404, 301 for moved pages
  2. How HTTP status codes affect Google's crawlers, GoogleURLs returning 4xx aren't indexed, 301 as a strong signal
  3. Site moves with URL changes, Google Search Centralmapping old URLs to new ones, avoiding mass redirects to the home page
  4. 404 Not Found, MDN Web Docswhat the 404 code means and that it doesn't say whether the absence is temporary or permanent
  5. 410 Gone, MDN Web Docsthe code for resources removed permanently

Checked: surse Xenia Pușcașu · editare Nora Vlăsceanu · SEO Mihnea Tăbăcaru

Want this for your business?

Tell us in two lines what you need. We come back with a plan and a quote.