Use your '404 error' page effectively
“Error 404”, “Page Not Found”, "HTTP 404" or "404 Not Found" is a standard HTTP status code. It is displayed when the requested document does not exists
on the server.
In simpler words, '404 error' means that the client (your browser in most cases) was able to communicate with the server but the server could not find what you asked for.
When a visitor clicks on a broken link in your website or tries to open a url that does not exists anymore (or never existed) then they are shown a 404 error page.
Links and urls can go bad or become invalid due to multiple reasons. Common reasons being products, categories and information pages getting disabled or removed from the website.
Website owners and administrators try very hard to avoid showing an error page or message to their visitors. They put hundreds of temporary and permanent redirects religiously but end up ignoring the 404 page content.
Error page is not always a bad thing and it should be treated like all other pages of your website. You can use it positively to enhance your branding and make your visitor smile. As they say, every mistake is an opportunity to discover or learn something new. 404 error page can also be a great opportunity to showcase your company culture or creativity to your users. You can also use the 404 error page to send those users to pages and products that you want them to see.
Let's take a look at some of the familiar/popular websites and see how they use their 404 error page as an opportunity:
Magento.com uses all classic elements of a 404 page. It is simple, clear and gives further options to the visitor. They have an image of a man walking with blue mountains in the backdrop. The main message says: You might be lost… Go home or try our search.
This clarifies that you are not at the page where you wanted to go and it also give you the option to start fresh by going to their homepage. Then they have a search bar which can be used by the visitor to search for whatever they were looking for. Then they also have quick links to important sections of their website: Products, Marketplace, Developers, Blog and contact page.
When you reach the 404 error page on Wordpress.org, you will see that the famous WP logo hanging loose and then eventually falling down. That is a clear way to convey the message that something went wrong. The message 'Oops! That page can’t be found.' is also informal and sticks to the style that you find in all WordPress text. Then they give you the option to go to homepage or suggest you to use the search field in header. It is a simple page that does its job well and the logo falling off is enough movement on the page for the visitor to take notice.
With millions of products and billions of monthly visitors, Amazon is the biggest player in online retail today. With that many urls there is no way they can avoid 404 error pages.
So instead of showing a boring message, they accept by saying 'Sorry' in big letters and then suggest you to go to homepage and start your search again. The page is clear of any clutter or extra information and hence is very clear in its purpose.
The best part of that page is the that each time you come to this page, you are introduced to a new Amazon dog. Amazon claims to employ ~6000 pups and you will find them when you are lost on Amazon.com. With a big 'sorry' and a cute dog, no visitor feels sorry for coming across their error page.
Google is a leading technology company and holds almost a mythical status for developers and engineers, but they also want their products to be as simple as possible for users.
This ideology and nerdy culture clearly shows up in their Error 404 page. The message on that page says: 404. That’s an error. The requested URL was not found on this server.
They give the error code (for technical people) and then they inform you that it is an error and that the url you asked for isn't found on their server.
And then they even go ahead and say: That’s all we know. They even have a sketch of a sad and confused broken robot on the right side of the page.
That is all a user needs to know: Something is broken. The logo present on the page is linked to Google homepage so that you can continue your browsing.
The 'like' icon from Facebook is widely recognised by almost all internet users. Their 404 error page uses a play on that familiar like icon and shows the thumb with a bandage tied around it. This instantly tells you that something is wrong and you are still on Facebook.com. The message tries to explain the problem in simple words by saying: This page isn't available. The link you followed may be broken, or the page may have been removed.
That is a simple and clear explanation indeed. It then gives links to go back to the previous page, go to news feed or to visit their help centre.
Hope you got some tips from these examples and will implement them in your website too.
Feel free to contact Hungersoft if you want to create your own special and meaningful '404 error' page.