EC出品者向け画像圧縮
質感、色彩、透明度、ズーム時の細部を維持しながら、マーケットプレイスやストアフロント向けの製品JPEG、PNG、WebP、動画アセットを準備します。
製品ページの読み込みが遅いと、購入者は離脱します。Amazonは出品リストを承認しましたが、ブラウザツールで過度な圧縮を行ったためズーム表示がぼやけています。また、400個のPNG SKUがあり、リリース前に最適化する適切な方法がありません。
製品の詳細はピクセルに宿りますが、使用されないピクセルも帯域幅のコストになります。目標は、ストアフロントが実際に配信する寸法で、一貫性がありズーム可能なカタログメディアを作成することです。
重い製品画像がストアフロントを遅くする理由
カテゴリページ上の大きなPNGやJPEGファイルは、読み込み時間とモバイルでのコンバージョン率を低下させます。マーケットプレイスでは、生のスタジオ書き出しサイズを超えるファイルサイズや寸法の制限も課されています。
高解像度のパックショットやライフスタイル写真は、ストアフロントが配信する寸法を超えることがよくあります。まずリサイズし、ズーム時の細部とチャンネルの派生処理に対して品質を調整します。コレクションページ全体をテストしてください。妥当なファイル20個でも、モバイル環境では重たい体験になる可能性があります。
マーケットプレイスとカスタムショップ向けの画像フォーマット
カタログ作業では複数の出力形式が必要です。
- 画像: 製品、バリエーション、ライフスタイルショット用のPNG、JPEG、WebP、AVIF、HEIC。
- GIF: 広告やメール用の短い製品モーションループ。
- 動画: リスト動画フィールド用のMP4デモや開封動画。
- PDF: 埋め込み写真付きの仕様書や卸売ラインカード。
WebPをShopifyテーマ用に、JPEGをマーケットプレイス用に、1つのバッチで生成できます。
製品の詳細を失わずにカタログ写真を最適化する
質感、ラベルの文字、色彩の正確性は、返品率と信頼性に影響します。ライブの出品画像と置き換える前に、100%ズームでプレビューしてください。白背景のPNGショットは、ライフスタイルのJPEGシーンとは異なる設定が必要な場合があります。
チャンネルごとにプリセットを保存します。Amazon用、Etsy用、DTCサイト用です。
1つのカタログバッチを構成する
SKUごとに1つのフォルダを使用し、ヒーロー、別角度、詳細、スケール、パッケージング、動画のファイル名を予測可能にします。コレクションの処理前にチャンネルの要件を確認し、光沢、質感、暗部、透明素材の代表的な製品でテストします。
マーケットプレイス用と直接販売用のコピーは分けて保管します。マーケットプレイスは白背景とJPEGを要求する一方、ストアフロントはWebPとレスポンシブ幅が適している場合があります。どちらも互いからではなく、承認された現像済みマスターから生成すべきです。
ページ速度とマーケットプレイスのアップロード制限
Shopifyテーマ、Amazonの出品フィールド、Etsyのアップロードは、それぞれ異なる寸法とファイルサイズのルールを適用しています。重いPNGパックショットはカテゴリページの読み込みを遅らせ、購入者がチェックアウトに到達する前にモバイルコンバージョンを低下させます。白背景のPNGショットとライフスタイルのJPEGシーンで処理が異なる場合は、 非可逆圧縮と可逆圧縮 を参照してください。
ストアフロントのパフォーマンスについては、 MacでWeb用画像を最適化する方法 で、チャンネルごとに別のツールチェーンを用意することなく、カテゴリページの読み込みを高速化するためにJPEGマスター とあわせて WebPおよびAVIFバリアントを使用する方法を解説しています。
フォトグラファーのドロップフォルダでのフォルダ監視により、新しいJPEGとPNG書き出しが夜間に自動圧縮されます。これにより、手動バッチを先送りし続ける代わりに、アップロード準備完了の状態で出品日の朝を迎えられます。
カタログアップロード前の製品メディアチェックリスト
カタログの一貫性は、圧縮の検証を容易にします。フルインベントリを処理する前に、光沢面、生地質感、白背景、暗部の詳細、透明素材を含む代表的なSKUでテストします。
- 現在のチャンネル要件(ピクセル寸法、アスペクト比、背景、カラーモード、許可フォーマット)を確認します。
- 圧縮前にクロップとリサイズを行います。すべての出品画像に数千の未使用カメラピクセルを保存しないようにします。
- 写真シーンはJPEGまたはWebPを使用します。透明性や硬いエッジのグラフィックコンテンツに真に必要である場合に限りPNGを維持します。
- 埋め込みカラープロファイルを統一し、コレクショングリッドと詳細ページ間で製品の色がずれないようにします。
- ストアフロントのズームレベルで、質感、エッジ、ラベル、色バリエーションを検査します。
- 中堅クラスのスマートフォンと低速回線で実際のコレクションページを読み込みます。ページエクスペリエンスは、単一のファイルサイズに加えて、画像セット全体、レスポンシブマークアップ、テーマに依存します。
サプライヤーのマスターと現像済みソースは、アップロードディレクトリの外に保管します。配信ファイルはSKU、ビュー、バージョン名で命名し、3番目の画像を置き換えても製品ギャラリー全体の順序が入れ替わらないようにします。
GetCompressがカタログ制作に適している場合
マーケットプレイスのアップローダーや画像エディタは、数枚の製品写真に対応できます。GetCompressは、各リリースで数百のJPEG、PNG、WebP、動画アセットが一貫した寸法と品質を必要とする場合に適しています。バッチプリセットとフォルダ監視により、アップロード前に未公開SKUやサプライヤー素材を含むカタログコピーをローカルで準備します。現像、色彩承認、レスポンシブストアフロントマークアップ、マーケットプレイス検証を置き換えるものではありません。カタログ全体にわたる反復的な書き出し作業を削減します。
- 非可逆圧縮と可逆圧縮JPEG、PNG、MP4、PDF、オーディオの可逆圧縮と非可逆圧縮を理解し、それぞれのワークフローでの使い分け方を学びます。
- MacでWeb用画像を最適化するリサイズを先に行うワークフロー、フォーマット比較、レスポンシブなバリエーション、視覚チェック、そして計測された納品まで。MacでWeb用画像を最適化します。
- Macで画像を圧縮する方法GetCompress、プレビュー、またはsipsを使ってMacで画像を圧縮します。JPGとPNGのリサイズ、HEICの変換を行い、メールやWeb向けにUIの鮮明さを保ちます。
- 写真家向けカラーと有用なディテールを保護しながら、ギャラリー、プローフ、ダウンロード、SNS投稿用のJPEG、PNG、HEIC、TIFF、WebP納品ファイルを作成します。