所有的搜索引擎排名或多或少都與網(wǎng)站的加載速度有關(guān)。但這一次,百度閃電算法來(lái)了,網(wǎng)站第一屏的開(kāi)啟速度被列在優(yōu)化排名的行列中,而且開(kāi)啟時(shí)間明確規定為2秒,那么我們該如何做網(wǎng)頁(yè)第一屏的開(kāi)啟速度呢?
為了優(yōu)化網(wǎng)站的運行速度,必須在軟件和硬件兩方面做好工作。從網(wǎng)站程序和頁(yè)面設計本身來(lái)解決web資源的加載問(wèn)題,然后服務(wù)器本身就需要有足夠的帶寬和處理資源。
首先,我們在打開(kāi)網(wǎng)頁(yè)時(shí)看到的只是前端,所以我們看到網(wǎng)頁(yè)背后的支持是HTML代碼,它包括各種網(wǎng)頁(yè)標簽,包括網(wǎng)站優(yōu)化中的TKD,加載的呈現資源:Java、CSS,以及已經(jīng)存在的網(wǎng)頁(yè)內容:圖片、音頻、視頻等。
1、 代碼簡(jiǎn)單化
減少代碼冗余,保持簡(jiǎn)潔的代碼風(fēng)格,這是網(wǎng)頁(yè)程序員的要求。如果你能用CSS達到同樣的效果,你應該盡量不要使用js。如果你能用兩行代碼解決這個(gè)問(wèn)題,你就不應該寫(xiě)三行代碼。這是最基本的一點(diǎn)。
2、 減少資源加載
這里提到的資源主要是指JS和CSS文件,因為我知道很多前端開(kāi)發(fā)人員都喜歡使用各種開(kāi)源的特效或者其他人制作的特效,包括引入一個(gè)開(kāi)源的圖標字體庫來(lái)向網(wǎng)站添加幾個(gè)圖標,以及引入幾個(gè)JS和CSS文件來(lái)獲得特效無(wú)形中會(huì )加劇網(wǎng)站“量”。
3、 圖片延遲加載,無(wú)法自動(dòng)播放視頻或音頻
我還記得子帆曾經(jīng)在雷雪博客上寫(xiě)過(guò)一篇文章“圖片懶加載是否會(huì )影響網(wǎng)站的SEO優(yōu)化”,他在文章中談到了如何在不影響網(wǎng)站優(yōu)化的前提下,合理使用圖片懶加載技術(shù)來(lái)提高用戶(hù)體驗,因為懶加載是為了防止圖片被加載頁(yè)面一打開(kāi),就會(huì )占用網(wǎng)絡(luò )帶寬,從而影響網(wǎng)站的打開(kāi)速度以及網(wǎng)站第一屏的要求,非文本圖片就可以懶加載。
圖片是每個(gè)網(wǎng)站的基本組成部分,但是對于做視頻和音頻的網(wǎng)站來(lái)說(shuō),如果你打開(kāi)頁(yè)面,它會(huì )自動(dòng)播放,這占用了網(wǎng)站更多的帶寬資源,所以這也是優(yōu)化網(wǎng)站打開(kāi)速度的一個(gè)小知識。
4、 使用CDN加速靜態(tài)資源
子帆還討論了使用CDN加速是否會(huì )影響網(wǎng)站優(yōu)化。子帆仍然不同意網(wǎng)站整體的CDN加速,但同意網(wǎng)站靜態(tài)資源的CDN加速圖片或緩存優(yōu)化。比如網(wǎng)站JS、CSS、圖片等文件的CDN加速,更有利于整個(gè)網(wǎng)站的加載和打開(kāi)速度。
5、 提高頁(yè)面呈現速度
在頭樣式表中編寫(xiě)CSS樣式,以減少由CSS文件網(wǎng)絡(luò )請求引起的呈現阻塞。
將Java放在文檔末尾,或者使用異步模式加載,以避免JS執行阻塞呈現。
指定非文本元素(如圖片和視頻)的寬度和高度,以避免瀏覽器重畫(huà)。
6、 服務(wù)器自身速度優(yōu)化
啟用數據庫查詢(xún)和頁(yè)面緩存(如果是直接生成靜態(tài)頁(yè)面的網(wǎng)站,可以忽略);
同時(shí)考慮到網(wǎng)絡(luò )安全的重要性,如果您的網(wǎng)站安裝了SSL證書(shū)并啟用了HTTPS協(xié)議,您可以啟用HTTPS/2或spdy,這在一定程度上可以加快網(wǎng)站的打開(kāi)速度。
雖然百度的“閃電算法”是一種移動(dòng)搜索排名算法,而上述所有知識點(diǎn)都是通用的,但是移動(dòng)終端和電腦終端之間有區別,所以也不是很詳細。只是根據自己的想法寫(xiě)了一些很容易出現或忽略的問(wèn)題。雖然句子很簡(jiǎn)單,但它們應該是真正的操作,如果你不懂web代碼或服務(wù)器,操作起來(lái)可能也很困難。