blog post image

Fantastic 404 Pages

As website developers we strive to create seamless navigation that optimises the users experience as they browse your site.

However from time to time people are going to stumble across a link that is either entered wrong, no longer exists or has somehow broken.  That is where they will generally encounter something like this.

Fantastic 404 Pages 1

404 pages are an abrupt disruption to the users journey that will happen from time to time, even to the best websites.

However 404 pages can offer an opportunity to have a bit of fun and show a bit of the humourous side of the company.  In this post we will cover some best practice elements to include in a great 404 page and provide some effective as well as amusing examples.

Best Practice Elements For 404 Pages

Turning a 404 disruption into a positive experience involves including some key practical elements while providing an opportunity to entertain people.  Here are some tips for what to include in your custom 404 page.

Address The Issue: Make it clear why they have reached the 404 page, apologise for the inconvenience and guide the user to a solution.  

Include A Home Link and Search Box: Including a link to you homepage so the user can look for what they are after.  Alternatively a search box can help them find what they were looking for.

Header and Footer Links: Include links from the top and bottom of the rest of the website to enable the user to self navigate their way.

Provide Links To Popular Pages: Based on your Google Analytics top pages you could list your sites popular pages to help the user to get back on track quicker.

Consistent Branding: Maintain your brand's theme on your 404 page to ensure user they are in the right area if not the right page.  

Humour: Giving someone a laugh can help to take away their sense of frustration when they have got disrupting on their journey.

 

5 Fantastic 404 Pages

Fantastic 404 Pages 2

 

Redbull Music Academy

Redbull have had a bit of fun with their 404 page with an older gentleman sitting an a computer exploding with error icons.  While be amusing it also includes the practical elements of a homepage link, website navigation links and a search box.  It is also interactive with the icons changing direction with the movement of the mouse.

Fantastic 404 Pages 3

Lego.com

Lego uses it's 404 page to add in some brand connection with its Lego characters showing a broken power cord to signify the broken link.  One improvement here could be the more prominent displaying of the Homepage link to make it easier to see.

Fantastic 404 Pages 4 

Omdesign.cz

Those of you familiar with the UK comedy show The IT Crowd will get this website's reference to the show.  The interaction with the Yes/No buttons serves as a Homepage link while the navigation bar provides an alternative way of moving on.

Fantastic 404 Pages 5

Bluegg.com

Bluegg take a different approach with a humourous video loop of a goat screaming like a human.  Luckily the homepage link is close to hand as you'll want to exit that page as soon as possible.

Fantastic 404 Pages 6

Mad+Ad!

On a local front Mad+Ad! uses a crying baby to convey something has gone wrong with a search box and navigation links to get back on track.