How to optimize HTML pages

We know that in the HTML, you not only to make good-looking pages, but also to consider the optimization of the page, then today to bring you how to optimize the HTML page ideas, I summed up 5 points, together to see

Change table to Div layout

As much as possible, the table label layout HTML refactoring div Layout can save at least 40% of the code amount. Because the DIV code is less than the HTML page of the table layout, the search engine index weight is better than the table layout's HTML page.

Reduced thin Div, span, ul Li series labels

Layout Div+css page, we sometimes save some div layout code, reduce the amount of code.

The following case code:

<div class= "div" > <ul> <li>DIV</li> <li>DIV</li> <li>DIV</li> &L T;/ul> </div>

Can be changed to:

<ul C

lass= "div" > <li>DIV</li> <li>DIV</li> <li>DIV</li> </ul>

This saves a pair of div tags, which reduces the amount of HTML code and acts as a compressed HTML. Such direct to the UL name CSS style class, can distinguish in a page different place use UL Li List label.

Remove extra spaces

Remove extra space wrap, you can effectively compress the HTML code takes up bytes, generally after the development of the HTML code can be deleted line and space content.

Use the DW software to bulk delete spaces between tags in html

Such as:

<div class= "div" > <div ...></div> </div>

You can remove spaces and wrap after:

<div class= "Div" ><div ...></div></div>

This saves space and newline bytes.

Note that the Web release version can be used to delete extra spaces and blank lines with DW. If you want to re-edit, then to the DW software code format layout can be.

Table type layout Use table instead of div layout when appropriate

If it is a tabular data list layout, we'd better choose table because table layouts use table better than div layouts, but using table layouts saves HTML tag code and saves CSS styles than div layouts.

For tabular data types, the table label +CSS style layout is recommended

HTML page Code compression table label layout tables

Similar to this list-type table table, we recommend using Table label layout

Web gzip compression

Your own server recommends setting the Gzip compression feature on the Web page.

1. What are the benefits of opening gzip?

A: When Gzip is turned on, the data exported to the user's browser will be compressed, which will reduce the amount of data transmitted over the network and improve the speed of browsing.

2. How to enable the Gzip compression feature for IIS:

A: First, if you need to compress the static file (HTML), you need to build a directory on the hard disk, and give it "IUSR_ machine name" This user's write permissions. If the compressed dynamic file (php,asp,aspx) is not needed, because its pages are dynamically generated each time, the compression is discarded. Then in IIS Manager, the "Web site" right-click Property, not one of the following sites, but the entire site. Go to the "Services" tab, select Enable dynamic content compression, static content compression. Then select the server extension below the site to create a new server extension. The name does not matter, the following path to add the file is: C:\windows\system32\inetsrv\gzip.dll, and then enable this extension. Static content can be compressed at this time, but for dynamic content, the ASPX file is not in the compressed range. Because the default compressible file does not have this extension. And in the management interface you can not find a place to add extensions, this time only to modify its configuration file. Under the c:\windows\system32\inetsrv\ there is a MetaBase.xml file, you can open it with Notepad, find IIsCompressionScheme, there are three identical names of the segment, is Deflate,gzip, Parameters, the third paragraph does not need to control it, the first two paragraphs have the same parameters, in the two paragraphs of the parameters hcscriptfileextensions below all add a line of ASPX, if you have other dynamic program to compress, also add here. HcDynamicCompressionLevel changed to 9, (0-10,9 is the most cost-effective one). Then you need to restart the IIS service, you can experience the speed of compression.

Believe that you have seen these cases you have mastered the method, more wonderful please pay attention to the PHP Chinese network other related articles!

Related reading:

JS Operations Window Object Implementation steps

JS operation non-IE event object properties, a detailed description of the method

Make a red box with a solid border with Div and CSS