コミュニケーションBLOG

文字によるコミュニケーションには、ブログをはじめ作文や感想文など様々な場面で「書く」技術が必要になってきます。難しく考えずに気楽に書いてみませんか?

はてなブログのSEO対策強化:画像のalt属性の追加

 alt属性のHTMLタグのイラストにalt属性簡単記述と書いてある画像

 はてなブログ開発ブログで、alt属性が指定できるようになったというお知らせがありました。

このalt属性は「画像検索最適化」に役立ちます。

ページの評価にはあまり影響しませんが、検索エンジンに画像の内容を認識させることと、目の不自由な人が音声読み上げや展示変換した時にわかりやすいこと、画像が表示できない場合にテキストで情報を伝えられる、という重要な役割があります。

一般的にはHTMLで苦労して書いている方が多いと思いますが、このような機能があるとたいへん便利です。

staff.hatenablog.com

【もっと簡単便利なやり方】

 私はこのブログを始めた当初から、こちらの拡張機能をずっと使わせていただいています。画像検索での上位表示にもずいぶん貢献していると実感しています。

psn.hatenablog.jp

この拡張機能では、alt属性だけでなく画像のtitleも個別に指定できるのでとても便利です。タイトルは、ブログの画像にカーソルを乗せると文字で表示されます。

【alt属性を上手に書くコツ】

 alt属性は、簡単にいうと「画像の具体的な説明文」です。

何が表現されている画像なのかを、できるだけ詳しく文章で説明します。

< 例 >

セミロングヘアで白いブラウスの女性がPCに向かって怒っている写真に「どうやって元に戻すの!?」という赤い文字が書いてある画像

ノートンセーフサーチを解除してGoogle検索を復旧する方法 - コミュニケーションBLOG

このアイキャッチ画像のタイトルは、

 『ノートンセーフサーチを解除してGoogle検索を復旧する方法』

このように、ブログのタイトルでもOKです。

 alt属性は、

『セミロングヘアで白いブラウスの女性ががPCに向かって怒っている写真に「どうやって元に戻すの!?」という赤い文字が書いてある画像』

「パキラの鉢植えがある部屋で」まで書いてもよいのですが、長くなるのでこのくらいにしておきました。

要するに、画像を見なくてもそこに何が描かれているのかがわかるような説明を書けばいいのです。

また、そこまで詳しく表現しなくても『PCに向かって激怒している女性」だけでも伝わるでしょう。

注意してほしいのは、あくまでも「文章」であることです。

キーワードの羅列はGoogleでも推奨されていません。

参考▶画像 - Search Console ヘルプ

 【すべての画像にalt属性は必要ない】

あまり意味のない重要ではない画像については、「alt」は空欄でもかまいません。

ただし、空欄であってもalt=" "という記述は必要です。

 

りょうこのつぶやきでした。

では、ごきげんよう。

アイキャッチ画像出典:img要素のalt属性(代替テキスト)の重要性 | ななメモ。