Mr_陌陌
我們知道，圖片對於一個網站而言是很重要的頁面元素，如果一個網站沒有任何圖片，那頁面看上去就很單調。但是，如果一個網頁上圖片過多也會影響網頁的加載速度。像現在的商城首頁、圖床類網站因其圖片較多，所以必須要對頁面做一些優化處理，否則網頁加載速度是很慢的。
圖片資源過多為什麼會影響網頁加載速度？
當我們請求了一個頁面後，服務器響應了，瀏覽器拿到服務器端發送過來的頁面文件後會進行解析和渲染。此頁面中的所有靜態資源（如：CSS文件、JavaScript文件、圖片、Flash、音頻、其它文件）都要從遠程服務器下載到本地臨時文件夾中。圖片資源要經歷 請求 >>下載>>渲染>>顯示 這幾個過程，所以圖片資源過多時，下載是需要時間的，自然會影響網頁的最終渲染時間。
另一方面，瀏覽器對於靜態資源請求也是有併發限制的，超過限制數目的請求會被阻塞。所以靜態資源過多的話，排隊下載的資源也較多，看上去網頁加載就顯得很慢。
上圖就是不同瀏覽器的併發請求數限制一覽表。
圖片資源較多的網站如何優化？
對於圖片資源較多的網站、圖床類網站有不少方法可以優化，下面列舉一些常用的優化措施供大家參考下：
1、圖片資源惰性加載
我們只加載當前屏幕可視區域內的圖片即可，如果圖片不在當前屏幕可視範圍之內就不加載，這樣每次加載的圖片數量很少，就加快了網頁的渲染速度，同時也是按需加載。
2、圖片資源使用多個單獨的域名訪問
上面說到了每種瀏覽器都是有併發數限制的，我們將圖片資源分佈在不同的域名部署訪問，這樣可以一定程度上突破同域名下的併發數限制。當然了，域名不是越多越好，建議拿1~3個域名來作為圖片資源專屬域名即可。
3、使用CDN對圖片靜態資源加速
CDN本身就是一種分佈式部署方案，CDN在全國各地各種網絡環境下都部署有節點，能保證用戶“就近讀取”所需的資源，從而加快資源的下載速度。
4、服務器端開啟GZip壓縮
GZip即要服務器端支持又要瀏覽器能支持GZip，好在現在主流的瀏覽器都支持GZip壓縮。GZip號稱能在原文件的基礎上再壓縮50%以上。
5、圖片一定要適當裁剪
經常看到這種極不合理的現象：網頁中某區域明明只需要200x200px的圖片，但是加載的卻是1024x768px 這種超大像素的圖片，像素越大，圖片物理尺寸越大，這樣加載不慢才怪。
所以對於圖片而言，一定要適當裁剪！調用區域需要多大的圖片就加載多大的圖片，通過服務器端完全可以實現圖片的動態裁剪。載剪後的圖片物理尺寸會變小，加載速度會快很多。
網絡圈
圖片優化的技巧不多，主要是細節優化，但是圖片優化的價值不可以忽視，圖片可以展示在首頁快照中、百度的圖片庫、百度識圖都有很好的展現。
1，圖片的尺寸和大小
圖文並茂是百度和用戶喜歡的形式，但運用圖片的時候應注意圖片的大小和尺寸。百度在搜索結果頁展示圖片的時候，百度搜索的展示圖，也就是代碼設定的圖片尺寸，另外圖片的大小，也影響打開速度。
2，圖片清晰度
有時一篇文章的精華就是圖片啦，假如一篇“xx結構圖”的文章，用戶就是想看清楚結構細節，文字再好內容再豐富，如果配圖不清晰的話對用戶的價值大大打折。
3，圖片的alt標籤
圖片優化alt標籤是最基礎的東西了，最基礎的也就越重要，在圖片上傳好之後千萬不要忘了alt標籤。蜘蛛判斷圖片內容就是靠alt，但同時也不建議在alt標籤裡堆砌關鍵詞，用文章標題是個不錯的選擇。
4,圖片的title標籤
對比alt標籤，title被大多數seo遺忘了，實際上筆者認為這個與alt標籤相比同樣重要。如下圖所示，當用戶鼠標停留在圖片上時會顯示文字，這對用戶體驗有很大的幫助，同時也會多出現一次關鍵詞。
SEO圖片優化
5，圖片周圍文字
看上圖，這張圖片下面有個類似版權申明的文字，百度除了參考alt標籤同時也參考周圍文字來猜測圖片是關於什麼的。
6，圖片命名
這一點可能被大多數seoer所忽略，以為圖片上傳到網站就OK了。細節決定成敗，圖片名稱也是有訣竅的。簡單的說是包括關鍵詞對圖片內容信息的簡單描述。
圖片優化重在細節，當然還有排版，網站頁面的基礎優化，內鏈操作。
