A few weeks ago Amazon had a major website outage that caused product pages to redirect to 404 pages – yikes that’s a lot of money lost! However, Amazon’s 404 page was so adorable (more on that later) that it inspired me to write this article all about 404 pages, their best practices, and 7 super creative 404 pages that are awesome.
What is a 404 page?
A 404 page is basically where visitors get directed to when they try to view a page that doesn’t exist usually via broken links. In theory, you never actually want people to have to see your 404 page, but let’s face it – we all mess up. It’s best to have a strong 404 page that communicates with your visitor and makes them take action to stay in your website.
What should your 404 page have?
Just a headline and quick sentence explaining that the page doesn’t exist will do. No body wants to be even more frustrated not knowing where the page they were looking for is. Just be mindful of your copy language and never make it feel directly like the visitor’s fault.
Relevant links With Call-To-Action
Whether it’s a few links to your most popular blog posts or just your navigation links it’ll give the visitor choices, but choices are nothing without direction. Use a simple call-to-action phrase like “check out one of these links or use the search box below.”
Consider a Search Box
Not always necessary, but clearly the visitor was looking for a specific page. Allowing them to search directly from the 404 page would be helpful if you have a bigger website with lots of pages and blogs.
Keep it somewhat familiar – as you should always with branding in general. Using the same colors and fonts let visitors know they’re on the same website.
Less is More
Don’t list links to every single page on your website. Also don’t go crazy with your photo album or have 50 different things at once going on. It will overwhelm your visitors. Keep it simple.
Allow Personality to Shine
Most 404 pages are boring since they just list an error and send you on your way – that’s why creative 404 pages shine! Typically no one wants to land on a 404 page while they’re looking for a specific page so making it fun and allowing your personality to shine softens that blow of potential frustration to your visitor. Just make sure it’s not out of line with you and your brand!
7 Creative 404 Page Examples
As I previously mentioned, Amazon was my inspiration for writing this article. Amazon’s 404 page connects a customer to the people behind their brand, their employees. The page is quite simple, but showing a random employees’ dog every time a 404 page is loaded is not only adorable but less frustrating that the product I was going for isn’t there. Oh – and such adorable puppies!
Giphy is my favorite go-to GIF factory! Their 404 page is boldly on brand with a few different background variations paired with words either the words “Oops”, “Woof”, or “Dang”. Unsurprisingly, the backgrounds and title words are animated GIFs. It’s memorable and is straight to the point.
DirecTV Now’s 404 page is an example of the basics that also shows personality. By using Family Guy’s Stewie and his catchphrase “What the Deuce?”, it captures the brand for a TV streaming service.
Simple and straight to the point copy with an image that says it all. There’s actually more than meets the eye to the image; the jester represents it might be a joke, the construction worker says they’re going to fix it, and the pirate suggests maybe he stole the page, but the mini-figure holding the two ends unplugged is Lego taking responsibility for the mess up. So much meaning in such a simple image.
Hootsuite adorably positions their 404 page as their mascot, Owly, is missing by putting him on a milk carton. They also put a little humor into the copy while getting the message clear that the page the visitor is looking for isn’t here.
Xbox’s 404 page randomly generates one of a few different images with cheeky puns to tell you the page isn’t there. It’s funny and gets the message across. I do wish they put more effort into the call-to-action other than just showing Xbox games, consoles, and support buttons, but their on brand creativity is there.
I may be a little bias, but my 404 page is a lot of geeky fun. I created an animated illustration scene I dubbed Super Garett World 404. I’m a huge geek and that’s pretty obvious if you follow me on Twitter or ever held a conversation with me. So me putting this little Easter Egg into my website was a fun way to show my geeky side in my business. It’s a whole lot of fun, but I also make it clear that the page isn’t here and suggest to the visitor to click some links to stay on the website.
What are your favorite creative 404 pages on the web? Let me know on Twitter (@GarettCreative)!