選單

imgix 推出網站圖片處理工具免費方案,每月 1000 張圖片配額無流量限制

imgix 推出網站圖片處理工具免費方案,每月 1000 張圖片配額無流量限制

前陣子我在研究將免費資源網路社群的圖片容量變小,以加速讀者載入網站時間,也減少主機造成的網路流量消耗,當圖片數量一多,很難以手動方式去處理以前的圖片,尤其是不同時期使用不同的圖片格式和解析度,最安全的方法就是透過第三方圖片處理工具直接在雲端進行壓縮(也不會破壞到原始圖片),例如 WordPress 外掛 Jetpack 提供免費圖片 CDN,開啟後會自動替換網站原有的圖片路徑,ImageKitstatically.io 也是同類型服務。

本文要介紹「imgix」是知名的線上圖片處理服務,近期官方部落格宣布全新的定價策略,其中就有真正永久免費的免費方案,使用者可加入兩個來源(Sources)、最多 1,000 張原始圖片處理額度,沒有流量限制,亦可無限制轉換,無需設定信用卡資料。

imgix 免費方案

imgix 免費方案具有完整存取圖片渲染 API 權限、自動圖片最佳化、全新圖片管理工具(Image Manager)、全球 CDN 等等,無論是個人網站或專案計畫都能在購買前測試 imgix 以確認能否滿足需求,目的是為了消除圖片成本的不確定性(這類服務定價都相當高),在需要更高規格方案時也可快速切換升級,服務定價分為月付和年繳價格,年繳有兩個月的免費折扣。

不過 imgix 有個經常被網友提及的問題就是沒有官方 WordPress 外掛(官方建議使用第三方外掛 Media Cloud),這對使用者來說會多一點技術上的門檻,還好現在大多數快取(Cache)外掛都有提供自訂 CDN 路徑功能,只要將 imgix Subdomain 設定為圖片路徑就能取得圖片處理服務帶來的各種好處,包括自適應圖片、更快的頁面載入速度及 SEO

imgix
https://imgix.com/

使用教學

STEP 1

開啟 imgix 網站點選「Sign Up」註冊帳號,註冊時填入 Email、姓名會進入第二個畫面,在這裡需要設定一個組織名稱,網址和電話可以選填,勾選同意使用條款後完成註冊。

imgix 免費方案

接著到 Email 信箱收信、點選信中的確認鏈結,回到 imgix 要求設定一組密碼(或是使用 Google 帳號登入),進入 imgix 控制台主畫面就完成註冊免費方案的流程。

imgix 免費方案

STEP 2

第一次使用時點選「Add a Source」新增一個新的來源,這個來源就是指你的圖片空間,可以是 Amazon S3、Google Cloud Storage、Microsoft Azure Storage 或是一般伺服器,在這裡我使用 WordPress 自架站的圖片加速為例,選擇「Web Folder」做為圖片儲存方式。

第一個步驟先設定一個要使用的 imgix.net 子網域名稱,稍後要做為新的圖片路徑使用,選擇圖片儲存方式後會在最下方詢問使用者的「圖片路徑」,就直接輸入你的 WordPress 網址即可。

imgix 免費方案

STEP 3

返回 imgix 控制台首頁,等待狀態變成「Deployed」就表示已經完成部署。

imgix 免費方案

不過在此之前,先點選 Configuration 右上角「編輯」進入設定選項,從選項裡可以看到你的網站路徑、imgix 提供的圖片路徑(imgix Domain),也可以新增其他路徑或自訂網域名稱。

簡單來說,imgix 會讓 imgix Domain 對應到你的網站網址,透過 imgix 路徑顯示圖片就能在遠端進行裁切、壓縮或是最佳化等操作,也不會影響到使用者的原始圖片資料。

imgix 免費方案

STEP 4

在設定頁面往下捲動,有個「Default Parameters」(預設參數)選項,我習慣在這裡加入 auto 數值,然後在選項後面接上 compress, enhance 兩個參數自動對圖片壓縮、加強效果。

當然這裡可自訂的參數非常多,也能在圖片路徑後面加上參數來單獨對特定圖片進行編輯。

imgix 免費方案

STEP 5

設定就緒後回到 WordPress 控制台,接下來我們要將網站上的圖片路徑替換為 imgix。

一般常見的快取外掛像是 Breeze、WP Rocket 都有內建 CDN 選項,可以自動將網站圖片路徑以其他網址取代,除了快取外掛也能使用 imgix 官方建議的第三方外掛 Media Cloud,不過相較之下功能較多,可能程式部分就會稍嫌龐大一些。

雖然是圖片 CDN 但不僅限於圖片格式,如果遇到 JavaScript 或 CSS 也是可以提供分流加速,但為了讓原始檔案處理額度可以用在真正需要處理的圖片上,還是盡可能限制只讓圖片使用 imgix 進行分流。

imgix 免費方案

從 WordPress 前台查看圖片路徑,會看到已經從原本網址替換為 imgix 網址,這也表示圖片將會在遠端自動化壓縮處理,圖片部分也不會佔用到原始伺服器流量,讓網站載入速度更快,使用者也能更快看到圖片,這就是 imgix 最基本的功能。

imgix 免費方案

STEP 6

imgix 控制台會顯示目前使用的圖片額度、總渲染次數、使用的網路流量、請求數和平均回應時間等等。依照說明,imgix 只有針對圖片數量進行限制,除非在少數極端使用情況下,應該都能維持使用免費方案(若是超出限制,imgix 會主動聯絡通知用戶升級以找出最適合的方案計劃)。

imgix 免費方案

值得一試的三個理由:

  1. imgix 推出永久免費的免費方案,最多 1,000 張原始圖片處理額度
  2. 無需搬移或編輯原始圖片,最佳化工作會在雲端進行
  3. WordPress 使用者可透過外掛 CDN 功能替換圖片路徑
分享本文