Optimize Website Design (22): Avoid 404 errors

Preface

The optimization of website design is a big topic. There are some general principles and some suggestions for different development platforms. This research has never been stopped, and I have shared this topic on different occasions.

As a general principle, Yahoo's team of engineers once provided 35 best practices. For this list, see Best practices for speeding up your web sitehttp: // developer.yahoo.com/performance/rules.html, at the same time, they also integrated a test tool yslow http://developer.yahoo.com/yslow/

I strongly recommend that all website developers learn these best practices and apply them based on their actual projects. In the next period of time, I will combine the ASP. NET development platform and use a seriesArticleTo help you better understand and use these principles.

Preparations

Prepare the following development environment and tools to follow me for subsequent learning.

1. Google Chrome or Firefox, and install the yslow extension component. Please note that this component is provided by Yahoo, but there is no version for IE currently.
   1. Https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
   2. Https://addons.mozilla.org/en-US/firefox/addon/yslow/
   3. You should have some knowledge about the developer tools of these browsers. You can call up this tool by pressing F12.
2. VISAUL studio 2010 SP1 or later, Visual Studio 2012 is recommended
   1. Http://www.microsoft.com/visualstudio/eng/downloads
3. You need to have a good understanding of the basic development process and core technologies of ASP. NET. This series of articles is difficult to popularize basic knowledge.

Topics to be discussed in this article

This article I will discuss with you the 22nd principle: Avoid 404 S (avoid 404 errors ).

Wait! Can Error 404 be avoided? Yes? No? This problem should begin with the cause of 404 error.

Under what circumstances will a 404 error occur?

404 means not found, meaning that no resource is found. In this case, there are at least two reasons for 404 error:

1. This resource is required, but we did not provide it. The user requests in the normal way, so the resource cannot be found.
2. The resource does not exist, and the user requests in an abnormal way, of course, still cannot be found.

 

Let's look at the first case.

1. For example, each website should have A favicon. ICO file by default (which should be placed under the root directory of the website), which is used to display a small icon for the website in the browser. This file is automatically requested by the browser. If the file cannot be found, the system reports Error 404.

2. another possibility is that a user has visited your website before and a page exists (for example, customer. (congratulations, someone added your webpage to indicate that your webpage is useful to him ). However, at some point in time, your website has changed customer. aspx and renamed it service. aspx for some considerations, such as feature merging or restructuring. Imagine if the user used the address recorded in the favorites folder to access the site, would the 404 error occur?

3. or, the link address you have defined on the web page, due to negligence, is not checked before release, resulting in the original link to the service. the aspx link is written as servies. aspx. When you click a link, the user will also receive the 404 error.

 

All the above three scenarios are resources that should have been provided, but we have not provided them. We should (and can) Avoid 404 errors caused by such problems.

However, some other situations may not be completely avoided. For example, users enter the wrong address (tianyknow, they may be mistaken or intentionally incorrect ), because the resource does not exist, the Error 404 is returned.

1. Incorrect operation: the user originally wanted to input customer. aspx, but lost to customer. asp.
2. Intentional error: the user did not want to use your website, so he intentionally entered some addresses.

 

 

What is the impact of the 404 error?

1. Invisible impact: Sometimes a 404 error occurs, and the user may not feel it at all.

• For example, to request the favicon. ICO file, or request a nonexistent script file, style sheet, or image file, the page will still be rendered in the normal way.
• The loss of script files, style sheets, and image files may cause some page behaviors and interface effects to be abnormal (or may not be obvious)
• The biggest problem may be the performance impact. In particular, if you request a script file that does not exist, the browser will try to parse the content in the response in Javascript even if 404 is returned when requesting the script file. This will undoubtedly increase the processing time, and because the file does not exist, it is useless.

See the impact: If a page requested by the user does not exist, the user will receive a clear response

• By default, he will receive a standard error page (Note: many users will be scared by this page)

• If the website pays more attention to user experience, the 404 error page will be customized, for example, the following examples

 

 

How to Avoid 404 errors as much as possible

Now that we have learned about the 404 error scenario, we can take some measures accordingly.AvoidIt occurs:

1. Favicon. ICO is provided for the website.
2. Run the link checker tool in the test before releasing the website to ensure that all links are accessible. This tool is released by W3C and is completely free of charge and worth it.
3. In order to avoid the user from adding an absolute address (customer. aspx) to the Favorites list, this poses a risk for later updates. You can consider using URL rewriting or routing technology in the design phase to achieve more friendly and flexible addresses (such as/customer). If the business logic changes in the future, you only need to modify the routing rules.

• If conditions permit, use ASP. net mvc (built-in routing component)

The third measure can also minimize the chance of manual address input errors.

 

 

How to provide custom 404 error pages

We know that Error 404 cannot be completely avoided. By default, the IIS service provides standard error pages (however, these pages may not be so friendly)

Therefore, in order for your website to provide better user experience when such errors occur, we recommend that you design a custom 404 error page.

 

Let's take a look at some of the designs listed below, and I believe they will inspire you:

1. Http://www.webdesignerdepot.com/2009/07/50-creative-and-inspiring-404-pages/
2. Http://blog.karachicorner.com/2012/06/30-best-404-web-page-designs/

[Note] different from the above designers, I personally think that this error page does not need to be highlighted by 404, because ordinary users do not know what 404 means. Keep it simple.

 

Then, you can perform the following configuration in the web. config of the website:

 <?  XML   Version  = "1.0" ? >  <! --  For more information on how to configure your ASP. NET application, please visit  Http://go.microsoft.com/fwlink? Linkid = 169433  -->  <  Configuration  >    <  System. Web  >     <  Compilation   Debug  = "False"                   Targetframework  = "4.0"   />  <Customerrors Mode= "On"><Error Statuscode= "404"Redirect= "My404.html"/></Customerrors>    </  System. Web >  </  Configuration  >