You need to create custom error pages. Here’s why.

Web server error arises, when the user requests the information that cannot be transmitted by the server. In that case, the server shows the user a special page with an HTTP status code and an offer on what to do next.

You can check the full list of status codes on Wikipedia, but right now let’s look at those that can be commonly seen on the websites:

1. 404 File Not Found. Arises when the user requests the information that is not on the server.
2. 503 Service Unavailable. Happens when the server does not respond at all. For example, because it is online or has run out of resources.
3. 504 Gateway Timeout. Happens when something happens on the way to the server and a request never reaches it at all.
4. 401 Unauthorized. A user has requested data that he does not have access to.
5. 451 Unavailable for Legal Reasons. A user has requested data that has been removed by a demand from the law enforcement agencies.

All these errors cause a negative reaction from the visitor — even if the errors are his own fault. Besides, standard error pages do not even offer a chance to go back to the website’s homepage — which means that everyone who gets a website error is effectively lost. And if you don’t like it — you need to make your own, custom, web pages.

How to make error pages interesting

Good error pages can be divided in three categories — useful, entertaining and interactive. We are going to use the 404 error page as an example, because the issuement of this page depends on the user and the web developer can’t do anything about it. That’s why it is one of the most popular ones.

Useful

A useful 404 error page has an error description, a possible reason for its occurence and a search field. Maybe also a link to the website’s main page, a picture or an animation.

It doesn’t take much effort to make those pages (there’s even a website with ready-made templates), yet they are perfect for the task of bringing the user back to the mainpage.

Entertaining

There’s a pretty animation or a picture on the page. A link to the homepage is also here, but usually it’s not in the center of attention.

These pages are interesting and help you to add a personality to the website. On the other hand, they are not so useful and can be actually distrating.

Interactive

There’s a minigame or an app on the page. A link to the homepage should be there too, but it is secondary.

These pages are made to call upon the positive emotions, but on the other hand they can easily distract users from their original target. For example, when I got my first 404 error at Lichess, I forgot what I was doing beforehand and it took me half an hour of countless attempts to save the black queen before I returned to the homepage.

How to make my own error page?

The best way is to edit a page in cPanel. This method is universal and supported by most of the CMS.

How to make an error page in cPanel

1. Log into cPanel.
2. Click Error page under Advanced.
3. Click on the page you want to edit.
4. Write your own code or take it from a template. Templates can be found at OS-Templates or Fresh Design Web.
5. Click Save.
6. Go back to cPanel’s homepage.
7. Click File manager.
8. Open the public_html folder.
9. Click on .htaccess file.
10. Click Edit.
11. Write ErrorDocument 404 /404.shtml as the very first line and click Save changes.
12. Check if your 404 error page is working. Mine — does.

How to make your own error page in WordPress

If your website runs on WordPress — you already have a primitive, but a usable page. That’s what it looks like on a freshly installed CMS:

WordPress considers the page a part of the website, which means that it inherits the theme. Some themes even have their own error pages:

But there’s a problem too. WordPress does not support setting the error pages up from cPanel and .htaccess.

There are two ways to edit the error page in WordPress — editing the error page directly and using a plugin to redirect the error page.

Editing the error page in WordPress

If you edit, i.e. 404.php, it will leave the page styled after your website, but will allow you to edit text, widgets and other page elements. In order to do this:

1. Log into WordPress.
2. Click Appearance.
3. Click Editor.
4. Pick a page you want to edit to the right:
5. The file contains PHP and HTML code. If you are familiar with those languages, you can edit the contents of the file however you wish. If not, you can always edit the text on the page.
6. Click Update file.
7. Check whether or not the page is working. Mine is here.

Redirecting to another page

It allows you to use any page as a 404 page.

1. Log into WordPress Dashboard.
2. Click Plugins > Add new.
3. Type Custom 404 Pro in the search field.
4. Click Install Now.
5. Click Activate.
6. Go to plugin’s settings.
7. Define a path to your new 404. It can be wherever you want, even on another domain.
8. Here’s an example of such page. Here a 404 page for the subdomain is located on another subdomain.

Conclusion

No website is safe from errors. Even the most dedicated and careful user will one day mistype and see the 404 error page. In order to make this a positive experience, we recommend making a custom error page. This will increase the chances that the users will stay on the website. Here’s a shortlist of good 404 error pages for your consideration:

1. GitHub — useful
2. Sygic — entertaining
3. Blue Fountain Media — interactive
4. Unihost.com — useful