Not your usual ‘Oops, page not found!’
23 awesome 404 error pages
What is 404?
Ever clicked on a broken link or accessed a page that doesn’t exist anymore? When the web server is unable to locate a page, it returns a standard HTTP status code of 404 and displays a 404 error page to let the client (aka the web browser) know that the requested page cannot be found.
What goes in a 404 error page?
Without a well-designed 404 page, you’ll probably end up seeing a generic one that the web server uses like the one below.
Gotta admit, that’s pretty bland and uninformative for the unsuspecting user.
So how can we do it better?
First of all, we should create a custom 404 page for the site.
Some paths you can take:
- Bring users back to the homepage
- Suggest links to other pages
- Include a search box to navigate to other pages
The key is to make lost wanderers feel at home and lead them back to the website. It’s also a good opportunity for you to get creative and add personality to the site.
Let’s have a look at some of the web’s most interesting examples.
Those with cool visuals
- Make the page beautiful.
- Make users stop and stare.
- Make it almost rewarding for them to land here even if it was by mistake.
1) Professor Soap
As if the header of the Professor Soap website is not eye-catching enough, we are entertained by the animated illustration of a character munching on internet cables. Nice!
2) Southwest Trains
Check out the subtle 404 built into the railway tracks.
3) Blizzard
They say it’s good practice to first apologise then appease the user when a 404 occurs. But Blizzard does the opposite and stays cool. 👏👏👏
Those that let words do the talking
4) Kvell
No image needed for me to like this one 👇🏼
5) Mendo
Who doesn’t love fun facts? Good one, Mendo.
6) Ueno
Ueno does a pretty good job with visuals and copy in this 404 page.
On top of a running hot dog, we get different funny messages whenever we refresh the page!
Those that help you find your way
7) Medium
Not only do we have a search box to help us find the page we were looking for, Medium also comforts us with more article recommendations for the lost soul.
8) Theme Forest
Haha I laughed out loud for this one.
9) ESPN
This one has a nice touch of personality and great football vibes.
Those that make you laugh
As they say, laughter is the world’s best medicine. What better way to get out of an awkward situation than to turn that frown upside down? :D
10) Huge
This digital agency has a funny bone. Refresh the page to see more 404 fun.
11) Bluegg
You got to turn up your volume for this. I laughed out loud again.
12) imgur
Move your mouse around to see the animals in the paintings come alive! Can’t take my eyes off them too…
Those that stay true to their brand
13) Lego
How people deal with 404 — lego figurines edition.
14) McDonald’s
Oh no, no more fries :(
15) Coca Cola
Even the ‘4’ is icy cold. Perfect for the hot weather these days.
16) NASA
Nuff said, there’s nowhere cooler than outer space.
Those that break character
In a good way.
Even serious brands can have fun with 404.
17) Bloomberg
Unexpected, but I like 👍🏼.
18) OCBC
Looks like you’ve found a hidden intergalactic portal while looking for a savings account. Woo~ take me there OCBC.
Those that speak to the fans
19) Pixar
Cheer up, Sadness! Everything’s going to be okay.
20) Github
Today’s Box Office Hit: Featuring Github’s Octocat dressed as Obiwan Kenobi in the 1977 Star Wars movie.
These aren’t the driods you’re looking for
Those that make you feel like a super genius hacker
21) nclude
No mouse needed for this 404 page. You got to type to get redirected to another page. Cool much?
22) Chabot
This one’s too fun to watch. Funny cat video FTW!
23) Nouveller
Put on your grey hat and get down to business. Type in an invalid command and watch what happens…
More fun 404 pages?
Feel free to share more here!