Webサイトを運営していて「altテキスト」という言葉を耳にしたことがある人は多いでしょう。altテキストを正確に記載すると、Webサイトを見に来た利用者の満足度が上がり、サーチエンジンで上位表示されやすいという効果があります。
本記事では、altテキストがもたらすSEO効果や利用者への配慮について解説します。altテキストの正しい書き方とあわせて、ぜひ押さえておきましょう。
altテキストについて
altテキストは、「alt属性」や「代替テキスト」とも呼ばれています。altテキストの目的や役割について、詳しく解説します。
altテキストとは
altテキストとは、Webサイトを構成するHTML上で、画像につけられる代替テキストの属性です。代替を意味する英語「alternative」を省略して「alt（アルト・オルト）」と呼びます。altテキストは、その画像の内容の説明をする役割をもっています。
画像にaltテキストを設定する理由
画像に文字情報を記載する理由は、おおきく3つあります。
以下で詳しく見ていきましょう。
画像が表示されない場合のサポート
altテキストを記載しておくと、たとえば通信状態が悪いなどの理由でWebページの画像の読み込みができなかった場合に、altテキストが代替情報として表示されます。
そのためユーザーは、そこにどのような画像が本来差し込まれていたのかを把握することができます。
補助テキストになる
音声読み上げ機能を利用した場合、画像部分はaltテキストが読み上げられます。そのためaltテキストは、視覚障碍者や高齢者にとっての補助テキストの役割を果たします。表示されている画像の説明を音声で説明してくれるため、画像が見えない人がWebサイトの内容をより理解することに役立ちます。
SEO効果
SEOとは、利用者がサーチエンジンを利用した際にWebサイトを上位に表示させるための施策です。
画像に文字情報を記載すると、サーチエンジンが画像をきちんと判断できるようになります。サーチエンジンに情報が正確に伝われば、情報を知りたい利用者のもとへ適切に届けることが可能となります。利用者に適切な情報を与えられるWebサイトはサーチエンジンからの評価も高まるため、結果としてWebサイトが上位表示されやすくなるのです。
サーチエンジンで上位表示されると、Webサイトに多くの人が訪れるようになります。そのため、Webサイト集客を考えているのであれば、altテキストは取り入れたい施策の一つです。
altテキスト設定時のポイント
ここからはaltテキストを決めるためのポイントを、以下の項目で解説していきます。正確に文字情報を記載し利用者の役に立ちたいと考えている人は、ぜひ参考にしてください。
ポイントを定める
altテキストは長くなりすぎてはいけません。ポイントをひとつに絞るなどし、簡潔にわかりやすくしてください。
たとえば以下の青空の画像について、雲の数や形などを説明する必要はありません。この画像の場合「青空」や「青い空と雲」とだけ説明するのが適切でしょう。特に必要な情報でない場合は極力省きましょう。
関連性のあるキーワードのみを使用する
検索上位になるようにと、欲張ってキーワードを盛り込みすぎないようにしましょう。関連性の薄いキーワードはノイズとなり、利用者が混乱する原因になります。また、過剰なキーワードはサーチエンジンにスパムとして認識されてしまう可能性あります。
関連性のあるキーワードだけを使用し、Webページを読んでくれた人が理解しやすい内容を心がけてください。
意味のない画像には記載しない
たとえば装飾のための画像や背景画像にはaltテキストは必要ありません。Webページを読む上で、わざわざ装飾目的の画像について説明されてもユーザーにとっては邪魔になるだけです。このような画像には、altテキストを記載しないようにしてください。
画像にaltテキストを記載・確認する方法
ここからは実際に画像にaltテキストを設定する方法（Wordpressでサイトを運営している場合）と、その確認方法を解説していきます。
WordPressでのaltテキスト設定方法
ワードプレスでWebサイト運営をしている人向けの設定方法です。ワードプレスで画像にaltテキストを挿入する場合は、メディアライブラリを利用しましょう。
ワードプレスのメニューバーにある「メディアライブラリ」で画像一覧を表示させ、altテキストを設定したい画像を選択します。するとファイルの詳細を設定できる画面になり、「代替テキスト」「タイトル」「説明」などを記載できる編集画面が表示されます。altテキストは「代替テキスト」の欄に記入してください。
googleの検証機能
altテキストの確認をしたいだけならば、Googleの検証機能がおすすめです。Googleの検証機能を使うと、特別なソフトやプラグインなどがなくてもaltテキストを表示できます。
Googleの検証機能の使い方は簡単です。altテキストを見たいWebページの画像上で右クリックをして、「検証」を選択しましょう。すると画面右にコードが表示されます。「alt=”◯◯◯“」とハイライトされている、◯◯◯の部分がaltテキストです。なお、Googleの検証機能は確認ができるのみで、記入や編集はできません。
Chrome拡張機能
chromeの拡張機能「Alt＆Meta viewer」などの無料の拡張機能を使うことによってもaltテキストは確認できます。
Alt＆Meta viewerをブラウザにインストールすると、chromeブラウザの右上に「Alt」の表示が出てきます。この「Alt」をクリックすると、altテキストを簡単に確認できます。
画像にaltテキストがあれば利用しやすくなる
Webサイトに掲載する画像に、altテキストを設定する理由や効果について解説しました。文字情報を記載すると、利用者の役に立つ・サーチエンジンからの評価があがるなどの効果があります。
書き方のコツはあるものの、知ってしまえば難しいことはありません。良い例を参考に、わかりやすいaltテキストを設定しましょう。
プロクルコンテンツは、130種類・2,000名の多種多様な専門家によるコンテンツの制作支援をおこなうプラットフォームです。審査に通過した専門家に記事を執筆/監修してもらうサービスなので、コンバージョン率の向上に繋がる「質の高いコンテンツ」を提供することができます。
また、内部にディレクター/編集者がいるため、専門家との進行・調整、記事の品質担保など、進行に必要な作業はすべてお任せいただけます。社内リソースに不安がある場合や、ワンストップで依頼したい場合などは、WordPressの構築から請け負うことも可能です。
・記事制作がしたいけど、どうやって専門家に記事を書いてもらったらいいかわからない
・テーマに対してどの専門家さんをアサインしたらいいかわからない
・記事制作がしたいけど、どのように体制を作ったらいいかわからない
・記事の質を向上させたい
・リソースがなくてまわらない
・既存の記事に問題がないかが心配なので、監修を入れたい
そんな課題をお持ちでしたら、ぜひ一度プロクルコンテンツを試してみませんか？
