Victoria Taylor — August 8, 2019 — August 8, 2019
Now and then your website has a broken or deleted link that is still floating around somewhere on the internet, or a user writes a typo in the URL. Then someone ends up landing on a 404 error page, confused, lost and wondering “where do I go from here?”
A 404 Error is a Hypertext Transfer Protocol (HTTP) code that tells you that the server for the website or specific page you’re trying to access can’t be located. There are other types of HTTP errors, but 404 errors are the most common.
A broken link during your browsing experience is a big problem for some websites, but even a 404 page can be an opportunity. You can lessen your users’ frustration by swapping out a bland 404 error page with something a bit more fun.
If you’re looking for designs to try out, I searched pages high and low and found 20 of the best 404 pages you can learn from.
1. Gymbox
Why it works:
Gymbox is a London based fitness company that prides itself on its trendy fitness classes and brand personality.
This 404 page works because you’re more puzzled about the 404 page’s video than the actual 404-page error. Nothing says you’re in the wrong place like a man in a crop top, short shorts, and 90s inspired pelvic thrust. You’re sure to click back to the homepage in no time.
2. Drift
Why it works:
No one likes landing on a 404 page. That’s why it’s always best to lessen the disappointment your online users might face when they land on one.
Drift’s 404 page is one of the most fun ones we’ve seen. Misdirected users are greeted by an embedded video of DJ Khaled lost at sea.
The page directs the visitor to the home page with the link, and follows by reminding users that things could be worse: they could be DJ Khaled lost at sea.
3. 20th Century Fox
Why it works:
You can change frustration to delight by using pop culture images, captions, and videos when you’re creating your own 404 pages.
Since Fox houses most of these films, it’s only natural that they incorporate them into their website. They take it a step further by adding an element of chance: their 404-page movie reference changes every time you land on it.
You might snippets from Edward Scissorhands, Young Frankenstein, Napoleon Dynamite, and more. Click here to see what you get!
4. Magnt
Why it works:
Listed by CNBC as one of the Internet’s Best 404 Error Pages, Magnt boldly tells it like it is: either you don’t know how to type, or they broke something. You get to decide which one’s the cause of your 404-page error.
You can follow in Magnt’s steps and try some bold or creative approaches to your 404 pages with some tongue-in-cheek captions.
5. Hootsuite
Why it works:
Still not sure how to design your 404 pages? You can incorporate your business logo or brand mascot in the design. Take Hootsuite, for instance: for their 404 pages, they showed their mascot, Owly, missing on a milk carton, along with reasons why this page could be missing.
6. eharmony
Why it works:
Your 404 page can even be an opportunity to soft-sell your services. That’s what eharmony did with its 404 pages.
A wildly successful dating site, it stated that though the page was unavailable, there were millions of eharmony singles out there.
7. BluePath
Why it works:
Blue Path is a data strategy consulting firm with a hint of humor, website humor to be specific; Blue Path lets you in on just how lost you are with their 404 error page.
The page 404 shows you a detailed report of Atlanta’s crime rate from January 2015, because it’s a crime that you haven’t hired them as yet. Another amazing way to soft sell your services to visitors.
8. Email Center UK
Why it works:
Someone has to get the blame for a 404 error. So what did Email Center UK do?
Created an interactive 404 page where can you select which employee gets fired, along with another gentler option to let them keep their job by going back to the home page.
9. IMDB
Why it works:
Earlier, we spoke about how timeless pop culture references are. Back to the Future is no exception. As a movie page, IMDB does not disappoint.
10. Marvel
Why it works:
Okay, maybe movie references aren’t your thing, why not try jokes that work within your niche. Marvel added the universe’s Watcher to its 404-page mix.
The company was sure to win cool points with Black Widow in the backdrop and the eye following around your screen cursor.
11. Steve Madden
Why it works:
As far as apologies go, this Steve Madden 404 page takes the cake. The text is long but captures the voice of a true shoe lover.
Don’t be afraid to add some product placement on your 404 pages. If they came to shop, let’em shop, and provide customer service in case they need help since they didn’t find what they were looking for on your website.
12. MailChimp
Why it works:
Mailchimp’s 404 is pretty funny with the not-so-subtle way of saying that you’re just as lost as a donkey with its head in a hole, while gently directing you back to the home page.
13. Taco Bell
Why it works:
Taco Bell is a brand that has mastered the art of being funny and yummy at the same time. It’s page tells users that the page they were looking for does not exist – unless they were looking for an animated taco.
14. Pixar
Why it works:
Pixar decided to bank on its Inside Out star “Sadness”, because that’s what it feels like to land on a 404 page, and anyone familiar with the movie will recognize the long term memory joke. (Personally, I think it’s rather cute, don’t you?)
15. TSheets
Why it works:
I promise this is the last Back to the Future 404 page reference I’ll share (but you have to admit, that movie is a classic).
TSheet is a scheduling app that prides itself on accuracy and timely analytics. In keeping with that, they referenced the line where Dr. Emmet Brown achieves precisely 88 mph using his Flux Capacitor.
16. Buzzfeed
Why it works:
You can always keep it simple. Buzzfeed did, with its cat mascot wagging its tail back and forth to let you know that either something’s missing or you made a typo.
17. Lego
Why it works:
Lego’s been in the top ten when it comes to 404 pages, and it’s easy to see why with a page like this. You can’t help but light up when you see it (the opposite of your usual reaction to an error page). It’s on-brand, colorful, whimsical, funny and effective.
18. 9GAG
Why it works:
9GAG is the father of all memes and the community that powers it. They host a wide range of videos, images, and GIFs from all over the world. When you land on a 404 page on 9GAG, you’ll meet Pulp Fiction’s Vincent looking for Mia (which has become a cultural symbol for confusion) with the caption: “There’s nothing here”.
They don’t, however, leave users high and dry, instead leaving the option to download the app.
19. AirBnB
Why it works:
No one likes to drop freshly-scooped ice cream, just like no one likes to land on a 404 error page. So AirBnB decided to use a simple illustration to show just that.
It goes to show that your 404 page doesn’t have to be out there or filled with pop culture and glam: it can be as simple as using a simple illustration to add some color and emotion.
20. Dropbox
Why it works:
Since Dropbox’s 2018 brand refresh, they’ve changed almost everything from their webpage, interface, down to their 404 error page.
If you’re doing a brand refresh for your own business, don’t forget to add your 404 pages to the mix. (Believe it or not, it matters.)
Summary
There you have it, 20 of the best 404 pages to grace the internet. You can take the tips from each 404 pages and use them when crafting your own.
From simple to complex, video to images, there’s a lot of fun things you can do to replace that boring default “page not found” text.
What was your favorite 404 page, and why? Comment below and let me know, I’d love to hear.
Digital & Social Articles on Business 2 Community
(117)
