写真の代替テキストの書き方：同じ一枚も、使う目的に合わせて

どこに、何のために写真を載せるか決めます

写真日記から一枚選び、別の場所へ載せるときは、その投稿で写真に何を伝えてほしいか一文で書いてみましょう。作業していた机の紹介なのか、物の状態の説明なのかで、必要な情報は変わります。同じ写真を使い直すときも、先に周りの文章を読みます。

代替テキストは、写真を見られない状況でも、その画像が伝える情報を受け取れるようにする説明です。W3Cの画像ガイドや判断フローでも、画像の情報、機能、その場の文脈を合わせて考えています。写っている物をすべて並べるだけでは、目的を果たせないことがあります。

個人のキャプションと、代替テキストの役割を分けます

個人のキャプションには、その日に考えたことや写真の外の記憶を書けます。「今日はこの席で手紙を書き終えた」は記憶を加えますが、カップとノートの位置は伝えません。代替テキストでは、その投稿に必要で、写真から確認できる情報を選びます。

カップを見て「楽しそう」と気持ちを推測するより、色、位置、状態など確認できることを書きましょう。周りの文章がすでに伝えた内容を、必ず繰り返す必要はありません。ただし画像がリンクやボタンとして働く場合は、その機能と目的も反映させます。一般の写真の説明と同じ基準だけで処理しないようにします。

写真と、載せる文脈を読む四つの手順

1. 1

   公開先の本文と画像の役割を確認します。この写真がなければ、読者が何の情報を受け取れないか書いてみます。

2. 2

   写真を直接見て、大切な物、位置、動作、文字を確かめます。見えないことや知らないことを推測で埋めません。

3. 3

   目的に必要な情報を短い文にします。周りの文章との重複、装飾的な細部、抜けた要点を合わせて見直します。

4. 4

   公開するサービスが備える実際の代替テキスト欄へ入力します。保存後、その写真に適用されたか、サービスの確認方法で確かめます。

同じマグカップに、二つの説明の初稿を書きます

次は編集部が文章で作った架空の場面です。開いたノートの右に青いマグカップがあり、持ち手の下の部分に割れ目が見えます。実際の見本写真は提供していません。以下は、この場面説明をもとに書く練習用の初稿です。

作業場所を紹介する初稿：「青いカップがあり、ノートがあり、机が見える」。物は挙がっていますが、ノートとカップの位置関係が曖昧です。投稿の主題が作業場所なら、配置を思い浮かべられる文へ直してみましょう。

カップの状態を説明する初稿：「長く使ってきた、お気に入りのカップ」。これは個人の記憶で、傷んだ状態を伝えていません。この投稿では、どの部分がどう見えるか、写真から確認した情報が必要です。

初稿を直し、目的ごとの代替テキストを仕上げます

作業場所を紹介する完成文：「開いたノートの右に置かれた青いマグカップ」。この文脈では作業場所の配置が大切なので、割れた部分の説明を必ず長く添える必要はありません。

カップの状態を説明する完成文：「青いマグカップの持ち手の下の部分に、割れ目が見える」。状態を説明する投稿では、傷みとその位置が大切なので、ノートより先に伝えます。

二つの文は、同じ架空の写真から違う情報を選んでいます。割れ目があるというだけで、安全に使えるカップか判断したり、この説明を安全検査のように使ったりはしません。実際の写真がこの初稿と異なれば、見える内容に合わせて書き直します。

写真内の文字と、重複する情報の扱いを確かめます

写真の文字が内容の理解に欠かせず、周りの本文にないなら、その文字も伝えます。ノートの題名が投稿の要点なら、読める文言を含められます。隠れた字を想像で補わず、本当に読み取れるか確かめましょう。

周りの文章が画像の情報をすべて伝えていたり、画像が純粋な装飾だったりする場合、ウェブでは空のaltが適切なこともあります。入力欄を放置することと、空の代替テキストを正しく設定することが同じかは、サービスごとに確認します。表やグラフなど複雑な画像では、短い代替テキストに加え、本文の詳しい説明が必要な場合もあります。

ポゲムの草案と、公開先の設定を分けます

ポゲムには写真と手入力の草案を一緒に残し、次の投稿時に参照できます。短いメモ例は「作業場所用：開いたノートの右に置かれた青いマグカップ。状態説明用：青いマグカップの持ち手の下の部分に、割れ目が見える。投稿前に実際の写真と本文を再確認」です。この草案は本文500文字の範囲に収まります。

ポゲムに一般のメモを書いただけで、外部の写真にアクセシビリティの属性が付くわけではありません。実際に公開するサービスの代替テキスト設定へ自分で入力し、保存結果を確認する必要があります。この記事は、ポゲム専用のalt入力欄やスクリーンリーダーの動作を案内する機能説明ではありません。