...Processing...
error
big error
11 tips for creating useful 404 error pages - TutnIQ
Table of contents X
  • Customizing your 404 error page

    In this section we will look at the features of a useful 404 error page, and learn how to create 404 pages with common server applications.

  • Default 404 error pages are often sparse with details and not very helpful. Some users may find such pages intimidating and confusing. A good 404 page will engage the user and encourage them to explore your site.

    Tips

    1. Use a customized 404 error page to inform users clearly that the page they are looking for cannot be found.

    2. Use the same look and feel as the rest of your site, but keep it light-weight so that it loads quickly. This is especially important if something has gone horribly wrong and other parts of the site are broken. If possible use a static page.

    3. Help the user find what they are looking for by linking to your most popular pages, navigation pages and your homepage.

    4. Include a link to support (or consider providing contact details).

    5. Include a search box so that users can search for what they are looking for.

    6. Use humor to lighten the mood, and reassure visitors that your site is not broken.

    Examples of 404 error pages

    Some ideas for cool 404 error pages:

  • Setting custom error pages with the Apache web server

    If you use the Apache web server you may be able to change the default error documents by editing the .htaccess file (if AllowOveride is appropriately set) and setting the location of your custom error page.

    Apache 2.4:

    ErrorDocument 404 /path/to/custom/error/page/not_found.html    
    

    The syntax is the same for Apache 2.2:

    ErrorDocument 404 /path/to/custom/error/page/not_found.html
    

    Generating 404 errors with PHP

    It is fairly common for a web server to pass a page request on to a script (for example a PHP script) for further processing and display. In such an instance it is up to the script to emit the appropriate HTTP status code, especially if it is not the default code 200.

    The following code snippet demonstrates one way of generating a 404 HTTP status code with PHP:

  • <?php
        if (!headers_sent())
        {
            $protocol = "HTTP/1.0";
            if ( $_SERVER["SERVER_PROTOCOL"]  == "HTTP/1.1" ){$protocol = "HTTP/1.1";}
            header( "$protocol 404 Not Found", true, 404 );			
        }
        
        //Load the error page here, for example:	
        include ("your_404error_page.html");
        die();
    ?>
  • Creating 404 error pages with popular content management systems

    Many popular content management systems allow you to create customized 404 error pages:

« Previous
[Section: 2 of 3]
ad placeholder

Sharing is caring!

About the author

Course stats

My progress

Find related courses