ShortPixel 評論:如何通過圖像壓縮優化您的網站性能

已發表: 2021-05-19
短像素圖像優化器
關注@Cloudways

自 2014 年以來,已有超過 50 萬用戶嘗試了 ShortPixel 出色的圖像優化。 預見到網絡速度優化在未來的重要性,這家羅馬尼亞公司推出了 ShortPixel Adaptive Images,這是一個非常易於使用的插件,只需點擊幾下即可解決與 GTmetrix 或 Google PageSpeed Insights 報告的圖像相關的所有警告。 這可以提高您的 SEO 和網站的加載速度。

短像素圖像優化器插件

但是插件是如何做到這一切的呢? 讓我們在 Shortpixel Adaptive Images(簡稱SPAI )的詳細評論中找到答案

  • ShortPixel 自適應圖像有什麼作用?
  • ShortPixel 自適應圖像如何工作?
  • 安裝和設置 ShortPixel 自適應圖像
  • 價格和計劃
  • 為什麼要選擇 ShortPixel 圖像優化器?

ShortPixel 自適應圖像有什麼作用?

以下是 ShortPixel 主要做的 4 件事:

  • 它提供來自 CDN 的圖像:ShortPixel Adaptive Images 獲取網站訪問者查看的所有圖像,並從 ShortPixel 的 CDN 提供這些圖像。 什麼是 CDN? 它是一個內容分發網絡。 簡單來說,它是一組分佈在世界各地的服務器,其中包含特定網站的副本。 因此,任何用戶都將擁有良好的加載時間,無論他們位於哪個國家或地區。通過從 ShortPixel 的 CDN 加載圖像,您正在做的是提高頁面的加載速度(因為很可能 CDN 加載速度比平均託管服務提供商,除了在世界各地擁有服務器之外)並從服務器節省一些資源,因為不會從那裡請求圖像,而是從 ShortPixel 的 CDN 請求圖像。
  • 它壓縮圖像:從 ShortPixel CDN 提供的圖像使用 ShortPixel 強大的優化算法進行優化,該算法提供 3 個優化級別,有損、有光澤和無損。 稍後再談。
  • 它提供自適應圖像:這就是插件名稱的來源。 假設您上傳了一張圖片,並將其以全尺寸版本添加到頁面上。 從智能手機訪問頁面的用戶不需要看到與使用筆記本電腦的用戶相同大小的圖像。 該插件負責處理,以設備請求的確切尺寸提供圖像。 您是否曾經使用過 GTmetrix 並收到“正確大小的圖像”錯誤? 它正是在抱怨這一點。 ShortPixel Adaptive Images 只需點擊幾下即可消除該消息!

短像素自適應圖像

  • 它解決了您可能需要的所有與圖像相關的問題:除了壓縮圖像並以正確的尺寸提供它們之外,圖像還可以在許多方面進一步改進。 ShortPixel Adaptive Images 也會處理這個問題,只需點擊幾下,您就可以執行以下操作:
    • 刪除EXIF信息
    • 以 WebP 格式提供圖像
    • 延遲加載圖像
    • 巧妙地裁剪圖像
    • 從延遲加載中排除圖像(用於預加載圖像)

ShortPixel 自適應圖像如何工作?

就像我們解釋的那樣,每次訪問網站的一個頁面時,ShortPixel Adaptive Images (SPAI) 都會分析其代碼,並用大小合適和優化的圖像替換每個未優化的原始圖像。 每個替換的圖像都來自 ShortPixel CDN。

SPAI 不接觸服務器上的任何文件; SPAI 即時優化圖像,這意味著如果您想返回原始圖像,只需停用它們即可。 這是詳細的過程,對所有用戶完全透明:

1. 用戶訪問包含圖像的頁面。

2. 在頁面加載時,SPAI 會查找代碼中的任何圖片 URL,例如:

短像素圖像代碼

3. 檢測到圖像 URL 後,它將該圖像發送到 ShortPixel 的服務器,服務器對其進行優化並將其存儲在 ShortPixel 的 CDN 上。 此步驟僅在第一次請求特定圖像大小時執行。

4. 然後,SPAI 用新的 URL 替換 URL,該 URL 指向包含優化和適當大小圖像的 CDN:

短像素圖像優化器圖像重命名

5. 頁面加載完成,圖片已從 ShortPixel 的快速 CDN 提供!

安裝和設置 ShortPixel 自適應圖像

安裝

這是最簡單的步驟,它像安裝任何其他插件一樣安裝。 這是您需要查找的頁面:ShortPixel Adaptive Images – WordPress.org

設置它

入職嚮導

如果這是您第一次使用 ShortPixel Adaptive Images,您現在將被重定向到 Onboarding Wizard:

短像素安裝

這個 4 步嚮導將幫助您正確配置 SPAI,以便從優化的 CDN 提供所有圖像。

例如,如果您已經在使用 SPAI 並更新到新版本,則可以通過轉到“設置”>“ShortPixel AI”並單擊“幫助”菜單右上角的“設置嚮導”按鈕來重新啟動嚮導:

短像素嚮導

請注意, ShortPixel 自適應圖像不需要 API 密鑰即可開始工作(與 ShortPixel 圖像優化器相反)。 您只需將您的網站/域與您的帳戶相關聯,以便使用您的 ShortPixel 積分,這將由入職嚮導自動完成。

完成入門嚮導後,請務必清除站點的緩存,以便顯示優化的圖像!

設置

ShortPixel Adaptive Images 非常易於使用,因為它在使用 Onboarding Wizard 激活和設置後立即開始發揮其魔力; 無需單擊任何 ON 按鈕或類似按鈕。 但是,SPAI 還提供了一些設置來調整圖像優化。 要訪問,只需登錄您的 WordPress 管理區域並轉到設置 > ShortPixel AI。 我們將介紹最重要的設置,因此我們從“壓縮”選項卡開始。

短像素自適應圖像壓縮選項卡

  • 壓縮級別:在這裡我們可以選擇我們希望圖像具有的壓縮級別。
    • 有損是大多數用戶的最佳選擇。 用有損算法處理的圖像是可以得到的最小的優化圖像。 因此,如果您的網站速度至關重要,並且您希望在優化和圖片質量之間取得最佳平衡,我們建議您使用有損優化。
    • 如果您仍然關心 GTmetrix 或 Google PageSpeed Insights,Glossy 是最佳選擇,但您認為頁面速度的輕微損失是一流圖像質量的可接受妥協。
    • 使用無損,圖像與原始圖像逐像素相同,但與有損或有光澤處理的文件相比,它們提供的尺寸減小更小。 如果您希望圖像保持不變,請選擇此選項。
  • WebP 支持:WebP 格式是由谷歌創建的一種圖像格式,可以在幾乎不損失圖像質量的情況下獲得出色的壓縮結果。 WebP 行為的簡單示例:我們從互聯網上拍了一張照片,並使用隨機的在線 JPG 到 WebP 轉換器,我們從 1.05 MiB 到 344 KiB,減少了 67.93%,並且圖像質量幾乎相同! 因此,通過選中“WebP 支持”選項,我們告訴 SPAI,只要瀏覽器兼容,從 ShortPixel 的 CDN 提供的圖像應該是 .webp 格式。

shortpixel jpg 到 webp 轉換器

  • 刪除 EXIF :該插件允許刪除嵌入在圖像本身中的“額外”信息,例如位置、作者、相機型號等。這些信息通常不是必需的,刪除它有助於減輕圖像的權重一點點。 建議啟用它。

現在我們轉到行為選項卡。 在許多其他調整中,我們可以找到以下內容:

短像素自適應圖像

  • 智能裁剪:插件將識別未顯示所有圖像的情況並相應地裁剪。
  • 已登錄用戶:默認情況下,即使您已登錄,ShortPixel AI 也會提供和優化圖像。但是,如果您想節省一些 CDN 流量和信用,您可以簡單地禁用此選項,然後 SPAI 將僅適用於登錄 -出用戶(訪問者)。
  • LQ 圖像佔位符:LQIP 代表低質量圖像佔位符。 它們是非常低質量的圖像(因此非常輕),將在初始頁面加載時加載,一旦頁面完全加載,它們將被替換為完整質量的圖像。 這有助於增加感知加載時間。

接下來,在區域選項卡中,我們將找到所有類型的設置來告訴 SPAI 應該解析和優化哪些圖像:

  • SVG圖像(這些不會被優化,只存儲在 CDN 上)。
  • CSS 中的圖像 在這種情況下,CSS 文件本身也將存儲在 CDN 上。
  • JS塊中的圖像
  • JSON數據中的圖像

最後,在排除選項卡上,我們找到了一些可以從優化中排除圖像的字段:

  • 排除的選擇器:在這裡我們可以編寫我們希望 SPAI 從優化中排除的 CSS 選擇器。
    • 如果你在“不要延遲加載”中編寫它們,這樣的選擇器不會被延遲加載,但它們仍然會被優化和調整大小。
    • 如果您將它們寫在“不調整大小”中,SPAI 將優化此類圖像但不會調整它們的大小。
    • 如果您將它們寫在“完全離開”中,SPAI 將完全忽略它們,不進行優化或調整大小。
  • 排除的 URL :如果您希望 SPAI 通過 URL 忽略某些圖像,這就是我們排除它們的地方,使用正則表達式(例如排除所有 GIF 或所有 PNG)或路徑(例如排除單個圖像) . 該插件很好地解釋瞭如何使用此字段,請務必查看!

短像素圖像檢查器

完成所有設置後,請務必查看新的圖像檢查器工具,這是一個用於檢查網站任何頁面上優化圖像狀態的簡單工具。 只需在登錄時訪問您的任何頁面; 在工具欄上,您會注意到著名的 ShortPixel 機器人:

單擊該圖標,您將打開圖像檢查器。 每個圖像都會出現一個標籤:“CDN”或“ORIGIN”。 “CDN”表示圖像是從 ShortPixel 的 CDN 優化提供的,“ORIGIN”表示它是從服務器提供的,換句話說,ShortPixel Adaptive Images 沒有處理它。

短像素CDN

此外,光標將變為十字 (⌖),當我們單擊圖像時,我們將獲得其他信息和操作:

短像素優化圖像

價格和計劃

在談論定價之前,我們需要記住 SPAI 是即時工作的。 它僅處理從前端至少查看過一次的圖像。 在此之前,圖像將保持未處理狀態,因此不會花費任何信用。

處理圖像意味著智能裁剪(如果選擇)、調整大小和優化它。 處理完圖像後,它會存儲在 ShortPixel CDN 服務器上,並且可以使用您購買的 CDN 流量配額將其提供給每個人。 只要有足夠的 CDN 流量配額可用,優化的圖像將從 ShortPixel 的 CDN 提供。

ShortPixel 提供轉換為 CDN 配額的積分。 規則很簡單:5 MB CDN 流量 = 1 credit 。 一次性和每月信用都可用於處理圖像。

月度計劃

  • 免費計劃= 100 積分 = 500 MB CDN 流量 = ~500 次訪問/月
  • 4.99 美元/月計劃 = 5,000 積分/月 = 25 GB CDN 流量 = ~25,000 次訪問/月
  • 9.99 美元/月計劃 = 16,000 積分/月 = 80 GB CDN 流量 = ~80,000 次訪問/月
  • 29.99 美元/月計劃 = 55,000 積分/月 = 275 GB CDN 流量 = ~275,000 次訪問/月
  • 99.99 美元/月計劃 = 220,000 積分/月 = 1 TB CDN 流量 = ~1,100,000 次訪問/月

一次性計劃

  • 9.99 美元– 10,000 積分 = 50 GB = ~50,000 次訪問
  • 19.99 美元– 30,000 積分 = 150 GB = ~150,000 次訪問
  • 29.99 美元– 50,000 積分 = 250 GB = ~250,000 次訪問
  • 99 美元– 170,000 積分 = 850 GB = ~850,000 次訪問
  • 249 美元– 500,000 積分 = 5 TB = ~2,500,000 次訪問

示例:假設您擁有一個擁有 5000 多張圖像的中等網站,每月訪問量達到 10,000 次。

每月 4.99 美元的月度計劃將允許 25 GB 的 CDN 流量,根據我們的測試,這意味著每月大約有 25,000 次訪問。

在此處了解有關計劃和定價的更多信息。

這值得麼?

考慮到網站最重要的部分始終是圖像,並且網站加載的每一秒都會導致用戶流失和轉化,這絕對是值得的。 它是一個安裝即忘的插件,如果您想返回原始圖像,您只需卸載它即可。

此外,他們的支持團隊非常出色,數十名用戶可以在 wordpress.org 上對此進行擔保。

這是一個強烈推薦的插件,有助於提高您網站的速度,增加您在 Google 中的位置和訪問者數量。 如果您將其與 Cloudways 等優質託管服務相結合,結果將更加令人興奮。

我們希望這篇對 ShortPixel Adaptive Images 的評論將幫助您使您的網站超快!