今回は、SEO対策で避けて通ってはならないAltテキストについて解説します。
一見ただの代替テキストなのですが、その役割は膨大です。きちんと理解して、うまく使いこなしていきましょう。
Googleをはじめとした各種の検索エンジンから、低コストで質の高いトラフィックを多く集めるための方法を解説しています。本講座をご受講頂いて、あなたが選定したキーワードで検索エンジンの検索結果上位にコンテンツを表示させてください。そして、購買意欲の高いユーザーからのトラフィックを多く集めるとともに、購買につながるようにWEBサイトを最適化して、売上を伸ばしてください。
1.Altテキストとは
Altテキストとは、HTMLのimg要素プロパティの一種で、ブラウザなどのトラブルで写真が表示されなかった際に代替として該当部分に表示されるテキストのことです。一般にAltテキスト、Alt属性と呼ばれます。
一般的にシンプルなテキスト文言なのですが、Googleのサイト評価アルゴリズムは、画像とともに書き込まれているかきちんと精査しています。なぜなら、画像がなくても説明(サイト内文章)ができる点で読者フレンドリーだからです。Webページの内容と同等に、読者フレンドリーな点も、評価の対象になります。
つまり、画像を埋め込む際には代替テキストも同時に用意することで、検索結果上位に位置させることが可能なのです。
また、Googleの画像検索でも威力を発揮します。適切に画像の説明がなされていれば、読者の検索に対し有効に反映されるのです。
※ちなみにAltは「オルト」と読みます。
2.SEO(検索結果最適化)の視点からのAltテキスト
はっきり言ってしまいましょう。掲載画像にAltテキストが設定されていなければ、その画像はSEO的になんの意味も持ちません。
せっかく画像を使って、わかりやすく説明するのであれば、Altテキストを設定しない手はないのです。
SEOとは、検索結果最適化のことでGoogleの検索画面において、その結果の上位に自サイトを持ってくることが主眼です。Googleの仕様に基づいて、施策を行うことが、より多くの集客を実現する近道です。
Googleの仕様に従ってWebページを作り上げることができれば、検索結果の上位に表示させることが可能になり、集客数・PV数の向上に役立ち更に多くの読者を獲得できます。
そういった読者層に対し読みやすさや可読性が良好であれば、リピーターになる可能性は高く、他のページも読んでくれる可能性が高まるのです。
3.Altテキストが活躍するシーン
前述の通り、Altテキストがあることで何らかのトラブルで画像が表示できない場合でも、そこにどういった画像が本来置かれているのかを説明することができます。
このトラブルに関してですが、あまり簡単に考えないほうがいいかもしれません。どういったトラブルが考えられるか、以下解説します。
3.1.Webブラウザ
まず、あなたが使っているWebブラウザを想定読者が使っているとは限りません。
パソコン版、スマホ版ともに、限りない数のWebブラウザが存在しています。また、各Webブラウザにもバージョンが設定されていて、これもまた常に最新版が動いているわけではないのです。
あなたの用意した画像の「ファイルタイプ」「ファイルサイズ」「解像度」「色情報」に読者のWebブラウザが対応していなかった場合、すべてのケースで画像は表示されません。
速効!!SEO対策無料チェックリスト39選では、最新のSEO対策に役立つチェックリストが網羅されています。 新しいWEBサイトの運営を開始するたびに、新しいWEBページを作成するたびに、本SEOチェックリストを使用してください。あなたは正しく最新のSEO対策を実践し、検索エンジンから低コストで質の高いトラフィックを多く集めることが出来るようになります。
3.2.通信速度
またスマホ利用の場合、屋外での利用も容易に想定できます。電波の入り具合によっては満足な通信速度を実現できないケースも多々あるでしょう。そういった際は重い画像は表示を回避され、テキスト情報の読み込みに注力します。こういったケースでもあなたの用意した画像は表示されません。
3.3.視覚障害やディスプレイ自体のトラブル
あなたの表示したい画像の色彩を、うまく受け取れないケースや、うまく表現できないケースも多々存在します。人間は、自分の見る世界が他人も同様に見れていると感じがちですが、あながちそうでもないケースも多いのです。
3.4.閲覧サイト最適化技術
Webブラウザの仕様を調整し、可読性を優先し画像を排除して読む読者層もいます。こうした人達に大きな画像というのは欲しいものではなく避けたいものです。Altテキストがあれば、こういったシーンでも、あなたの見せたいものをうまく説明することができます。
Altテキストを用意することで、上述のトラブルの際でも、あなたが何を表現したかったのかを代替テキストで説明できるのです。
4.Altテキストの記述方法
HTML上でのAltテキストの記述方法について解説しましょう。
<img src=”画像のURL” alt=”画像の説明”>
これが基本的なHTML上での記述です。Web上に保管した画像のURLと同列に書いていきます。Wordpressなど各種Webページ作成支援ツールを利用している方であれば、新規作成画面の中で画像を挿入した際に設定項目として「Altテキスト(Alt属性)設定欄」があるはずです。
5.どうAltテキストを設定していくのか
では、掲載画像の代替テキストとして、どのようにAltテキストを記述していけばいいのでしょうか。
5.1.すべての挿入画像に設定する
まず大前提として、すべての掲載画像にAltテキストは設定しましょう。勝手に優先順位をつけ、これには設定してあれには設定しないなどというのはおすすめできません。Googleのアルゴリズムでは等しく同等の画像として処理されるのです。
5.2.簡潔に、しかしうまく説明すること
Altテキストで推奨されるのは、100字以下のテキストです。裏を返せば100字以内で画像に対し詳細な説明ができれば、読者はうまくイメージすることができます。
例:コーヒーを飲む人
これは説明にはなっていますがその人そのものの記述であり「背景」「時間」「季節」「場所」といった情報が皆無です。
例:ベランダにたたずみ、寒い中コーヒーを飲みながら日の出を眺め、恋人からのメッセージを心待ちにする男性
こう記述することで、場所・季節・時間帯・背景がクリアになってきます。
負担に感じますか?いえ、そこまでかしこまって書かなくてもいいのです。本文に文体を合わせる必要もありません。大事なのは、各掲載画像にもれなく設定することと、1単語だけではなく背景や場所も意識して書くことです。
5.3.画像の説明に注力する
SEOを意識すると、とかくキーワードやホットワードを入れたくなります。
しかしAltテキストにそういった情報を盛り込んでもGoogleからは「過剰」と判定されることになり、設定する意味がなくなってしまいます。
速効!!SEO対策無料チェックリスト39選では、最新のSEO対策に役立つチェックリストが網羅されています。 新しいWEBサイトの運営を開始するたびに、新しいWEBページを作成するたびに、本SEOチェックリストを使用してください。あなたは正しく最新のSEO対策を実践し、検索エンジンから低コストで質の高いトラフィックを多く集めることが出来るようになります。
5.4.あなた自身の文章で記述する
Googleはこういった箇所でも「コピペ」を意識します。
他サイトからの引用は厳禁。ご自身で直接書くことが大事です。
6.注意点
・Altテキスト(Alt属性)とTitle属性を混同しないようにしましょう。
Alt属性は、あくまでも画像の代替テキストです。対してTitle属性は、画像の上にマウスカーソルを載せることで出てくるツールチップのテキストとして利用できます。
ウェブの標準化団体、W3C(World Wide Web Consortium)でもAltテキストは厳密に規定されていて、「画像タイトルではなく、画像前後の文章がシームレスに繋がるような、説明文を挿入すること」と推奨されています。
・フォームの送信ボタンなどに使う画像でも(input要素:クリックやタップをすると来訪者の記載事項の確定ページに遷移するもの)Altテキストの設定が必須です。
送信ボタンであれば「送信する」などと逐次設定しましょう。
・Altテキストにおいて、文字の羅列は厳禁です。
文章で設定しましょう。でないとスパム認定されてしまいます。AltテキストのチェックツールもGoopgle製ブラウザChromeのエクステンションなどで広く公開されています。そういったツールで、チェックしてみることも大事なステップです。
7.まとめ
今回は、Webサイトやブログ構築上の思わぬ伏兵、Altテキストについて解説しました。
一見スルーしがちな代替テキストですが、きちんと整備することでユーザーフレンドリーな側面はもとより、SEO対策としてもきちんと仕事をしてくれます。
ぜひ注目して、今後のサイト運営に活用してみてはいかがでしょうか。
AutoPilotAcademyでは、Altテキスト以外にもSEOの効果的な施策についの講座を取り扱っています。ぜひご活用ください。
Googleをはじめとした各種の検索エンジンから、低コストで質の高いトラフィックを多く集めるための方法を解説しています。本講座をご受講頂いて、あなたが選定したキーワードで検索エンジンの検索結果上位にコンテンツを表示させてください。そして、購買意欲の高いユーザーからのトラフィックを多く集めるとともに、購買につながるようにWEBサイトを最適化して、売上を伸ばしてください。
執筆者:AutoPilotAcademy編集部
AutoPilotAcademy[オートパイロットアカデミー]は見込み顧客獲得と成約率向上のための最善の方法をお教えしています。
ネットを使って顧客との強固な関係を構築することができるようになり、小さな企業でも大きな成長を実現することができます。
監修者:小池英樹
AutoPilotAcademy[オートパイロットアカデミー] CEO 小池英樹 新潟市のマーケター(36歳)。新潟県新潟市生まれ、新潟市育ち、上智大学卒。 2011年にRutuboを設立、カネなし、コネなし、ノウハウなしの状況から独立。ヨドバシカメラで購入したホームページ作成ツール「Bind」を手元に事業開始。 顧客ゼロ・無収入の状態から販売促進を学び、中小企業300社以上のオンライン集客支援に携わる。顧客は日本全国及びに海外で活躍する日系企業に及ぶ。 顧客企業の集客支援も手掛ける傍ら、AutoPilotAcademyでは、培ってきた集客のノウハウを伝えている。 顧客獲得に苦心するスモールビジネスオーナーのためのオンライン集客のバイブルを作ることを目標としている。