Website creators (like Squarespace) do a lot of heavy lifting for you, like generating your 404 error page automatically. They make it easy to focus on the meat of your website like your home page, about page, and services page.
But seeming “throwaway” pages like your 404 error page are actually a great opportunity to connect with your reader and direct them to another piece of content… or something they might want to purchase.
How to sell from your 404 error page
The first and most important step to selling is to make a connection. This applies to any page on your website as well as every offline interaction you have with a potential customer.
Of course, online, you only have a few seconds to make an impact (experts seem to believe anywhere from just 3 seconds to approximately 20 seconds at most).
Landing on the wrong page or (worse yet) an error page is generally a red flag to a website visitors. It says “you’re not in the right place” encouraging your visitors to click off your website and likely land on a competitor’s when seeking the answer their question.
A clever 404 error page can capture their attention and do 3 things:
Connect directly with the reader with casual language
Make amends for sending the reader to the wrong place
Provide a pathway for the reader to find what they need
Example case study: squarespace
Squarespace has a killer 404 error page. If you hit it, you’ll find it doesn’t have any of the typical language like “404 error” or “oops, you’re in the wrong place”. There’s no blame placed on the reader, but there’s also zero blame placed on Squarespace.
Instead, they cleverly take responsibility without accepting any fault. The page includes an apology and passive statement: The page you were looking for couldn’t be found.
The apology is also a tool to connect with the reader. The animated “sorry” falling from the the top of the page and tumbling over is proof that this company has both technical and design savvy — one of the reasons they attract so many customers for their website creation tools.
The animation is minimalist in style, staying on brand with the rest of their visual identity. It doesn’t distract, but it does capture attention.
The next thing Squarespace does well is provide pathways to their website visitors who land on this 404 error page. Their language “maybe try learning about:” is suggestive, but not demanding. Then they list links to some of their most popular pages like Templates, again reinforcing, what they’re known for.
example case study: pixar
Pixar doesn’t take the animation route like Squarespace (which might be expected considering they are an animation studio), but they certainly do hold true to their branding roots.
Pixar is first and foremost known for their storytelling. They create flawed, heroic characters that viewers can’t help but fall in love with — and made one of them front and center on their 404 error page.
If you haven’t seen Inside Out, it’s amazing and I highly recommend it. It says a lot about human psychology and storytelling right in the film, which is perfect for improving your copywriting. Also, it’s adorably hilarious.
The entire 404 error page is a callback to this movie, Inside Out. The graphic front and center is one of the main characters, Sadness. The headline is a quote from another main character Joy. And the final line about ‘Long Term Memory’ is a reference to the entire plot line of the film.
And the shortest line “It’s just a 404 Error!” packs a lot of punch into just a few words of copy. Pixar is downplaying the issue of an error completely. In fact, they’ve turned an issue into an opportunity.
If you’ve seen and liked the film, this page will make you smile — exactly what Pixar wants — in order to turn a generally negative experience (hitting an error) into a positive one.
Although it’s subtle, this page drives visitors to think about the characters and plot lines of their favorite Pixar films (or yet to be seen ones), encouraging them to go watch one soon.
Example Case Study: OptinMonster
Optinmonster’s 404 error page is a 3-parter.
First, they acknowledge the 404 error page in a neutral, passive “That page doesn’t exist!”. Again, they’re neither taking blame or assigning it to their website visitors. They reaffirm this sentiment with a simple apology: “Sorry, the page you were looking for could not be found.”
Optinmonster follows this up with 3 smart moves:
A search bar for website visitors to find a specific page
A link to the home page for visitors to restart the search/discovery process
A link to contact them for visitors to get help finding what they need
All of this is above the fold, meaning website visitors do not need to scroll to see it. Once the page loads, they can see the headline, subheading, search bar, and links to the home page and contact page.
For those who do scroll, Optinmonster directs website visitors to one specific pathway: a free downloadable guide with email sign up.
This is especially clever because the subject of the free downloadable guide is one that Optinmonster is also tackling: visitors leaving your website. They use a strong, yet simple title paired with an animated graphic that slows visitors from scrolling past the offer entirely.
The how-to headline is especially effective on a 404 error page, because website visitors have hit a temporary dead-end in their search. They’re looking for information on what to do or how to do it. The “How to Convert Abandoning Visitors into Revenue” headline capitalizes on that.
The sign up copy is short, but impactful. Optinmonster pairs a statistic with a pain point of their audience: “Did you know that over 70% of visitors who abandon your website will never return?” Then Optinmonster quickly follows it up with the solution: “Learn how Optinmonster solves this problem for your website.”
It’s pretty meta, considering this is a tactic Optinmonster is using to stop visitors from abandoning their website, but it’s one you can use as well.
What you can include on a 404 error page
These case studies are just a few examples of what worked well for those brands. What works for your website might be completely different.
That’s just what works for me. Here are a few ideas you can test out and implement on your 404 error page:
Display recent Instagram posts (great for visual brands)
Invite website visitors to your Facebook group
Link to your 3-5 most popular blog posts
Include your latest lead magnet for email signups
Encourage website visitors to contact you directly
Embed your calendar for visitors to schedule a call with you
Send website visitors to your main services page
Invite website visitors to your upcoming webinar or virtual event
Put up a funny photo and a blurb about you (great for personal brands)
Show your most powerful testimonial with a link to buy from you
Display your e-commerce products with a link to the store
Turn the 404 error page page into a portfolio gallery of your work
Direct website visitors to your free resources and DIY page
Invite website visitors to join your mastermind or membership
Embed a short video of you suggesting what to do on your website
Use a regular error page and redirect to your popular content after 5 seconds
Whatever you include on your website’s 404 error page, it’s important to keep it on brand and in alignment with your business goals. Think about what you most want your website visitors to do, then tie that action back to your 404 error page.
I highly recommend monitoring your website’s analytics to see if your approach encourages website visitors to stay on your site longer. If not, try another idea and keep testing!
What creative and effective 404 error pages have you seen?