屢獲殊榮的英國珠寶商 Queensmith 選擇 imgix 來優化其不斷增長的圖像目錄。借助 imgix，Queensmith 將圖像尺寸平均縮小了 63%，增強了響應式設計，並自動化了以前繁瑣的手動圖像調整大小過程。
客戶
Queensmith提供優質珠寶，例如訂婚戒指和結婚戒指，其製作符合道德規範，價格公道。 Queensmith 憑藉其品質、工藝和客戶服務，在競爭極其激烈的行業中擁有獨特的客戶吸引力。結合無縫的線上體驗，Queensmith 的月收入從 2022 年到 2023 年增長了 50%，越來越多的美國客戶被同等品質的英國珠寶的價格所吸引。
“我們在奢華和便利性之間取得了平衡。讓我們的客戶感覺到他們的珠寶是優質的、定制的，這一點很重要。我們需要與之相匹配的形象體驗。”
- Harry Harrison，網路和 IT 主管以及 Queensmith
挑戰
Queensmith 的網站提供大約 180,000 個 Origin 圖像，每月有 2500 萬個圖像請求。響應式設計是該公司的一個重要目標，因為 66% 的訪問發生在行動裝置上。
在使用 imgix 建立響應式 Web 體驗之前，內容團隊必須手動裁剪每個影像並調整其大小，並建立十幾個變體。這種勞動密集過程仍然無法解決不斷擴展的設備、瀏覽器和頻寬環境組合的艱鉅需求。隨著產品目錄的成長，內容團隊很難滿足影像優化需求。
同時，該公司依賴 Shopify 的原生 CDN，該 CDN 缺乏高級圖像優化功能，並且不支援 AVIF 或 WebP 等下一代圖像格式。
「要求我們的內容團隊為網站上的每張圖像裁剪、生成和上傳許多變體是不可能的。我需要一些能讓我和我的隊友輕鬆完成此過程的東西。這是我晚上睡覺的唯一方法」。
- Harry Harrison，網路和 IT 主管以及 Queensmith
解決方案
當 Queensmith 了解 imgix 的圖像渲染 API 和 CDN 時，團隊很高興看到圖像處理和分發是多麼容易。快速部署、與 AWS S3 的兼容性以及與 CraftCMS 的無縫整合使 imgix 成為理想的選擇。 Queensmith 使用的一些關鍵功能包括：
- auto=format透過自動內容協商確定並以最佳格式提供影像。 AVIF 用於支援它的瀏覽器，因為它是效能最高的影像檔案格式。如果使用者瀏覽器不支援 AVIF 或 WebP，後備邏輯可確保選擇下一個最佳格式。
- W和srcset根據瀏覽器視窗寬度渲染不同大小的影像。
- crop=focalpoint將影像集中在三個座標上：水平 (fp-x)、垂直 (fp-y) 和/或縮放 (fp-z) 值，並從那裡進行裁剪。
“這非常簡單。設定只花了 5 分鐘。它確實有效。”
- Harry Harrison，網路和 IT 主管以及 Queensmith
結果
使用 imgix，Queensmith 將圖像尺寸平均縮小了 63%，確保了快速的頁面加載速度，同時又不影響圖像品質。平均影像反應時間僅 57 毫秒。實施 imgix 為 Queensmith 帶來了多項好處：
- 節省時間：Queensmith 內容團隊現在可以為每個圖像創建一個高解析度版本，並讓 imgix 動態地重新格式化和調整大小以適應不同的用戶環境，而不是進行繁瑣的圖像裁剪和調整大小。
- 易於使用：初始設定只需五分鐘。憑藉直觀的功能和文檔，Queensmith 團隊可以在無需額外支援的情況下進行試驗並進行進一步的調整。
借助 imgix，Queensmith 成功轉變了其圖像流程，確保為客戶提供無縫且響應迅速的體驗。這個易於使用的解決方案不僅簡化了團隊的工作流程，還顯著縮小了影像尺寸，為客戶帶來更快、更愉快的瀏覽體驗。
