Shulou(Shulou.com)06/01 Report--

Editor to share with you how to compress html code, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

How to compress the html code and make the html file shrink and optimize

HTML optimized compressed directory

Change table to div layout

Reduce the number of div, span, ul li and other series tags

Delete extra spaces

Use table instead of div layout appropriately in table type layout

GZIP compression of html web pages

1. Change table to div layout-TOP

Try to reconstruct the table tag layout html div layout, you can save at least 40% of the code. Because the div code is less than the html page with table layout, the index weight of search engine is also better than that of html page with table layout.

Second, reduce the reduction of div, span, ul li and other series of tags-TOP

When laying out DIV+CSS pages, we can sometimes save some DIV layout code and reduce the amount of code.

The case code is as follows:

CSS study to DIVCSS5 I love DIVCSS5 DIV+CSS study to DIVCSS5

You can change it to:

CSS study to DIVCSS5 I love DIVCSS5 DIV+CSS study to DIVCSS5

This can save a pair of div tags, thereby reducing the amount of html code and compressing html. By naming the css style class directly to ul, you can distinguish the use of ul li list tags in different parts of a page.

3. Delete extra spaces-TOP

Deleting extra space wrapping can effectively compress the bytes occupied by html code. Generally, the newline and space content of the code in html can be deleted after the development is completed.

The spaces between tags in html can be deleted in batches with the help of DW software.

Such as:

You can delete spaces and line breaks:

This saves the bytes occupied by spaces and line breaks.

Note that web releases can delete extra spaces and blank lines with the help of DW. If you want to edit again, then go to the DW software for code formatting and typesetting.

4. Table type layout using table instead of div layout-TOP

If it is a table data list layout, we'd better choose table, because the table layout using table is better than div layout, while using table layout saves html tag code and css style than div layout.

The following figure shows the table data type. It is recommended to use TABLE tag + CSS style layout.

Similar to this column phenotype table table, it is recommended to use table tag layout

5. GZIP compression of web pages-TOP

It is recommended to set up the web page Gzip compression function on your own server.

1. What are the benefits of driving a GZIP?

A: when Gzip is enabled, the data output to the user's browser will be compressed, which will reduce the amount of data transmitted through the network and improve the speed of browsing.

two。 How to enable Gzip compression for IIS:

A: first of all, if you need to compress static files (HTML), you need to create a directory on your hard drive and give it write permission for the user "IUSR_ machine name". If you compress a dynamic file (PHP,asp,aspx), you don't need it because its pages are dynamically generated every time. Then in IIS Manager, right-click above "site"-property, not one of the sites below, but the entire site. Go to the "Service" tab and select enable dynamic content compression and static content compression. Then select the server extension below the site and create a new server extension. The name doesn't matter, the path to add the file below is: C:\ windows\ system32\ inetsrv\ gzip.dll, and then enable the extension. At this time, static content can be compressed, but for dynamic content, aspx files are not within the scope of compression. Because the default compressible file does not have this extension. And you can't find a place in the administrative interface where you can add an extension, so you have to modify its configuration file. In c:\ windows\ system32\ inetsrv\ there is a MetaBase.xml file, you can use notepad to open, find IIsCompressionScheme, there are three segments with the same name, respectively, deflate,gzip,Parameters, the third paragraph does not care about it, the first two paragraphs have basically the same parameters, in these two paragraphs under the parameter HcScriptFileExtensions, add a line aspx, if you have other dynamic programs to compress, also add here. The HcDynamicCompressionLevel is changed to 9, (0mi 10J 9 is the most cost-effective one). Then you need to restart the IIS service to get a sense of the compressed speed.

The above is all the contents of the article "how to compress html Code". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.