我很習慣在寫文章插入圖片前先對螢幕擷圖進行壓縮,讓圖片容量更小、開啟速度更快,更重要的是幾乎不會影響畫質,以前我都使用 TinyPNG 和 TinyJPG 這兩個相片壓縮工具,只要將圖片拖曳到網站就能快速處理,後來就選擇以 Imagify 自動從 WordPress 媒體庫對圖片壓縮和最佳化(免費版每月只能處理 20 MB 相片),如果想要在處理圖片後整合 CDN 提高圖片載入速度可試試看以下服務:
最佳化
Cloudflare Images 雲端圖片儲存、尺寸調整,每月 5 美元可存 10 萬張
今年九月 Cloudflare 宣布正式推出「Cloudflare Images」圖片儲存服務,乍看之下好像只是一個付費的圖片空間,影像儲存僅是這個項目的其中一個功能,它還兼具調整圖片大小、最佳化等技術,而且整合全世界所有 Cloudflare 網路節點,將影像基礎架構變得更為簡單,易於管理或是預測價格,無論是線上零售、創作者平台或是內容傳遞都很適合使用。
LINE 分享連結網站縮圖標題錯誤、無法顯示?PagePoker 可強制更新
當使用者將網址複製、貼上 LINE 時會在對話視窗顯示網頁標題、描述和縮圖,這些資訊是從頁面的 Open Graph 標籤抓取而來,簡單來說,網頁開發者會透過 Open Graph 標籤指定網站標題、說明、固定網址、語言和圖片鏈結等資訊,讓搜尋引擎、社群網站或即時通訊軟體使用這段內容來呈現出預覽效果,因此完善 Open Graph 標籤資訊很重要,有助於讓網頁在各種平台顯示正確資訊。
TinyPNG 中文版免費線上圖片壓縮,單次最多 20 張
曾經有一段時期我很喜歡 TinyPNG 線上圖片壓縮工具,只要將 PNG 圖片拖曳到網站,它會自動遠端對圖片壓縮、最佳化,將圖片檔案大幅縮小,但又不會影響畫質(也就是無損壓縮),後來也推出 TinyJPG 支援 JPG 格式,還有 WordPress 適用的外掛功能「Compress JPEG & PNG images」,可以在上傳圖片時自動進行最佳化。
imgix 推出網站圖片處理工具免費方案,每月 1000 張圖片配額無流量限制
前陣子我在研究將免費資源網路社群的圖片容量變小,以加速讀者載入網站時間,也減少主機造成的網路流量消耗,當圖片數量一多,很難以手動方式去處理以前的圖片,尤其是不同時期使用不同的圖片格式和解析度,最安全的方法就是透過第三方圖片處理工具直接在雲端進行壓縮(也不會破壞到原始圖片),例如 WordPress 外掛 Jetpack 提供免費圖片 CDN,開啟後會自動替換網站原有的圖片路徑,ImageKit 和 statically.io 也是同類型服務。
statically.io 免費 CDN 提供網站加速和圖片最佳化功能,無流量速度限制
如果你是網站管理者就會遇到要如何改善網站載入速度的問題,這在流量不大時可能沒什麼影響,只要網站到達一定規模就需要透過內容傳遞網路(Content Delivery Network)改善整體的速度。最知名的 CDN 服務 Cloudflare 讓整體網站都具備加速、安全性防護及分流等效果,算是一個兼具多種優勢的解決方案;如果你是使用 WordPress 架站,也可考慮開啟免費的 Jetpack 圖片 CDN 和 Asset CDN 為網站獲得更快的瀏覽速度。
ImageKit 圖片最佳化服務,為 WordPress 加入圖片壓縮和分流加速功能
前陣子在研究圖片最佳化(Image Optimization)服務,兼具加速分流的內容傳遞網路,對於網站管理者來說,如何將圖片容量變小、但又維持畫質不變確實是個很困難的問題,未來搜尋引擎 Google 會將「網站使用體驗核心指標」(Core Web Vitals)做為搜尋排序的參考因素之一,因此更需要重視網站載入速度。如果你的網站有不少圖片,可以開始研究要怎麼幫這些圖片瘦身減肥,讓訪客有更好的開啟速度,也能降低網頁伺服器的流量消耗。
PurePhotos 線上相片去背工具,內建相片校正最佳化可輸出 PSD 圖層
如果要將相片中的人物、物品或任何主題取出,通常會使用去除背景方式達成,然而去背並不如想像中那麼簡單,也因此近年出現很多很強大的「免費去背工具」。現今的圖片去背服務多半是仰賴 AI 人工智慧和機器學習技術,使用者無需進行任何操作就能自動辨識出相片的主體和背景範圍,舉例來說像是 BackgroundCut、Photoshop Express 和 AI Background Remover 等等,在移除背景後除了轉為透明色,有些還能加入模糊效果或是特定背景顏色。
Squoosh Desktop App 桌面版圖片壓縮工具,開放原始碼沒有網路連線也可用
兩年前介紹過 Google 開發的免費圖片壓縮工具「Squoosh」,這是功能非常強大的線上圖片最佳化服務,整合各種常見圖片編碼解碼器,能在瀏覽器中對相片進行自訂調整,在分隔畫面即時比較原圖和壓縮後、或是使用不同壓縮技術造成的細節差異。我以前經常使用 TinyJPG 壓縮圖片,可以有效減少檔案大小,還能維持圖片畫質,後來在網站開啟 Jetpack CDN 直接替換圖片網址就有整合加速、分流和壓縮圖片效果。
Jetpack Boost 改善 WordPress 網站效能和搜尋引擎最佳化外掛程式
如果你是使用 WordPress 自行架站(Self-hosted),我一定會推薦安裝 Jetpack 外掛,這是由 Automattic(WordPress 公司)開發的外掛,整合相當多功能模組,而且也有非常好的相容和穩定性,兼具安全及速度,像是之前我介紹過的 Jetpack 免費 CDN 可自動加速、分流網站的圖片(以前叫做 Photon CDN),或是 Asset CDN 為 WordPress 核心檔案分流加速都能提升網站速度。如果資料非常重要也可選擇 VaultPress 即時完整備份網站。