Custom 404 pages vs. generic 404 pages
age not found. That’s the type of message that you’re greeted with when you try to view a webpage that no longer exists. There are two types of 404 error pages: custom 404 pages or generic 404 pages. Both are incredibly different & we’ll look at them in detail after we’ve discussed why they exist.
A non-technical overview
When you’re trying to open a webpage, your browser (i.e. Chrome, Safari, etc.) communicates with the server of the website that you want to access. The server looks for the page that you’re trying to view. If it can find it, it will share a specific response with your browser. This response will be something like 200 OK & the page that you want to see will be displayed. If it can’t find the page that you want to see, it will tell your browser that there’s a 404 ‘not found’ error. You’ll then find yourself on the website’s 404 page.
How & why can a webpage not exist?
1. The website owner removed the page. They created a replacement page, but forgot to set up an automatic redirect for visitors. Due to this, servers & browsers think that the page no longer exists.
2. The site owner removed the page as it was no longer relevant. There was no new page to redirect visitors to, but there are still links to the deleted page available online.
3. You made a typo when typing the URL. If you get a 404 error, double check your spelling. If you did make a mistake, simply correct it & the page should display.
4. Someone typed in the link incorrectly & set it live before double checking. Now you’re clicking on a link that’s unrecognisable because it’s incomplete or misspelled.
Some of the 404 creating issues listed above can be prevented with technical SEO. However, that’s a slightly more complex topic & not for this blog. On the other hand, points 3 & 4 are created by human error. If you manually enter a URL & change even the tiniest detail – an extra hyphen or a single letter – it won’t be recognised.
While it’s not ideal to have users arrive on 404 pages, preventing ‘page not found’ errors is impossible. No matter how closely you monitor 404 reports for your website, there’s always the chance that someone will manually enter your URL & misspell something.
Generic 404 pages
If the user was on the brand’s website before arriving on this page, they would need to click the ‘back’ button in their browser to return. If they had clicked on a search result, they would most likely leave as soon as they see this page. Rather than go into a lot of detail about the negatives of a generic 404 page, let’s take a look at a few examples of custom 404s.
Custom 404 pages
This custom 404 page from Hubspot is a great example of a user friendly error page. Why?
1. It doesn’t share a generic ‘404 not found’ response. It provides users with a much friendlier explanation.
2. The Hubspot navigation menu is easily accessible, appearing in the same place as is does on other pages of the site.
3. Within the text, alternative destinations are recommended for users, with three links encouraging them to visit the Hubspot blog, read more about their products or sign up for a free demo. This is great for visitors who aren’t sure what to do next, with options that are relevant to different stages of their journey.
4. The page is clearly branded using the same layout as can be seen on the site’s other pages.
5. Hubspot’s free trial is easily accessed via the eye-catching orange button on the page’s top right hand corner.
Yes, the majority of visitors will still feel frustrated when they arrive on this page – the information that they wanted to access isn’t available. However, the content available on this custom page can help to add value, reduce annoyance & give users a reason to stay on the Hubspot site.
Here’s another custom 404 page example from the Gathered Goods co. As you can see, it’s very different from the Hubspot example, but it features many of the same positives: consistent branding, a familiar layout & navigation menu & an easy way to search for alternative products, recipes or content.
Best practice tips for 404 pages
Arriving on a 404 page can be disheartening, annoying & sometimes even confusing. When creating your custom page, it’s crucial that your branding & layout are consistent with the rest of your website. This builds brand awareness. It increases familiarity & trust in your brand & your website. Users can easily move between pages & find exactly what they’re looking for. This familiarity makes it easier & faster for existing users to find related information, products or get in touch. New users will be exposed to your branding & the other products / services / information that you offer. With well-planned content on your custom 404 page, both new & existing users will know why they’ve reached an error page. Relevant calls to action will encourage them to stay on your site.
It’s important to remember that on-page content should be relevant to that of a 404 error page – people need to know why they’re on this page & what steps they can take next. Never be tempted to reuse an existing page, such as your contact or about page. This will just confuse users & potentially frustrate them more.
The generic 404 page displays none of these features. With the URL cropped from my screenshot, you can’t even tell which website it has come from.
Which type of 404 page would you rather land on?
Why your website needs a custom 404 page
No matter how incredible & error free your website is, at some stage, someone is going to land on a 404 error page. If you haven’t customised your page, you’re reducing your chances of generating relevant leads, driving sales or solidifying your position as a thought leader. ♦
ABOUT THE AUTHOR
Amanda Beylkin is the founder of Words on Marketing. She began her marketing career in Australia in 2005, working for an early stage startup. Since this time, she’s worked with brands big & small, from Microsoft & Montcalm Luxury Hotels to Quiz Clothing & cranberry panda. Now based in London, she spends her days helping individuals & brands achieve more with marketing.