商品画像のaltテキストの書き方：正面・裏面・細部を説明する実例

alt・商品説明・画像内の文字は別のもの

商品説明には全体の仕様や購入条件を書き、altにはその画像が伝える情報を書きます。画像上に文字を置いても、Webページのalt欄は埋まりません。Shopifyはaltを画像の説明と位置づけ、支援技術でも利用されると案内しています。

写真から分からない素材や性能を推測で足さず、確認できる主体・視点・有用な細部を選びます。検索語を並べた長文は説明になりません。画像にだけ重要な寸法や条件があるなら、通常の商品説明にも同じ情報を用意します。

参照: Shopify：Adding alt text to media ↗

伝える内容から商品画像を整理する →　画像内に見せる文字を入れる場合 →　

4枚の図を8つの文案で比べる

上の線画を使った自作例です。実物の写真や商品の素材を証明する図ではありません。「青いバッグ」という共通部分に、画像ごとに異なる視点と見える情報を加えています。例文をそのまま使う前に、実際の写真と一致するか確かめてください。

書き出し用の小さな表を用意する

画像ファイル名とaltを一対一で保存すると、後から画像だけ交換して説明が古いままになる問題に気づけます。見えないブランド、素材名、収納容量はここで補完しないでください。必要な仕様は確認済みの商品情報へ分けて記録します。

Shopifyに保存して、実際の画像と照合する

Shopifyのデスクトップ管理画面では、商品を開いてメディアを選び、altテキスト追加欄に入力して保存します。スマホアプリではメディアの情報から編集します。画面表記が異なる場合は公式ヘルプで最新の入口を確認してください。

保存後はファイルと説明の対応を再確認します。SokuPhotoで文案を画像に重ねる操作は、この設定を代行しません。altが正しくても、商品自体が見切れた画像は直らないため、構図の問題は元画像側で修正します。

参照: Shopify：Adding alt text to media ↗

1. 画像ごとに主体・視点・細部を一文にする。
2. 実際の媒体設定へ入力し保存する。
3. 交換した画像に古い説明が残っていないか確認する。
4. 支援技術で確認できる環境があれば、読み上げも点検する。