SEOER可以通過(guò)對網(wǎng)頁(yè)性能的速度測量和分析來(lái)獲取網(wǎng)頁(yè)上的大部分性能數據。如何根據這些數據采取適當的方法和手段來(lái)優(yōu)化SEO的性能?
基于SEO優(yōu)化的PC瀏覽器前端優(yōu)化技術(shù)
前端優(yōu)化策略很多,可以概括為網(wǎng)絡(luò )加載類(lèi)、頁(yè)面呈現類(lèi)、CSS優(yōu)化類(lèi)、javascript執行類(lèi)、緩存類(lèi)、圖像類(lèi)、體系結構協(xié)議類(lèi)等。
網(wǎng)絡(luò )加載類(lèi)
1、減少HTTP資源請求的數量
百度和谷歌官員在他們的搜索優(yōu)化指南中反復強調盡可能多地合并HTTP請求。在前端頁(yè)面中,通常建議盡量合并靜態(tài)資源圖片、javascript或css代碼,以減少頁(yè)面請求數量和資源請求消耗,從而縮短首次訪(fǎng)問(wèn)頁(yè)面的用戶(hù)的等待時(shí)間。通過(guò)構建工具合并圖像、CSS、javascript和其他文件可以減少HTTP資源請求的數量。此外,我們應該盡最大努力避免重復資源和增加冗余請求。
2、減小HTTP請求大小
除了減少HTTP資源請求的數量,我們還應該最小化每個(gè)HTTP請求的大小。例如,可以使用減少不必要的圖片、javascript、css和html代碼、優(yōu)化文件壓縮或使用gzip壓縮傳輸內容來(lái)減少文件大小和縮短網(wǎng)絡(luò )傳輸等待時(shí)間。特別是百度閃電算法之后,對網(wǎng)站的訪(fǎng)問(wèn)速度也有要求。
3、將css或javascript放在外部文件中,避免直接使用<style>或<script>標記。
在HTML文件中引用外部資源可以有效地利用瀏覽器的靜態(tài)資源緩存,但有時(shí)在簡(jiǎn)單的移動(dòng)頁(yè)面css或javascript的情況下,為了減少請求,css或javascript會(huì )直接寫(xiě)入HTML,具體根據css或javascript文件的大小和業(yè)務(wù)場(chǎng)景而定。如果css或javascript文件的內容更多,業(yè)務(wù)邏輯更復雜,建議將其引入外部文件。
<linkrel=“stylesheet”href=“//cdn.domain.com/path/main.css”><scriptsrc=“//cdn.domain.com/path/main.js”><script>
4、避免空心Href和SRC
當<link>標記的href屬性為空或<script>、<img>和<iframe>標記的src屬性為空時(shí),瀏覽器在渲染過(guò)程中仍會(huì )加載href屬性或src屬性的空內容,直到加載失敗,從而阻止頁(yè)面中其他資源的下載過(guò)程,加載的內容。是無(wú)效的,所以應該盡量避免。
<imgsrc=“”alt=“photo”>ahref=“>單擊鏈接</a>
5、為HTML指定Cache-Control或Expires
為HTML內容設置Cache-Control或Expires可以將HTML內容緩存起來(lái),避免頻繁向服務(wù)器端發(fā)送請求。在頁(yè)面Cache-Control或Expires頭部有效時(shí),瀏覽器將直接從緩存中讀取內容,不向服務(wù)器端發(fā)送請求。
<metahttp-equiv="Cache-Control"content="max-age=7200"/><metahttp-equiv="Expires"content="Mon,20Jul201623:00:00GMT"/>
6、合理設置Etag和Last-Modified
合理設置Etag和Last-Modified使用瀏覽器緩存,對于未修改的文件,靜態(tài)資源服務(wù)器會(huì )向瀏覽器端返回304,讓瀏覽器從緩存中讀取文件,減少Web資源下載的帶寬消耗并降低服務(wù)器負載。
<metahttp-equiv="last-modified"content="Mon,03Oct201714:45:57GMT"/>
7、減少頁(yè)面重定向
頁(yè)面每次重定向都會(huì )延長(cháng)頁(yè)面內容返回的等待延時(shí),一次重定向大約需要600毫秒的時(shí)間開(kāi)銷(xiāo),為了保證用戶(hù)盡快看到頁(yè)面內容,要盡量避免頁(yè)面重定向。
8、使用靜態(tài)資源分域存放來(lái)增加下載并行數
瀏覽器在同一時(shí)間向同一個(gè)域名請求文件的并行下載數是有限的,因此可以利用多個(gè)域名的主機來(lái)存放不同的靜態(tài)資源,增大頁(yè)面加載時(shí)資源的并行下載數,縮短頁(yè)面資源加載的時(shí)間。通常根據多個(gè)域名來(lái)分別存儲JavaScript、CSS和圖片文件。
<linkrel="stylesheet"href="//cdn1.domain.com/path/main.css"><scriptsrc="//cdn2.domain.com/path/main.js"></script>
9、使用靜態(tài)資源CDN來(lái)存儲文件
如果條件允許,可以利用CDN網(wǎng)絡(luò )加快同一個(gè)地理區域內重復靜態(tài)資源文件的響應下載速度,縮短資源請求時(shí)間。
10、使用CDNCombo下載傳輸內容
CDNCombo是在CDN服務(wù)器端將多個(gè)文件請求打包成一個(gè)文件的形式來(lái)返回的技術(shù),這樣可以實(shí)現HTTP連接傳輸的一次性復用,減少瀏覽器的HTTP請求數,加快資源下載速度。例如同一個(gè)域名CDN服務(wù)器上的a.js,b.js,c.js就可以按如下方式在一個(gè)請求中下載。
<scriptsrc="//cdn.domain.com/path/a.js,b.js,c.js"></script>