Teach you how to do code external optimization

Source: Internet
Author: User

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

Today, the teacher and you share the topic is "Code external optimization." Mainly introduces the meaning of code external, JavaScript code external optimization How to do, CSS code merge how to do.

First let's look at what is outside the code. We know that users see the site and search engine spiders see is not the same, the user is seen from the browser after the visual content, so there will be text, pictures, animations, landing and so on. But search engine spiders are looking at the original code behind these content (HTML), so we hope that the simpler the original code for optimization is better, because the simplicity of the code directly affect the search engine crawl efficiency, that is, whether the page is the spider's favorite, included.

  

Based on this, the head code whether CSS or JS more calls to the host more, it will reduce the speed of page opening. As shown here, such as the page has 4 JS calls + 2 CSS calls, each visit to the page each call code will have to load and request the time, that spider crawling will encounter such problems. So the code must make a merge call.

  

Another situation is not calling the code more, but in a page to the JS or CSS code directly written in. This is happening on many websites. This will be a bad situation, because CSS or JS code in general the characters will be very much. This will dilute the content of the core of our page (body), a lot of characters spiders will crawl, then the efficiency of the decline is not it. So CSS or JS code directly written in the page, we will do the code external optimization work.

In principle, external code is the removal of code from the page to the folder. This folder is on the host side of a certain appropriate directory, such as JS we put in the JS directory, CSS placed in the style directory. The original characters on the page are then removed and added to the <head> <link rel= "stylesheet" href= "" type= "Text/css" media= "all"/> or <script language= "JavaScript" type= "Text/javascript" src= "" ></script>. src and href are just filling in the path to the file you want to call.

OK, then talk about how to optimize. The first is the JS code written in the page optimization.

1 first find the code that is written to a large number of pages to determine which ones can be safely removed.

2 We use Notepad (Notepad) to create a function.js text

3 to remove the code paste to this text, save the good.

4 to upload this function.js new file to the specified JS directory below

5 Add <script language= "JavaScript" type= "Text/javascript" src= "/js/function.js" to the optimized page <head> ></ Script> calls and removes the previous large stack of JS characters.

The steps to merge JS optimizations are just as simple:

1 to find the calling code to be merged in

2 to find the physical location of these JS files on FTP

3 Open one or create a new JS file, just a few JS code all content copy together

4 Save this JS file and upload it to the appropriate perimeter folder

5 Add the calling code in the optimized page header <script language= "javascript" type= "Text/javascript" src= "/js/function.js" ></script> and remove the calling code from the previous paragraphs.

  

To the CSS code optimization, the same reason to first see how to optimize the page is written to CSS.

1 first find the code that is written to a large number of pages to determine which ones can be safely removed.

2 We use Notepad (Notepad) to create a base.css text

3 to remove the code paste to this text, save the good.

4 to upload this base.css new file to the specified style directory

5 Add <link rel= "stylesheet" href= "/style/base.css" type= "Text/css" media= "All"/> in the optimized page <head> Call and remove the previous large stack of CSS characters.

The steps for merging CSS optimizations are just as simple:

1 to find the calling code to be merged in

2 Find the physical location of these CSS files on FTP

3 Open one or create a new CSS file, using the @import URL ("") to invoke the contents of other CSS files, and JS is not the same do not need to copy the content all in

4 Save this CSS file and upload it to the appropriate perimeter folder

5 <script language= "JavaScript" type= "Text/javascript" src= "/js/function.js" ></script> calling code in the optimized page header.

  

As long as you understand the reason and principle of this optimization, do one operation you will certainly. In fact, it is not difficult, if there is no clear, you can Google, there are a lot of online solutions can also be consulted school information.

The original text from the course of the lecture (including video): http://www.zvenue.cn/zclass/tactic-class/coding-removal-optimization.html

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.