alt機能とは？X・Webでの見方・書き方・設定手順を解説

「Xのタイムラインで『＋ALT』というマークを見た」「投稿画像の左下にALTという文字がある」という方は、まさにこの機能を目にしています。一方で「altタグ 書き方」のように検索してこのページにたどり着いた方は、Web制作・SEO文脈でのalt属性に関する情報を求めているはずです。本ページでは、SNSでの閲覧・投稿手順から、Web制作現場における実務知識までを網羅して伝えます。

alt機能とは？画像の内容を伝える代替テキストの基本

alt機能（alt属性・代替テキスト）とは、画像の内容を文章で説明し、視覚障害者や画像が読み込めない環境の人にも情報を伝える仕組みです。X（旧Twitter）でもWebサイト制作でも、目的は同じで「画像が見えない・見えにくい人に内容を伝える補助テキスト」という位置づけになります。

画像の内容を文字で説明する「代替テキスト」

代替テキストは、画像そのものの代わりに読み上げられたり、画像が非表示のときに画面へ表示されたりする文字情報です。写真・イラスト・スクリーンショットなど、あらゆる画像に対して個別に設定できます。X上では投稿者が任意で追加するオプション機能となっており、設定は必須ではありません。

視覚障害者や音声読み上げ（スクリーンリーダー）での必要性

スクリーンリーダーというのは、画面の文字や情報を音声で読み上げるソフトのことで、視覚に障害のある方が主に利用しています。画像にalt（代替テキスト）が設定されていない場合、スクリーンリーダーは「画像」とだけ読み上げるか、ファイル名をそのまま読み上げてしまい、内容がまったく伝わりません。WHO（世界保健機関）の公表データによると、世界には視覚障害を抱える人が22億人以上いるとされており、alt機能はこうした人たちにとって情報格差を埋める大切な役割を持っています。

alt属性・title属性・キャプション（figcaption）の違い

Web制作の現場では、alt属性のほかに「title属性」や「figcaptionタグ」が同時に使われるケースがあります。それぞれの役割と閲覧対象を理解しておくことで、誤用を防げます。

特に「alt属性」と「title属性」は混同されがちです。title属性はマウスカーソルを合わせたときに小さな黒枠で浮かび上がる補足テキストであり、スマートフォンなどのタッチ操作環境では表示されない場合が多く見られます。アクセシビリティの観点からは、重要な情報はtitle属性ではなくalt属性または本文テキストに記述する運用が推奨されます。

【スマホ・PC】X（旧Twitter）でのALT表示・見方の手順

画像左下に表示される「ALT」または「＋ALT」のバッジをタップ・クリックするだけで、投稿者が設定した説明文を確認できます。スマホ・PCどちらでも操作はシンプルです。

スマホアプリ（iPhone/Android）でALTを見る手順

1. Xアプリのタイムラインで、ALT表記がある画像付き投稿を開く
2. 画像左下（または画像内）に表示された「ALT」の黒いバッジをタップする
3. ポップアップで代替テキストの全文が表示される

iPhone・Androidともに表示の挙動はほぼ同一です。アプリのバージョンが古いとバッジ自体が表示されない場合があるため、その際はストアから最新版へのアップデートを行ってください。

PCブラウザ版でALTを見る手順

1. ブラウザでXにログインし、対象の投稿を表示する
2. 画像左下の「ALT」の文字をクリックする
3. 画像上に説明文がオーバーレイ表示される

PCブラウザからXを利用する手順に不安がある方は、X（Twitter）をブラウザで開く手順でログインまわりの操作を確認できます。

X（旧Twitter）で画像にALT代替テキストを設定・投稿する手順

投稿作成画面で画像を追加した後、画像編集メニューから「ALTを追加」を選ぶと代替テキストを入力できます。スマホ・PCともに投稿前の編集画面で完結する操作です。

スマホアプリからの設定手順

1. 投稿作成画面で画像を添付する
2. 添付した画像をタップし、編集画面を開く
3. 画面左下に表示される「＋ALT」をタップ
4. テキスト入力欄に説明文を記入し「完了」をタップ
5. 投稿ボタンを押して公開する

PCブラウザ版からの設定手順

1. 投稿作成欄で画像をアップロードする
2. 画像上にカーソルを合わせ「編集」または「ALTを追加」をクリック
3. テキストボックスに説明文を入力し「保存」をクリック
4. ポストするボタンで公開する

Xのalt機能を使う際の注意点とスクリーンリーダー利用者への配慮

ALT欄を長文メモやネタバレ隠しに使う投稿が増えていますが、本来の用途と異なるため、スクリーンリーダー利用者に不要な混乱を与える恐れがあります。SNSでの流行と本来の機能目的にはズレがある点を理解しておく必要があります。

長文メモやネタバレ防止目的での誤用と注意点

「詳細はALT参照」といった使い方は、画像本体では書ききれない裏話やネタバレを隠す目的でXユーザーの間に広まりました。遊び心のある使い方として楽しまれている一方、こうした投稿は本来アクセシビリティ目的で用意された機能を、健常者同士のコミュニケーションゲームとして転用している状態と言えます。

実際に「ALTにネタバレ書いておいたのに、友達がスクショだけ保存して後から普通に見てしまった」という体験談もSNS上で散見されます。ALTの内容は画像を保存・転載すると失われるため、隠し場所としての信頼性は高くありません。

スクリーンリーダー利用者への配慮と炎上回避策

視覚障害のある方がALT欄に長い雑談やネタバレ文が延々と読み上げられると、本来知りたかった「画像に何が写っているか」の情報にたどり着けなくなります。過去には、こうした誤用に対して当事者から指摘の声が上がり、投稿が話題になったケースもあります。ALT欄を使う際は、画像の説明と余余談を分けて書く、余談は本文側に書くといった配慮が望ましい対応となります。

Web制作・SEOにおける正しいalt属性の書き方とガイドライン

alt属性は「画像に何が写っているか」を簡潔な文章で伝えるのが基本で、デジタル庁のガイドラインでは80文字程度を目安にすることが推奨されています。SEO目的でキーワードを過剰に詰め込むと、検索エンジンからスパムとみなされ評価を落とす原因になります。

Webサイトのアクセシビリティ向上やSEO対策を根本から学びたい方は、知識を体系的に身につけられるWeb制作・デザインスクール比較や、表示速度とSEO設定に強みを持つ初心者向けレンタルサーバー比較も合わせて確認しておくと役立ちます。

デジタル庁推奨！80文字程度で簡潔に記述するコツ

デジタル庁が公開している『ウェブアクセシビリティ導入ガイドブック』によると、alt属性の文字数に仕様上の上限はないものの、スクリーンリーダーでの聞き取りやすさを考慮して80文字程度にまとめる運用が案内されています。グラフや図表など情報量の多い画像は、alt側に詰め込まず、画像の近くの本文で解説し、altは要約にとどめる記述が推奨されます。

意味を持たない「装飾画像」には空alt（alt=””）を設定する

区切り線や背景装飾など、情報として意味を持たない画像には、あえて空のalt=””を設定するのが正しい実装です。これによりスクリーンリーダーがその画像を読み飛ばし、利用者は本当に必要な情報だけを聞き取れます。空altを付け忘れると、装飾画像のファイル名（例：”banner02.jpg”）がそのまま読み上げられ、かえってノイズになってしまいます。

WebAIM（Web Accessibility in Mind）が実施した「The WebAIM Million」調査によると、トップ100万サイトのうち16.2%の画像でalt属性自体が設定されておらず、設定されている画像のうち10.8%は”image”や”photo01.jpg”といった無意味な記述にとどまっているという結果が出ています。さらに、alt未設定画像の45%がリンク付き画像（バナーやボタンなど）であり、視覚障害のあるユーザーが「どこに飛ぶリンクか分からない」状態になっている点も指摘されています。（出典: WebAIM「The WebAIM Million」調査）

Lighthouseを使ったalt属性チェック手順

自社サイトや制作したページでalt属性の抜け漏れがないか確認するには、Google Chromeに標準搭載されている「Lighthouse」ツールを活用するのが効率的です。

• 手順1：対象のWebページをGoogle Chromeで開き、F12キー（MacはOption + Command + I）を押してデベロッパーツールを起動する
• 手順2：上部タブから「Lighthouse」を選択する
• 手順3：Categoriesで「Accessibility（アクセシビリティ）」にチェックを入れ、「Analyze page load」をクリックする
• 手順4：診断結果の「[image] elements do not have [alt] attributes」という項目にリストアップされた画像を確認し、HTML側でalt属性を追加・修正する

XのALTが表示されない・見られない場合の原因と対処法

ALTバッジが表示されない主な原因は、アプリのバージョンが古い、通信が不安定、あるいは投稿者がそもそも設定していないケースの3つです。順を追って切り分けを行います。

アプリのバージョン更新とキャッシュクリア

• App Store／Google Playでアプリを最新版に更新する
• アプリを一度完全に終了し、再起動する
• それでも改善しない場合はキャッシュの削除を試す（Xのキャッシュを安全に削除する方法で安全な手順を確認できます）

低電力モードや通信制限の確認

• iPhoneの低電力モードをオフにする（画像読み込みが制限される場合があります）
• Wi-Fiとモバイル通信を切り替えて再読み込みする
• ブラウザ版でログインできない・開けない場合はXで画像やALTが表示されない場合の対処法もあわせて参照してください

画像自体が読み込めない・ポストが表示されないという不具合が併発している場合は、ALT機能単体の問題ではない可能性があります。Xのポスト画像が読み込めない原因と対処法から通信環境やアプリの状態を切り分けてみてください。

alt機能に関するよくある質問（FAQ）

X（Twitter）のALTとは何の略ですか？

「Alternative text（代替テキスト）」の略称です。画像が表示されない時や視覚障害者向けの音声読み上げ機能（スクリーンリーダー）で、画像の内容を伝えるためのテキスト機能を指します。

画像につけられたALTテキストは誰でも見られますか？

はい。投稿画像の上に表示される「＋ALT」や「ALT」マークをタップまたはクリックすることで、誰でも記述されたテキストを確認できます。

ALT機能の文字数制限はどれくらいですか？

X（旧Twitter）では最大1,000文字まで入力できます。ただし、音声読み上げの利便性やデジタル庁のガイドラインでは「80文字程度」で要点をまとめる運用が案内されています。

Web制作で装飾画像にもaltを設定する必要がありますか？

装飾目的の画像には空のalt属性（alt=””）を設定するのが正解です。これによりスクリーンリーダーが無意味な画像名を読み上げるのを防ぐことができます。