読者です 読者をやめる 読者になる 読者になる

SEOにも影響する画像の属性タグaltとtitleの違いを知った使い方

 Curious

 

SEOにも影響するというaltとtitleの使い方が
書かれている記事を読みました。

altとtitleはHTMLタグのimgの属性ですが、
正直、alt と title の違いってちゃんと理解してなかったので

画像<img>にくっつける属性。程度の知識しかなく
どう違うんだろね?と、思いつつも
altもtitleもごっちゃになって使ってました(´ω`)トホー

 お蔭でやっと理解が出来ました。

 

alt属性とtitle属性の違いは?

www.b-chan.jp

 

altは画像のように検索エンジンが直接認識できないモノを説明をするために使います。

titleは補助的に説明するために使います。

この区別が理解できていなかったですね。

 

「画像imgにはaltを使うことで検索エンジンに認識される」こと、
「titleは補助的に説明するためのもの」というこの違い。

SEO的にもとても大切な部分だったと分かり、
これまで書いてきた記事のimgタグの属性を確認したくなりました。

 

筆者さんは
ブログのひとつの記事がSEO的によろしくないと
ブログ全体の評価を下げてしまう。ということで、

それまでの膨大な数の記事のこの属性の部分を
ひとつひとつ修正して来られたそうです。

そのおかげか、
検索エンジンからの流入は増えたといいますから
やって見る価値はありそうですね。

 

titleを使うとポップアップで説明が出る。っていうのは
もしも画像が表示されない事態が起きても
ポップアップのテキストでこれは◯◯の画像なんだなと分かるので
img(画像)にはtitleを使うんだと覚えた記憶がありましたけどね。

SEO的には「imgには先ずは alt属性」。

そしてもしも、titleとaltの両方使うんなら、
別のテキスト(キーワード)を入れること。ですね。

記事中に同じキーワードが何度も出現するのは
意図的とみなしてGoogleさん嫌いますもンね。

 

はてなブログで使う画像の問題点

ところが、はてなブログのフォトライフにアップロードして
記事に貼り付けた画像を見ると・・・

属性としてtitleとaltタグの両方が付いていて、

しかも、title以下とalt以下の文字列がまったく同じなんですね。

 

例えば・・・

    f:id:yukinon28:20150227035144j:plain

この画像のHTMLをみると、こんな感じです。

<img class="hatena-fotolife" title="f:id:yukinon28:20150227035144j:plain" src="******" alt="f:id:yukinon28:20150227035144j:plain" />という風に

title属性もalt属性も

 title="f:id:yukinon28:20150227035144j:plain"
 alt="f:id:yukinon28:20150227035144j:plain" と、全く同じです。

 

このことも次の記事に書かれていて、

SEO的に強いと言われているはてなブログにしては
残念な部分となっているようです。

alt属性の内容についても

f:id:yukinon28:20150227035144j:plain

という
英数字の羅列なので、

これで果たして画像の説明といえるの?
検索エンジンが認識できるの?とギモン。

 

www.b-chan.jp

 

こうしたことを踏まえて、
ここでも筆者のB-CHANさんは過去記事をすべて見直し、
alt属性には画像の説明を書くなどの修正作業を行ったそうで、

今では検索からの流入が10倍になったといいます。

 

alt属性とtitle属性のそれぞれの役割。

違いも分かり、スッキリ!
とてもいい勉強になりました。

B-CHANさんありがとうございましたm(_ _)m

 

by カエレバ