Picovert

BigCommerce向け画像圧縮方法:ストアを高速化

Picovert チーム著2026-02-235分で読了

BigCommerceストアの成否は画像パフォーマンスで決まります。商品画像はページの重さに 最も大きく貢献し、大きな画像はストアのCore Web Vitalsを低下させ、SEOランキングを 損ない、モバイルショッパーが商品を見る前に離脱させます。BigCommerce画像を圧縮・ 最適化することは、ストアで行える最高のROI改善の一つです。

BigCommerce画像サイズの推奨事項

  • 商品画像: 1280×1280 pxが商品画像の推奨サイズです。BigCommerceは メイン画像からサムネイルを自動生成するため、高解像度バージョンのみアップロードする 必要があります
  • バナー画像: 全幅バナーは1920×600 pxから1920×800 pxにする必要があります。 レティナディスプレイは2×解像度を使用しますが、ファイルサイズが倍になります — それに応じて圧縮してください
  • カテゴリヘッダー画像: 1280×400 pxから1280×600 pxがカテゴリヘッダーに一般的です
  • ロゴ: デバイスサイズ全体で最高の外観を得るために透明度のある 300〜400 px幅のPNG

BigCommerce画像ファイルサイズ制限

  • 商品画像: 画像あたり最大8 MB(プラットフォームはこの制限まで受け入れますが、 速いローディングのために500 KB未満を目標にする必要があります)
  • バナーと背景画像: ハード制限はありませんが、速いロード時間のために 全幅バナー画像は300 KB未満を目標にしてください
  • 推奨ファイルサイズ: 商品画像100〜400 KB;バナー画像150〜300 KB; サムネイル20〜60 KB

BigCommerceに最適な画像形式

  • WebP: BigCommerce商品画像の最良の選択。WebPは同じ品質でJPGより 25〜35%小さいです。BigCommerceテーマはWebPをネイティブでサポートします
  • JPEG/JPG: すべてのブラウザで信頼できる代替。商品写真には品質80〜85%のJPGを使用してください
  • PNG: グラフィック、ロゴ、透明度が必要な画像に最適。ロゴには透明度のある PNG-24を;フラットカラーグラフィックにはPNG-8を使用してください
  • AVIF: WebPよりもさらに小さいですがサポートが少ない。ターゲット層が 現代的なブラウザのみを使用する場合にセカンダリーオプションとして使用してください

BigCommerce向け画像圧縮方法

  1. 画像リサイズを使用して商品画像を1280×1280 pxに準備します
  2. 画像圧縮を開き商品画像をアップロードします (バッチアップロードをサポート)
  3. JPG画像には品質80〜85%に設定するか、最大圧縮のためWebP出力を使用します
  4. 圧縮された画像をダウンロードし、商品画像マネージャーまたは一括インポートを通じて BigCommerceにアップロードします

SEOのためのBigCommerce画像最適化

BigCommerceは商品画像のalt テキストを設定でき、SEOに不可欠です。alt テキスト以外にも、 画像最適化は複数の方法でSEOに影響します:

  • ページ速度: GoogleのCore Web VitalsにはLCP(Largest Contentful Paint)が 含まれており、これはEコマースページではほぼ常に商品画像です。圧縮された画像は LCPスコアを直接改善します
  • モバイルファーストインデックス: Googleはインデックス作成に主にページの モバイルバージョンを使用します。大きな画像を持つモバイルページはランキングが低くなります。 モバイル最適化インデックスのために商品画像あたり300 KB未満を目標にしてください
  • 画像サイトマップ: BigCommerceは画像サイトマップを自動生成します。 説明的なalt テキストを持つ圧縮された適切な名前の画像はGoogle画像検索に表示されます

既存のBigCommerce画像の処理

既存のストアにすでに大きな最適化されていない画像がある場合、圧縮されたバージョンを 再アップロードする必要があります。BigCommerceはアップロード時に自動的に画像を 圧縮しません。一括最適化するには:

  • 商品カタログをエクスポートしてすべての商品画像URLを特定します
  • BigCommerce CDN URLから各画像をダウンロードします
  • 画像圧縮で一括圧縮します — 複数の画像を一度にアップロードしてZIPとしてダウンロードします
  • 各商品リスティングに圧縮された画像を再アップロードします

BigCommerceテーマ画像設定

BigCommerceのStencilテーマにはテーマ設定に組み込みの画像最適化設定が含まれています。 確認すべき主要設定:

  • 商品画像サイズ: テーマ設定またはPage Builderで設定されます。 不必要なサーバーサイドのリサイズを避けるためにアップロードされた画像解像度を 設定されたサイズに合わせてください
  • 遅延ロード: 初期ページロード速度を改善するためにテーマが フォールド以下の画像にネイティブ遅延ロード(loading="lazy")を 使用していることを確認してください

BigCommerceにアップロードする前に画像圧縮ですべての画像を 圧縮してください — 無料、プライベート、ブラウザで実行されます。最適化された画像は より速くロードされ、より高い順位を獲得し、より多くのショッパーを購入者に転換します。