Shopifyストアの商品画像最適化｜サイズ・統一感・表示速度の実践ガイド
楽天やAmazonには主画像の規定がありますが、Shopifyにはありません。自由に作れる反面、規格を自分で決めないままアップし続けると、売り場全体がちぐはぐになっていくのがShopifyの落とし穴です。
この記事では、アパレルを扱うShopifyストアが最初に決めておくべき画像のルールと、転換率・表示速度に効く最適化の手順をまとめます。
まず決めるのは「アスペクト比の統一」
Shopifyのコレクションページ（商品一覧）は、テーマが画像をグリッドに並べます。ここに正方形と縦長が混在すると、行の高さが揃わず、それだけで「整っていないお店」に見えます。
アパレルなら次のどちらかに全商品を統一するのが定石です。
- 正方形（1:1） — 汎用性が高く、SNS転用もしやすい
- 縦長（4:5 または 3:4） — 全身の着用画像が収まりやすく、アパレル向き
どちらが正解かはテーマとの相性次第ですが、重要なのは混ぜないことです。後から全商品を作り直すのは大きなコストになるため、商品数が少ないうちに決めてしまいましょう。
サイズとファイル形式の目安
Shopifyは2048×2048px以上の画像を推奨しており、アップロード上限は5,000×5,000px・20MBです。実務上は次の設定で十分です。
- 長辺2048px前後のJPEG（品質80〜85）でアップロード
- 配信時のWebP変換・端末別のリサイズはShopifyのCDNが自動で行うため、自前での変換は不要
- ズーム機能を活かしたい商品（生地の織りや刺繍が売りの商品）だけ、より大きい元画像を使う
元画像を必要以上に大きくしても見た目は変わらず、管理が重くなるだけです。「大きすぎず、ズームに耐える」のバランスが2048px前後です。
alt属性は検索流入の入り口
画像のalt（代替テキスト）は、Shopifyの管理画面から商品画像ごとに設定できます。空欄のままの店舗が多いのですが、Google画像検索からの流入と、読み上げ環境でのアクセシビリティの両方に効く数少ない設定項目です。
書き方はシンプルで構いません。「ベージュのリネンシャツワンピース 正面着用」のように、色・素材・アイテム名・アングルを含めた1文にします。全画像に機械的に同じ文を入れるのは逆効果なので、アングルや内容の違いを反映させてください。
商品ページの画像構成
1枚目は「その商品が何か」が1秒で伝わる画像にします。アパレルなら着用画像が基本です。2枚目以降でアングルを増やし、試着できない不安を先回りして消していきます。
構成の考え方は多アングル記事で詳しく解説していますが、要点は正面→斜め→背面→ディテールの順に、不安が大きいものから答えていくことです。
白背景の商品単体カットも1枚入れておくと、色や形状の確認用として機能し、後々SNS広告やモール展開への転用も効きます。
表示速度は画像で決まる
商品ページの読み込みで最も重いのはほぼ常に画像です。表示速度はGoogleの評価指標（Core Web Vitals）に含まれ、遅いページは検索順位でもモバイルの離脱率でも不利になります。
Shopify側の自動最適化に任せられる部分は多いものの、次の2点は店舗側の責任範囲です。
- 元画像を無駄に大きくしない（前述の2048px目安）
- 1ページに画像を詰め込みすぎない — 20枚並べるより、選び抜いた8枚のほうが速く、見る側の判断も速い
まとめ
Shopifyの画像最適化は、特別なアプリを入れる前に「アスペクト比の統一」「長辺2048pxのJPEG」「altの記入」「1枚目の着用画像」という基本の徹底でほとんど達成できます。規格を最初に決めて、全商品に同じルールを適用する。これだけで売り場の見え方は変わります。
Sugata Studio なら、商品写真1枚からモデル着用画像を複数アングルで生成できます。アスペクト比や背景を揃えた画像を商品登録のたびに用意できるため、ストア全体の統一感を保ちながら商品数を増やせます。