現(xiàn)在網(wǎng)上壓縮js和css的工具有很多,但壓縮html的工具還比較少,個別網(wǎng)站雖然提供了html在線壓縮,但效果不太理想,壓縮率太低,還不到5%,很多地方都沒有進行處理。而html壓縮其實是網(wǎng)站優(yōu)化中比較重要的一個部分,在google網(wǎng)站速度優(yōu)化建議中就有要求壓縮html代碼,詳見壓縮HTML代碼。我們看看百度主頁,它的代碼就是經(jīng)過了壓縮的。如圖:
壓縮HTML代碼
可能很多人都不重視html代碼壓縮這個部分,但是如果要優(yōu)化網(wǎng)站速度,這個工作還是要去做的。
工具是如何實現(xiàn)壓縮html的?
簡單來說,就是使用程序刪除空白符、換行符、注釋等多余的字符。而html代碼里還包含js和css代碼,所以,實際上html壓縮還包含了js壓縮和css壓縮,工程要比單純的js或css壓縮要多很多,實現(xiàn)起來難度也大很多。
其實,在google眼里,壓縮html并不是單純刪除多余字符那么簡單,google提出了更高的要求,他認為壓縮html代碼需要做好如下幾個方面:
- 刪除空白符
- 合并Heads
- 轉(zhuǎn)換Meta標(biāo)簽
- ELide屬性(省略屬性)
- 刪除注釋
- 刪除引號
- 裁剪網(wǎng)址
詳見壓縮HTML代碼,可惜,現(xiàn)在還沒有工具能自動化實現(xiàn)這些工作,包括google也沒有推出這種工具或接口,這需要網(wǎng)頁設(shè)計師來精心優(yōu)化。
使用html在線壓縮工具
卡卡網(wǎng)推出的html在線壓縮工具,程序方面使用了雅虎的Yahoo.Yui.Compressor.dll組件來壓縮嵌入到html里面的js和css代碼,另外再聯(lián)袂使用一套非常專業(yè)的html代碼壓縮程序,所以此工具的壓縮效率非常高且十分安全,基本不會出現(xiàn)壓縮后代碼運行出錯的問題。
前端方面,使用了著名的CodeMirror編輯器,代碼高亮顯示,用戶體驗極佳。
html壓縮
上圖看到,壓縮率達到了15.05%,效果不錯。
此外,同時工具還附加了強大的html格式化功能。
html格式化
12個格式化選項,滿足不同用戶的閱讀習(xí)慣。
最后,附上html壓縮及格式化工具地址:http://pagespeed.webkaka.com/youhua/html/