Get in the know
We stay on top of the latest trends so you don’t have to. Subscribe for a quarterly dose of marketing tips, web design techniques, creative trends, and a whole lot more, plus a look at our featured client work.
No one likes being lost.
What’s a 404?
A 404 page, or the 404 Not Found error, is what a user sees when they try to reach a page on your site that’s simply not there. This can happen if the page has moved, a link was mistyped into the browser, or a user clicked on a broken link. Instead of loading the page, the server responds with a 404 response.
When you go to a page on a website, whether it’s by clicking a link or typing in an address, think of the process as the browser starting up a conversation with the server:
Browser: Hi! I have this URL for imarc.com/a-real-page. What do I do?
Server: Hello! I know all about that page. Here’s how you show it to your user.
Above is what we call a 200 OK response. This means the server knows about the page, knows how to get to it, and can give the browser all the tools it needs to show it to you, the user.
But say that page no longer exists, never existed, or was moved (a change of URL). Then, the conversation goes very differently:
Browser: Hi! I have this URL for imarc.com/not-a-real-page. What do I do?
Server: Oh, gosh. I have no idea what that is. Sorry!
That conversation produces a 404 response, also known as the 404 Not Found error. The server can’t provide the page the browser is asking for, so instead, it provides a 404 page.
How do I set up a 404 page?
Servers can be configured to identify a certain page such as the 404 page.
To make things even easier, most content management systems let you define how to respond to a 404 error. For instance, Craft CMS (a popular choice for Imarc clients) will route through your files for a 404.twig template. Once configured, you as the site administrator control the content of your 404 files from the content editor, just like you would any other page on your site.
Talk to your system administrators (or Imarc!) about your options – let’s talk!
Redirecting to the homepage (Don’t!)
A common anti-pattern these days is to forgo the 404 page completely and instead redirect all 404 errors to the site homepage.
Here’s why this is not a good idea:
It can be confusing for users. Imagine trying to go to a specific page and somehow, impossibly, you keep ending up back on the homepage instead.
It can negatively impact SEO and your site’s crawl rate. While having too many 404 errors will cut into your SEO rank, redirecting to the homepage instead is known as a “soft 404” – and this can be just as dangerous. Unlike pages that produce a 404 response, redirections like this produce that 200 success response we talked about earlier. That means search engines waste their crawl budget indexing these (non-existent) pages instead of real pages. Learn more about soft 404s and crawl budget impacts.
It can slow down your site. This is particularly relevant for larger sites. Redirecting all 404 pages to another page means that your server must process all of these redirects, doubling the amount of work per page.
You’re missing a chance to interact with visitors in a meaningful way. At its core, your 404 page is like any other landing page. So, treat it with the same care: use it as a way to showcase your brand, engage with your users, and increase conversions.
Building the right 404 page
There’s no one way to build a 404 page. Each site has its own intended audience, each brand has its own voice and tone, and each user has their own needs. However, there are three principles you can follow to ensure that your 404 page performs well:
Stay on brand
Be open
Offer a path forward
1. Stay on brand
404 errors can happen to anyone, including first-time site visitors. This could be the first engagement a person ever has with your brand, so let it shine!
The 404 page on Starbucks.com is a great example of this. The menu and footer are still branded and match the rest of the site, but the ring of coffee on the right-hand side is reminiscent of something missing. It’s clear, branded, helpful, and has just enough humor.
Another great example of leveraging brand on a 404 page is IMDb.com. This 404 page is even more minimalist, but with a rotating (and humorously edited) movie quote just for the occasion.
2. Be open
When a user lands on your 404 page, you want them to know it, and you want them to know it immediately. A 404 page disguised to look like a normal page will only cause confusion and frustration.
Instead, a clear and thoughtful 404 page allows you to acknowledge the mistake with humility, grace, and if your brand allows, a little tension-cutting humor.
Lego.com is a great example of this. It stays on-brand, but it also doesn’t disguise the fact that yup, this is a 404 page, and something went wrong. It finds the space to make a little light of the situation – and send folks to their online store.
3. Offer a path forward
Perhaps the most important rule of 404 pages is to give the wayward user a next step. As much as a 404 page is a mark of being lost, it should also be a map showing the way home.
Popular things to include on a 404 page:
A search bar
Links to the most frequented or important pages
A “Contact Us” form to report the broken link
Links to pages with high conversion rates
Boston.gov, the official website for the city of Boston, MA includes a few of these components. There’s a search bar, some common actions for site visitors (“Request City services,” “View property taxes,” “Pay a parking ticket,” “Apply for a job”), and a light touch of humor reminiscent of the Boston Tea Party to stay on-brand.
Update your 404 page
A well-made 404 page can be the only thing that stands between a frustrated user and a potential conversion. The key is to stay on-brand, be clear and open, and offer the user a path forward.
Working on converting frustrated users into happy clients? Let’s talk!
