瀏覽網頁的時候，什麼才是最重要的？是充滿資訊的文字麼？沒想到吧，是我圖片噠！在這個快節奏的時代裡，圖片才是碎片化時間中最容易傳遞資訊的存在。因此在網頁中，圖片是不可或缺的存在。然而經常有朋友反應，開啟網頁的時候不顯示圖片，這是為什麼呢？是什麼原因導致了圖片無法載入呢？
圖片不顯示的常見原因
網速問題
如果開啟網頁的時候無法開啟圖片，首先應該檢查的就是網速問題，如果網速太慢或某張圖片提及過大，就會出現圖片載入失敗的情況。
檢查方法：網速過慢自己可有直接感覺，如開啟百度、新浪之類的網站都比較慢，可以的話，可以直接百度搜“網速測試”進行直接線上測試自己的網速。
Flash Player 問題
有的時候開啟網站後，圖片會顯示需要 Flash Player，遇到這種提示後，我們可以點選控制皮膚，雙擊 Flash Player 選項，電腦桌面顯示出了 Flash Player 設定管理器，然後選擇高階，點選立即測試。我們點選瀏覽器右上角的工具。選擇管理載入項，啟用 shockwave flash object，然後點選確定。
Internet 選項設定不當
當瀏覽器過濾了圖片，或者將我們所訪問的網站新增到受限站點，也可能導致圖片無法顯示。我們可以點選瀏覽器工具，點選 Internet 選項，針對第一種情況，我們選擇高階選擇，點選顯示圖片，最後選擇應用，在重新訪問網站就可以了。如果是後一種情況，我們可以選擇安全選項，點選受限站點，刪除受限站點的列表中我們所訪問的網站，最後選擇下應用就好了。
除去重新重新整理訪問外，我們也可以用瀏覽器自帶的抓包工具來看下訪問效果，可以在頁面按 F12 或者在頁面上右鍵點“檢查”，就可以看到開發者工具的內容。
之後開啟 Network 皮膚，該皮膚記錄頁面上每個網路操作的相關資訊，包括詳細的耗時資料、HTTP 請求與響應標頭和 Cookie。
點選資源名稱，可以檢視與資源有關的更多資訊。
可用標籤會因您所選擇資源型別的不同而不同，但下面四個標籤最常見：
-
Headers：與資源關聯的 HTTP 標頭。Headers 標籤可以顯示資源的請求地址、HTTP 方法以及響應狀態程式碼。此外，該標籤還會列出 HTTP 響應和請求標頭、它們的指以及任何查詢字串引數。
-
Preview : JSON、影像和文字資源的預覽。 Preview 標籤會顯示該資源的預覽資訊，也可能不顯示，具體取決於您所選擇資源的型別。
-
Respones : 顯示資源未格式化的 HTTP 響應內容（如果存在）。
-
Timing : 資源請求生命週期的精細分解。
可以在控制檯看下圖片響應的狀態以及響應的時間來判斷不顯示的原因，以便於更快的解決問題。
當然也有一些比較特殊的原因，比如現在非常流行的 WebP 格式的圖片，由於不是所有瀏覽器支援，有時候也會出現圖片不顯示的情況，下面我們來細看下。
瀏覽器不支援WebP
為了減少網際網路上圖片的傳送時間和流量消耗，現在很多網站都選擇了 WebP 格式的圖片。WebP 集合了多種圖片檔案格式的特點。它像 JEPG 一樣適合壓縮照片和其他細節豐富的圖片，像 GIF 一樣可以顯示動態圖片，像 PNG 一樣支援透明影像。同時 WebP 在效能上也比其他格式的圖片更強勁，根據 Google 的測試，WebP 無失真壓縮圖片比 PNG 圖片少了45%的檔案體積。
使用 WebP 確實能給實際應用帶來很多好處，但是因為並非所有瀏覽器都支援 WebP ，比如：IE、Firefox 某些版本等。所以當瀏覽器不支援時，就會出現圖片無法顯示的問題。
面對這種情況，有辦法讓支援 WebP 格式的瀏覽器看 WebP 圖片，不支援 WebP 格式的顯示圖片原格式嗎？
這裡就要介紹下又拍雲的 WebP 自適應功能。
WebP 自適應功能會判斷客戶端瀏覽器是否支援 WebP 解碼，如支援則返回 WebP 格式圖片，否則返回原圖，客戶端以及源站無需任何改動。WebP 自適應開啟方式也非常簡單。只需要在又拍雲後臺點選開啟鍵即可。
