- alt属性って名前は聞いたことあるけどなんだ??
- alt属性は必要不可欠?
この悩みを答えていきます。
本記事では、alt属性(代替テキスト)に関する知識が0の状態から、基礎知識を理解し、設定する方法ところまでを10 〜 15分程度で解説します。
記事を読み終えると、最適なalt属性(代替テキスト)を設定することが可能になります!
alt属性の基礎知識
alt属性とは、一言でいうと『画像の代わりになるテキストの情報』です。
そのため、代替テキストとも呼ばれることがあります。
主に以下の用途で使われます
- 画像が表示されなかった場合の代わりのテキスト
- 音声読み上げのときに読まれるテキスト
- 検索エンジンのクローラーに適切に理解してもらう
もう少し詳しく説明していきます。
Google公式サイトでは以下のように説明しています。
代替テキスト(画像について説明するテキスト)は、スクリーン リーダーを使用するユーザーや、低帯域幅のネットワークを使用しているユーザーなど、ウェブページの画像を確認できないユーザー向けの補助機能として役立ちます。
Google では、代替テキストに加えて、コンピュータ ビジョン アルゴリズムやページのコンテンツを使用して、画像のテーマを理解します。また、画像の代替テキストは、画像をリンクとして使用する場合にアンカー テキストとして使用できます。
引用元 : Google画像検索に関するおすすめの方法
alt属性のSEO効果
alt属性が検索順位にめちゃくちゃ影響することはないですが、検索エンジンのクローラーが画像の内容を適切に理解する助けにはなること間違いなしです。
対して大変な設定ではないので、alt属性は設定しときましょう。
またSEO対策の効果があるかどうかに関係なく、画像が利用できない環境でも内容を理解することができる記事は読者フレンドリーです。
適当に入力するのは逆効果
alt属性を適当に同一のキーワードや画像の内容とあまりに不一致なものを入力するとGoogleがスパムと判断し逆効果になることがあります。
しかし、これから紹介する『alt属性』の3つのコツを実践すれば問題ないので安心してください。
alt属性(代替テキスト)の設定方法
WordPressなら場合なら記事の編集画面のビジュアルエディタで画像を貼り付け、テキストエディタに変えてください。
画像は、『<img 〜 alt = “” />』で書かれているので、alt = の後のダブルクォーテーション(” “)の中に画像を説明するテキストを入力することでalt属性(代替テキスト)を設定できます。
記事のデザインのための画像や特に意味を持たない画像の場合は、alt属性(代替テキスト)は空白したままで、特に設定する必要はありません。
alt属性(代替テキスト)設定の3つのコツ
ここでは、具体的にalt属性(代替テキスト)の設定に関するコツを三つ紹介していきます。
- 画像と関係のあるテキストを入力
- キーワードを乱用しない
- alt属性(代替テキスト)は文字数をできるだけ抑える
Googleの公式サイトを参考にして紹介します。
代替テキストを設定するときは、キーワードを適切に使用して、ページのコンテンツのコンテキストに沿った、情報に富む、有用なコンテンツを作成するようにしてください。alt 属性にキーワードを羅列すること(キーワードの乱用)は避けてください。これによって、ユーザー エクスペリエンスが低下し、サイトがスパムとみなされる場合があります。
引用元 : Google画像検索に関するおすすめの方法
① 画像と関係のあるテキストを入力
alt属性(代替テキスト)を入力する時は、画像と関係性のあるテキストを入力しましょう。
画像と関係のないテキストは、読者の正しい理解を妨げます。
例えば以下のような画像には、
alt属性(代替テキスト)は
<img src="~~~~.jpg" alt="パソコンの設定で悩んでいる青年"/>
このように基本は、画像の意味が伝わるようなテキストを設定することが一番大切です。
② キーワードを乱用しない
alt属性(代替テキスト)にキーワードを羅列すると、サイトがスパムだと思われてし舞います。
具体例を以下の画像を再び利用して説明します。
この画像に対してキーワードを乱用した以下のようなalt属性(代替テキスト)を設定することは好ましくありません。
<img src="~~~~~.jpg" alt="パソコンの設定 パソコンの設定が難しい 悩んでいる パソコン使いにくい パソコン初心者 プログラミング難しい"/>
正しいalt属性は以下のようにキーワードを乱用せずに簡潔に画像を説明するようなものを設定しましょう。
<img src="~~~~.jpg" alt="パソコンの設定で悩んでいる青年"/>
③ alt属性(代替テキスト)は文字数をできるだけ抑える
検索エンジンやユーザーが理解しやすいようにalt属性(代替テキスト)はなるべく短く簡潔にしましょう。
長すぎる説明文もGoogleからのペナルティの対象になる可能性があります。
基本的には、『画像をひとことで説明する』ことを心がければ問題ありません。
まとめ
alt属性(代替テキスト)を設定する意味を最初に紹介しました。
- 画像が表示されなかった場合の代わりのテキスト
- 音声読み上げのときに読まれるテキスト
- 検索エンジンのクローラーに適切に理解してもらう
その後に具体的にalt属性(代替テキスト)を設定する方法を紹介し、設定方法の三つのコツを紹介しました。
- 画像と関係のあるテキストを入力
- キーワードを乱用しない
- alt属性(代替テキスト)は文字数をできるだけ抑える
適切なalt属性(代替テキスト)を設定することは、Googleから推奨されています。
最短収益化を目指すには、Googleのガイドラインに従うことが必要不可欠です。
alt属性のSEO効果の影響度は明らかではありませんが、Googleが推奨しているなら実践するべきです。
『やれることは全てやる』それが大切です。
ブログを収益化する詳しいプロセスは下記の記事を参考にしてください。
大学生の場合は下記を参考にしてください
ブログの始めたい方へ
本ブログでは、パソコンが苦手な初心者の方でも理解できるようにブログの始め方を詳しく解説しています。
特に、収益化面・デザイン面で優れているWordPressブログの作り方を可能な限り画像を使用して詳しく説明しています(所要時間 : 5〜15分)
スマホを利用してWordPressブログを始めたい方は下記を参考にしてください(スマホだけで全て完了します!!)
ブログの始め方に関する疑問や相談は、本記事のコメント欄または、私のTwitter(努力のガリレオ)にDMをしてください!
\9月30日18時までセール中/