How to create a better 404 error page
December 20th, 2019You must have ended up on a 404 error page at least once while surfing the internet. It pops up whenever a part of a website doesn’t exist for various reasons and you must go back to previous page or move on to a new one. Even though it’s an error message, you can turn it into a space your visitors will enjoy seeing. And who knows, maybe it will be this space that eventually turns them into your customers.
Once logged in to the Webnode website builder, you can easily open this page by adding /page-not-found-404/ to the end of your URL. Then you can update the page however you want, just like all the other pages of your website. More detailed instructions can be found in our Knowledgebase, or in this short video:
So much for the basics.
If you’re a creative soul, jazz up your error page. Pictures, videos or a link leading to the best-selling product will all make it more engaging.
Just remember, there needs to be a direct and clearly visible link to a functional part of your website. If you want, add more than one link, but your visitors should always recognize those links immediately.
Another rule states that the 404 error page should match the design of the rest of the website. If you’re selling spare car parts, you can use a photo of a restored Porsche and a link to your homepage. Need inspiration? We will show you how other more or less-known companies handled their error pages. These ten pictures will definitely tell you more than a thousand words could.
10 examples of great error pages
This furniture store cleverly used their own products to build the error message. The number 404 can be created with all manner of objects, from clothes to fruit. At the same time, a bold button will lead the lost visitors to an important part of the website.
Where do people get lost most often? In nature. That’s why the forest is such a common theme for error pages and you can choose it as well. Also, notice the nice suggestion for what to do next.
As the caption says, sometimes getting lost isn’t so bad. Here you can see a perfect match between the error page and what the seller offers. You can feel the freedom. And when you decide you’ve been lost long enough, the navigation bar at the top of the page will help bring you back.
What else would you expect to find on the Lego’s error page than the main character from their own movie? Besides the button encouraging you to purchase something, there’s also a message that will assure you that everything is STILL AWESOME.
9GAG error page has only one purpose – make the visitor download their app. Simple, straightforward and with a funny GIF in the background this server is so famous for.
Use pop-culture and memes like this page used Lionel Ritchie and a text from his most famous song. Don’t forget to add navigation buttons so your visitors can have fun but also can find their way back to a working part of your website.
The international movie database simply must have an error page build on movies. And so, the word “web page” somehow slipped into the most famous movie quotes. Big Lebowski, Star Wars and Matrix – all of them are here. Of course, there are also links to take you to the page with the quoted movie or the homepage.
You don’t have to be funny at all costs but you should always be understandable. Even if you don’t speak the same language as your visitor. A broken pencil clearly symbolizes that something went wrong and the eye-catching number 404 with a button leading to the homepage help get the message across as well.
The beauty really lies in simplicity. If you get lost, e-commerce mogul Amazon simply shows you one of their many company dogs. It’s the ultimate dog-friendly company and they manage to show off this benefit just perfectly.
Big players know what works for their customers. That’s why you can see a cute baby tangled up in its own jacket on eBay’s error page. However, more important than this dose of cuteness is the list of trending products and a direct route to the homepage.
Are you planning on developing SEO on your website? Try the step-by-step guide.
Does your website have an old-fashioned 404 page or did you spice it up a bit? We’d like to see what you’ve come up with. Share your error page with us in the comments below!