Takeaways
- Include moments of surprise and delight for your website visitors
- Give visitors directions to other pages that might help them
- Write the copy in your brand voice and speak to your ideal customer
- Use interesting, on-brand design to add some fun for your visitors
Why does it matter what my 404 page looks like?
When “404 Page Not Found” pops up for your website visitors, it’s a sign that something went wrong.
This could be as simple as a small typo in the URL, or it could be that the specific page they’re looking for has been taken off the site.
Even though they are common and every site needs one, most 404 page examples look like this for some reason.
Landing on a 404 page isn’t a happy moment for your visitors – unless you can make the best of the situation.
By creating a custom 404 page, you can help alleviate some of your visitor’s frustrations.
Remember, when you’re creating your website copy and design, your main goal is to make things easy for your visitors.
I thought it was nice of them to ask if I found what I was looking for on the above 404 page example.
Obviously, I did not find what I was looking for.
Get emotional
We’ve all followed a broken link at one point or another.
Use your experience to recall the thoughts and feelings you had at that time and why you felt that way.
Think about the (often negative) emotions your visitor experiences when encountering a 404 page.
- Frustration (This link was supposed to go to a free download that sounds awesome. Now that page no longer exists?)
- Annoyance (I don’t have all day to find this blog post. I read it just last week, and now I can’t find it anywhere!)
- Impatience (This is my third attempt to buy this product. I’m sure I can find it somewhere else rather than wasting my time on this site.)
As for all copywriting, get into the mindset of your customer.
Join the conversation happening in their head and think about how you can move them forward using your copy.
On your 404 page, the negative emotions your visitor is experiencing can be combatted with these three steps:
- Give your visitors some directions when they get to the page
- Let your page have some personality
- Use design that elicits a smile from your visitors
I’m will show you some 404 page examples that use each of these steps to suit their brand.
Give your visitors direction
Let’s face the fact that most 404 page examples are pretty boring and present you with some jargon-filled copy.
If your visitors land on your 404 page and all they see is “404 Page Not Found”, they will look elsewhere for the answer they’re searching for.
Which could be on another website.
Instead, try giving them directions on the page that will help them know where to look on your website.
For the Copyhackers‘ 404 page, they offer a simple button with “Back to Home” copy.
They also give it a subtle brand touch by adding an intentional typo they know visitors will notice and find ironic.
(Can you spot it?)
When visitors land on Airbnb‘s 404 page, they have a lot of options.
Visitors can return to the homepage or select from a list of other pages to point them toward what they were initially looking for.
Giving your visitors directions and links allows them to decide which path best fits their query.
Or it might give them great content to read while they browse your site.
For HubSpot‘s 404 page, they’ve added 3 different options for the visitor to choose from.
HubSpot knows the main reasons people visit their website are getting their CRM (Customer Relationship Management) tool, reading their blog, or taking a course through their academy.
There’s also a brief description of what the visitor will experience on each suggested page, so the visitor has a good idea of where the link will take them.
Show your brand personality
Your 404 page is the perfect place to show off your brand personality.
Since this is a page that usually gets overlooked, it’s a nice surprise and delight opportunity for your visitors.
By incorporating copy in your voice and adding a bit of fun, you can soften the blow of landing on a broken link.
And, best of all, you can re-engage your visitors and keep them on your site.
In this tutorial, Joanna walks through a website with a prominent brand voice.
She shows it’s ok to be quirky because your audience will follow your brand if they’re the right fit.
You will attract the right customers and repel the wrong ones by being comfortable with your voice.
In the following 404 page examples, the copy is full of brand voice.
The copy gives frustrated visitors a moment to take a break and then return to what they were looking for – while staying on your website.
In this example from Joel at Business Casual Copywriting, the visitor is invited to complete a mad libs-style game.
About a zombie outbreak.
Although there’s no direction specifically back to the homepage, I’m sure visitors are happy to fill out this story.
And go back to what they were doing after they’ve stopped the apocalypse.
This story is also a very clever way of showing Joel’s writing skills and seemingly endless creativity.
For our next example, Headspace uses this 404 page copy as a chance to offer their visitors a sample of their programs.
Since Headspace is all about promoting a calm mind, its copy encourages visitors to take a breath before moving back to the homepage.
And you know what?
It helps.
I found myself taking a breath even when searching for 404 page examples.
I’m sure this would be a welcome suggestion for someone accidentally landing on this page.
Not to be outdone, Disney plays up their 404 page with a relevant movie reference.
The page is animated (as you’d expect from Disney), so the picture doesn’t do it justice.
By using witty copy, they can give that unexpected smile to a visitor experiencing frustration.
Design makes a difference
As we saw in the first 404 page example, a plain white page with black text isn’t very appealing.
To the eyes or brain.
This disengages the visitor and prompts them to skip over most of what you’re saying because it’s so dang boring.
Some 404 pages are like that.
Just giving you the factual error information and leaving you to your own devices.
How can you make your 404 page more engaging then?
Joanna is a huge advocate for ensuring that great copy has a great design. She says,
You are always creating the environment in which your prospect will consider your offer.
Joanna Wiebe, Copyhackers Founder
This means that even on your 404 page, every visitor is a potential customer.
What they experience on this page could change their mind about your brand – so make sure this change is in your favor.
By adding in a fun and on-brand image, you create a more interactive and positive experience for your visitors.
Plus, design or copy that’s unexpected gives your visitors that moment of surprise and delight I mentioned earlier.
This moment helps keep visitors loyal to your brand by causing them to pause and get pulled back onto your page.
Keeping visitors on your website is the main goal of your 404 page
Your 404 page is a big opportunity for you to recapture a visitor who might otherwise have bounced off your site.
Having visitors stay on your site increases the chances of conversion, which is always a good thing.
Take this example from Amazon. They didn’t do anything overly inspired with their copy, but everyone loves a cute co-worker.
Leaning on the attention all pets got as work buddies during Covid, Amazon plays into their visitor’s emotions with various pet pictures.
The pictures change each time you hit a 404 page as well. So you can keep refreshing to your heart’s content – then get back to shopping.
In this 404 page example, Blizzard includes an animation of a character from World of Warcraft.
You wouldn’t necessarily get it if you’re not a WoW player, but Blizzard knows their audience.
And knowing your audience is something that can definitely get you points on your 404 page.
Include an image of something only your ideal customers know or find humorous.
The image eases the frustration and gives your visitors that little hit of dopamine they need to feel like you really do know them.
It also increases the likelihood of them staying on your site.
Slack‘s 404 page depicts a charming forest scene and is movable by hovering your cursor on each side of the screen.
The only direction on this page is to go to the Help Center, but you can watch the little pig and chicken go for a walk.
That’s just as good, right?
Although the page doesn’t offer a lot of helpful copy, it still gives the surprise and delight factor most 404 pages should be striving for.
Time to take a look at your own 404 page
After looking at quite a few 404 page examples, I can safely say they’re often neglected.
Perhaps due to oversight or the thought that no visitors will ever make it to these pages.
Even if your website is rock solid, there’s bound to be a time when a visitor inadvertently lands on a 404 page.
Don’t waste this space!
This is your opportunity to turn your website visitors around, ease their frustrations and send them somewhere they can easily find what they’re looking for.
By customizing the copy and design on your 404 page, you give visitors a reason to stay with your brand.
Because you turned their negative emotions into positive ones.
Inside Copy School, you can learn a bunch of ways to add moments of joy to your customer experience and write it all in your brand voice (especially with the new Master of Brand Voice course).
Conversation