404 error pages

Thoughts on 404 Not Found error pages

Thoughts on 404 Not Found error pages

May 08th, 2014 – 56 Comments

Have you ever wondered why you should have that 404 Not Found page? What’s the use? The page is gone or broken and you don’t want people to end up there, so why not just redirect that page to the homepage of your website? They even made WordPress plugins that will help you do this, so why not, right?

Wrong. What you’re basically doing is putting people on a train they did not choose themselves. If I want to go to Paris, why send me to London instead? If a visitor wants to find a certain page on your website, give him that page or an explanation of why you can’t.

Optimize your site for search & social media and keep it optimized with Yoast SEO Premium »

Yoast SEO for WordPress pluginBuy now » Info

Back to basics

The 404 Not Found error means that the URL that was requested doesn’t point to a certain page. Or as Wikipedia puts it:

“The 404 or Not Found error message is an HTTP standard response code indicating that the client was able to communicate with a given server, but the server could not find what was requested.”

The page may have been deleted, or the URL was misspelled. The permalink structure might have changed or even the domain name, and redirects could have been set wrong. It doesn’t matter why the page isn’t there anymore. Just bear in mind that it’s probably your fault and not the visitors fault, and write content for that 404 Not Found page based on that assumption. Keep a close eye on your 404s, which can be done by using, for instance, Google Search Console or Screaming Frog.

Note that if you have some pages that need to go down temporarily, the use of a 503 Service Unavailable would of course be better than serving a 404 Not Found page. Smashing did an article on maintenance pages back in 2009: Effective Maintenance Pages: Examples and Best Practices.

Required elements of a 404 Not Found page

Let’s think about this for a while, because the internet is flooded with manuals for great 404 pages and everybody, including myself, has a different opinion on this.

First, I really don’t think the 404 should be a redirect to any other page. In the article 404 Page Best Practices, SearchEngineWatch also refers to this as not being the most user-friendly solution. There are plugins that semi-intelligently link the visitor to a ‘closely related’ page. This may seem smart, as that will give the visitor the information they want. Kind of. But probably not entirely. The visitor might still feel left alone on your website and click back to Google. That is the very reason I don’t like the redirect to the homepage. We test 404s in our SEO Care and when we are redirected to the homepage, we will always add a chapter about creating a great 404 Not Found page, with a link to this article. Joost already explained a lot about the visitor’s mindset in that post.

That visitor expects an explanation on why you broke your website. I think just a small explanation is required.

There are a few options for why that page broke. You may have changed permalink structure. If you just did that, perhaps you want to know what the visitor did to get that 404 Not Found. Just ask him. You could also have deleted the page, as many 404s state: “The page is gone”. No. That page didn’t go anywhere but in your trash can. “We may have deleted or moved this page” is a more suitable description.

That would also mean the page is still around somewhere else. Why not point the visitor to a search form or site map? Luckily these are pretty common practices. What I also like, especially in an online store, is bestsellers or recently visited products. Keep that visitor on a shopping spree. On a blog, that would mean displaying popular articles or recent posts. A 404 page should never give the visitor the feeling that they have reached the end of your website.

Examples of nice 404 Not Found pages

Annoying elements of a 404 page

I have to mention South Park here. They did a great job on creating funny 404s, just refresh the page and the SP fans will go wild, but it’s just not the best 404. Even with the most popular listings below the fun part. Create an actual page, don’t just try to be funny, as dull as it may be.

The worst one: the dog ate the page. Note that this might be personal. Even on a pet site, a dog on your 404 page just doesn’t make me smile (but what a nice website otherwise, indeed). Even when the 404 Not Found page isn’t bad at all like on this page, it may be overdone. Or I’ve just seen too many 404s with dogs already :-)

Fun is great by the way, but make it work. Don’t get a giraffe to lick my screen and think I’ll like your website regardless of not finding what I want. Help me to get back on track. At least point me to your homepage to start over again (but don’t redirect me!).

Another pet peeve: no 404 Not Found page at all. The browser telling me your website is crappy. That’s not what you want! Make sure your website has a 404 page. Using WordPress, just add a 404.php to your theme folder and create one if it isn’t there already, it’s really as simple as that.

Lastly, because I am looking forward to examples you have for crappy and great 404 pages: the huge 404 image that is telling me nothing more than that:

Huge 404 on a 404 Not Found page

Please don’t. These are the numbers you don’t want to see on your website, so why emphasize them?

Examples of crappy 404 Not Found pages

An honorable mention for IMDB here. Film geeks will love that one, though ;-)

Why do you think your 404 Not Found page is great?

Or perhaps you have some great examples, good or bad. We’d love to see these, so please drop a link in the comments!

Read more: ‘Website maintenance: 404 error pages’ »


56 Responses to Thoughts on 404 Not Found error pages

  1. rajat dutt
    By rajat dutt on 18 May, 2014

    i was facing the 404 error in my but after reading your article my issue is solved i don’t how but it is solved
    thanx for such great article

  2. rajat dutt
    By rajat dutt on 18 May, 2014

    thank god,
    i was facing the 404 error in my but after reading your article my issue is solved i don’t how but it is solved
    thanx for such great article

  3. Harpal Singh
    By Harpal Singh on 17 May, 2014

    Hello Michiel , you guys are really awesome. Every time i visit your site there is lot to learn. 404 error pages should be user friendly : means it should suggest user some informative posts, from where he can begin again. Nice article.

  4. Conciertos en Costa Rica
    By Conciertos en Costa Rica on 13 May, 2014

    Well I had been procrastinating on this one, but now I have it setup. Thanks Joost , your post just hitted me as a reminder. One off the to do list

  5. Tony H
    By Tony H on 13 May, 2014

    Those are some great 404 pages, most of the ones you see are plain and simple. I really like the Hard Rock Cafe one, because it gives an explanation it doesn’t just tell you 404 error.

  6. Maxwell Duchaine
    By Maxwell Duchaine on 12 May, 2014

    Very true. It’s likely the webmaster’s fault for the 404 page showing up. I always design my 404 pages to be easily distinguishable from the rest of the site and try to reduce the time that the user is confused http://triforce-media.com/404.

  7. Mika
    By Mika on 12 May, 2014

    Lots of good points here – I never thought of it as it is most likely my fault the 404 might be showing, but in most cases that’s probably true.

    I mentioned “404” in an offline situation this weekend, and people looked at me like I was an idiot (not too much of a stretch) until I explained to them what it meant. Just like the point above, no one wants to see the error code. It was meant to send a response to the browser, not to the person.

    My 404 page has a search box, because I figure the user will know the best what they’d like to or expected to find. I do redirect some to the home page in some scenarios though.

    Perhaps an overlay when redirecting like that could be a decent compromise? Pass the 301 juice to the new page, while the overlay lets the visitor know why.

  8. Jon Burnham
    By Jon Burnham on 11 May, 2014

    Great nuggets Michiel –
    Just one thing to criticise – I am English – could we change this to the other way round please:
    “… If I want to go to Paris, why send me to London instead …

  9. Kaspars
    By Kaspars on 10 May, 2014

    I have made a free WordPress plugin called Custom 404 Page which enables users to set any standard WordPress page as a 404 page. This allows anyone to customize the text and functionality of the 404 page as well as use shortcodes for including search form without touching template files. I figured people might find it useful.

  10. fred
    By fred on 10 May, 2014

    This is the 404 for kuwaitprices.com a shopping offers site.
    http://www.kuwaitprices.com/ishopping
    Here they are showing the shopping basket fallen

  11. Rob Honig
    By Rob Honig on 9 May, 2014

    Nice article, you’re right. You could get better results making a better 404 page. On the other hand, people aren’t stupid. They are searching for things and don’t get their wanted result / page / info.

    It’s off-topic, but maybe worth for an article : What would you do if WordPress does not exist anymore. Too many people rely on WordPress nowadays.

    • Rob Honig
      By Rob Honig on 16 May, 2014

      In addition.. always have a nice navigation so people can quickly jump to the start, make the 404 design like it is a part of the website. Another point, if you analyze statistics that you have such “not found” errors, redirect them with .htaccess. Then the next part is to get the “not found” pages out of the search engines indexes. People aren’t stupid, every extra click they have to make is an extra effort for visitors. They simply leave the site. Why search and visit if the first result already was crap.

  12. Kathy
    By Kathy on 9 May, 2014

    It’s bear in mind.
    NOT bare in mind.

    • Joost de Valk
      By Joost de Valk on 11 May, 2014

      Hehehe, with Michiel bare in mind, I can’t actually get to sleep ;)

    • Michiel Heijmans
      By Michiel Heijmans on 9 May, 2014

      Did I really make that mistake again..? Thanks, Kathy ;-)

  13. Hidayat Mundana
    By Hidayat Mundana on 9 May, 2014

    I want to change the “404” I, thus showing the last posts or posts that are related to the keywords in the url is not found.
    is there a tutorial?

  14. Helena
    By Helena on 9 May, 2014

    Hi there!

    Nice topic about 404 pages. It really makes sense to me.

    My actual 404 pages unfortunatelly still being crappy. But I promisse I’ll fix it as soon as possible! :-D

    Cheers

  15. Edward
    By Edward on 8 May, 2014

    Mine doesn’t get many points for usability, but I like it :)

    http://www.edwardrjenkins.com/im-pretty-sure-best-404-page-ever/

  16. Randall
    By Randall on 8 May, 2014

    Interesting article. I just built my own custom 404 page. I borrowed some code to make up this:
    http://appsmartweb.com/404.php

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Why not start with search and then the sitemap? Date archives have no use here, I think, just check the sitemap for what’s useful for a visitor on a 404 Not Found.

  17. Dana
    By Dana on 8 May, 2014

    I will confess, my 404 has a dog but I’m not going to change it, because I like it that way. :D As to my favourite 404 pages, I’ve actually made a blog post about a year ago with some I stumbled upon.

    http://en.dana-svedova.cz/blog/10-best-404-not-found-error-pages

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Thanks, Dana, for your comment. Please understand I love a good laugh and had fun checking 404 Not Found pages for this post, but I wanted to write this pot to point out that it also should be useful. To write down my dog frustration was a relief ;-)

  18. Rob Christianson
    By Rob Christianson on 8 May, 2014

    Here’s the one I made for Cobalt, the company I work for, when we did our redesign… the Lamborghini was my addition. What do you think?

    http://www.cobalt.com/404

    • Mads
      By Mads on 12 May, 2014

      Very nice, hope I win a trophy :)

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Great 404, funny and informative! Nice job.

  19. Ron Thomson
    By Ron Thomson on 8 May, 2014

    Great article clear and making the point. I was actually looking to do something serious with our own website which i have been overhauling. The 404 page should have been one of the first not the last page to be re-designed but missed that point. Sill better late than never.

    Found the code on Yoast’s practical guide to 404 pages a useful starting point . However looking for sheer inspiration I typed in https;//Yoast.com/error it certainly could do with a little more information on it.

    I take it this is work in progress

    Ron

  20. Thomas Adison
    By Thomas Adison on 8 May, 2014

    Interesting article, BlueFountainMedia one is really amazing

  21. Studiumcirclus
    By Studiumcirclus on 8 May, 2014

    I thought this was a really interesting read and it certainly will impact how I treat 404s; that being said there are exceptions to this statement:

    “That visitor expects an explanation on why you broke your website”

    What if it wasn’t you who broke the journey? What if the user is following a link from the page of an inept web-master who used incorrect URL syntax or just plain misspelled your domain name?

    I feel that if someone else authors (or generates) a broken link to your site (maybe with the false expectation of content existing when it doesn’t) – that’s not your error, it’s theirs!

    Obviously it’s still in your best interests (in terms of capturing traffic) to see to such external errors; but it opens up a rather irksome vulnerability.

    If someone decides to target your site with numerous broken links, they can ‘force’ you to spend all your time fixing them since it’s apparently “your broken site not mine”.

    What would you do in such a situation (unlikely as it may be)?

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Email them? The point is, it’s still not your visitors fault, right ;-)

      • Studiumcirclus
        By Studiumcirclus on 8 May, 2014

        Well I guess that depends where they’ve been. If as in this example they have been frequenting scraper sites or low quality pages it probably is their fault ;) haha!

  22. Aaron
    By Aaron on 8 May, 2014

    With a small enough website why not show the site archive on the 404 page?

    Only downside I can see is a large site has to big of an archive for this, but for smaller websites.. say less than 100 real pages… why not?

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      I get your point, Aaron. But I’d rather link a sitemap in that case. Flooding the lost visitor with a hundred links still seems odd to me…

      • Aaron
        By Aaron on 8 May, 2014

        That’s why I’m thinking the strategy only works on smaller sites…in the 50-100 pages range.

        To be honest I haven’t really thought much about 404 pages until now. Food for thought. Interesting points all around.

  23. Jimi
    By Jimi on 8 May, 2014

    Great info. I’m not much of a designer but I try to learn from others when I can and have a little fun with my site along the way. Think it meets your criteria. http://fairviewaustin.com/404

  24. Takis
    By Takis on 8 May, 2014

    One of my favorites 404 pages is this one
    http://www.darkpony.com/404

  25. Jeff Matson
    By Jeff Matson on 8 May, 2014

    Upon taking up my position at InMotion Hosting, I noticed that our 404s were lame as you described. I thought that it would be a good idea to parse the URL that 404’d and display related content that they may have been looking for. Since making that change, we have quite a large amount of 404s that clock on through additional pages of the sites. If you want to play with it, you can hit a 404 at the following:
    http://inmotionhosting.com/support/error404
    Through the data that we have collected while it’s in place, we have ensured that our customers are happier and likely to get to what they are looking for, even if they happen to get a 404.

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Nice addition, indeed, Jeff. Thanks for your comment. Joost wrote about a similar solution here.

      • Jeff Matson
        By Jeff Matson on 8 May, 2014

        I never saw that one. I guess great minds think alike. ;)

        • Michiel Heijmans
          By Michiel Heijmans on 8 May, 2014

          ;-)

          • Jesin A
            By Jesin A on 8 May, 2014

            Oh my I’m a post author too! :-D

          • Jesin A
            By Jesin A on 8 May, 2014

            There is a bug in this theme. Why is Jeff Matson being tagged as the post author?

  26. abu maram
    By abu maram on 8 May, 2014

    Do I have to turn to any page mis this page 404
    Example
    http://pagearabia.co/final-25-voice-treasure-3
    to/404.html

  27. Falstaff
    By Falstaff on 8 May, 2014

    Maybe not the coolest, funniest, hippest or whatever, but I think it meets your criteria: http://trfbeefeaters.com/404

  28. Scott Griffiths
    By Scott Griffiths on 8 May, 2014

    My all-time favourite 404 page is http://visitsteve.com/404.html

    He’s obviously invested a lot of time into this, and i’ve watched it all the way to the end way too many times!!!

    • Youri
      By Youri on 9 May, 2014

      Thanks for that! The video is awesome!

    • Takis
      By Takis on 8 May, 2014

      That’s amazing :)

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Hahaha, you just got to love that one, indeed! Thanks, Scott!

  29. Ajdin
    By Ajdin on 8 May, 2014

    Got it. Thanks!
    Love the IMDB one though :) yes I’m a movie geek :)
    Cheers..

  30. Wouter Postma
    By Wouter Postma on 8 May, 2014

    One of the best 404 pages ever ;-)

    http://www.rollingstones.com/404

  31. Ryan Burnette
    By Ryan Burnette on 8 May, 2014

    I have to disagree about the SouthParkStudios 404 page. Cartman saying “screw you guys” … that’s classic.

    • Michiel Heijmans
      By Michiel Heijmans on 8 May, 2014

      Haha! Yeah it’s funny, classic and all that. It just doesn’t seem logical that someone keeps on refreshing your 404 page, don’t you think ;)

      • Silas Jura
        By Silas Jura on 9 May, 2014

        Haha I agree Yoast. I just refreshed it at least 10 times to see all the responses.

        • Silas Jura
          By Silas Jura on 9 May, 2014

          Scratch that about Yoast. Sorry Michael, I guess I wasn’t paying attention. Too busy looking at SouthPark. Lol


Check out our must read articles about Analytics