Shopifyで画像alt未設定の商品を洗い出す方法
公開日:
altテキスト（代替テキスト）は、画像の内容を言葉で説明するテキストです。スクリーンリーダーを使う方への案内になるほか、Google画像検索が画像の内容を理解する手がかりにもなります。Shopifyでは商品画像1枚ごとに設定できますが、未設定でも警告は出ないため、「気づいたら大半の画像が空欄だった」ということが起こりがちです。
この記事では、alt未設定の画像を洗い出して埋めていく方法を3つ紹介します。
方法1: 管理画面で1商品ずつ確認・設定する（標準機能）
altの設定自体は標準機能でできます。
- 「商品管理」から商品を開きます。
- 「メディア」欄の画像をクリックして拡大表示します。
- 「代替テキストを追加」（設定済みの場合は「代替テキストを編集」）をクリックし、入力して保存します。
書く内容は「画像に何が写っているか」の簡潔な説明です。例えば「コットンTシャツ 白 背面」のように、商品名＋色・アングル程度で十分です。検索キーワードの詰め込みは、スクリーンリーダー利用者にとって邪魔になるうえ、SEO上のプラスもないため避けてください。
この方法の問題は、「どの画像が未設定か」を一覧する画面がないことです。商品を1つずつ開いて確認するしかないため、洗い出しには向きません。
方法2: CSVエクスポートで未設定の画像を洗い出す
未設定の一覧づくりはCSVで行います。
- 「商品管理」右上の「エクスポート」→「すべての商品」「CSVファイル」でエクスポートします。
- Googleスプレッドシートの「ファイル」→「インポート」で読み込みます。
- 1行目の見出しから「Image Src」（画像URL）と「Image Alt Text」の列を探します。商品CSVは画像1枚につき1行なので、この2列を見れば画像単位でチェックできます。
洗い出しは、「データ」→「フィルタを作成」で次の2条件を設定するのが簡単です。
- Image Src列: 「空白以外」（画像がある行だけに絞る）
- Image Alt Text列: 「空白」（altが未設定の行だけに絞る）
残った行が「画像はあるのにaltがない」行です。Image Src列がA列より右のX列、Image Alt TextがY列にある場合、対象商品のHandle一覧を数式で出すこともできます（列は手元のCSVの見出しで読み替えてください）。
=UNIQUE(FILTER(A2:A, X2:X<>"", Y2:Y=""))修正は2通りあります。件数が少なければ、一覧を見ながら方法1の手順で管理画面から入力するのが安全です。件数が多い場合は、CSVのImage Alt Text列に直接入力し、「商品管理」→「インポート」で「同じハンドルの既存の商品を上書きする」にチェックを入れて書き戻すこともできます。インポートは列を削除したCSVを読み込むとデータが消える恐れがあるため、書き戻す前にエクスポートしたままのファイルを残しておいてください。
なお、この結果もエクスポート時点のスナップショットです。商品や画像を追加すれば、また未設定の画像が増えていきます。
方法3: アプリで継続的にチェックする
画像の追加が続くストアでは、チェック専用のアプリを使う選択肢があります。私たちが開発している「商品データチェッカー」は、管理画面からストア内の全商品をスキャンして、alt未設定の画像をSKU重複などの他の不備とあわせて一覧で確認できます。CSVを書き出さずに何度でも再チェックできるため、「月末に見て、増えた分だけ直す」運用ができます。
まとめ
- altの入力自体は方法1の管理画面操作でできます。書くのは画像の簡潔な説明で十分です。
- 未設定の洗い出しは方法2のCSV＋フィルタで。まず現状の未設定件数を数えるところから始めてください。
- 画像が増え続けるストアで定期チェックしたい場合は、方法3のアプリが向いています。