如何精簡網(wǎng)站代碼?
網(wǎng)頁精簡代碼是網(wǎng)站優(yōu)化中必不可少的部分,網(wǎng)站代碼精簡可以縮小頁面體積提高網(wǎng)站加載速度,也方便搜索引擎檢索網(wǎng)站中的主要信息。網(wǎng)站代碼的精簡主要包括合并JS、啟用Gzip、JS位置、合并CSS、合并相同資源等各種方法。網(wǎng)站代碼精簡可以通過相關(guān)工具來診斷,當(dāng)然當(dāng)你了解過一些代碼的精簡這些代碼精簡完全可以不依靠工具進(jìn)行了。
從標(biāo)簽入手。
Heading標(biāo)簽:包含了H1、H2、H3等等,是搜索引擎識別頁面信息的重要標(biāo)記。合理使用H1、H2、H3等不同級別的標(biāo)簽?zāi)軌蚴沟庙撁娼Y(jié)構(gòu)更加清晰,有利于搜索引擎的抓取。H1、H2、H3等標(biāo)簽是按照重要程度來排名的。
Strong和B標(biāo)簽:Strong和B標(biāo)簽都有加粗的意思,但B標(biāo)簽就是單純地將文字加粗,而Strong標(biāo)簽不僅是對文字加粗,并且這種形式的加粗會告訴搜索引擎該部分文字比較重要。另外Strong標(biāo)簽一般用于文章段落中的重點(diǎn)詞匯,而B標(biāo)簽一般只是強(qiáng)調(diào)一種視覺效果。
對JS文件的存放位置:
除非JS是一打開網(wǎng)站就需要用的,可以放到head標(biāo)簽內(nèi)。其余的可以放置body之前。這樣可以大大的提升網(wǎng)站的打開速度。
對CSS的合并:
如果網(wǎng)站有大量的CSS外部文件,建議對CSS進(jìn)行合并。因?yàn)槊慷噫溄右粋€CSS文件,就得多向http請求一次。
緩存靜態(tài)資源:
通過設(shè)置瀏覽器緩存,將css、js等不太經(jīng)常更新的文件緩存在瀏覽器端,這樣同一訪客再次訪問你的網(wǎng)站的時候,瀏覽器就可以從瀏覽器的緩存中獲取css、js等,而不必每次都從你的服務(wù)器讀取,這樣在一定程度上加快了網(wǎng)站的打開速度,又可以節(jié)約服務(wù)器流量。
img標(biāo)簽的四大必寫屬性:
img標(biāo)簽四大必須寫的屬性為:src、width、height、alt。src是指圖片的鏈接地址;給圖片定義高度和寬度,服務(wù)器就不用重新渲染加載;圖片加了alt屬性后,將圖片的信息以文本的形式展現(xiàn) 便于蜘蛛讀取圖片的含義。
將html控制方式轉(zhuǎn)換為CSS控制:
很多網(wǎng)頁設(shè)計者習(xí)慣在標(biāo)簽內(nèi)對內(nèi)容進(jìn)行控制,比如img標(biāo)簽里通過width和height來控制圖片的大小,盡量將這些代碼轉(zhuǎn)換成外調(diào)式的CSS,使網(wǎng)頁代碼更加的瘦身。
清除頁面中多余的代碼即精簡代碼:
有的網(wǎng)站以為制作者的代碼書寫習(xí)慣問題,頁面會有很多空格代碼,比如:空格代碼、style和font重復(fù)定義的代碼,不要小看這些體積很小的代碼,積攢多了,也會使我們的網(wǎng)站異常的臃腫。