【はてなブログ】SEO対策のために画像のalt属性を設定する『はてブロimageTitle』導入してみた結果

どうも、たっつんです！

ハロウィンシーズンな事もあってか、キノピオ仮装自作記事がかなり読まれてて。かなり嬉しいことなんですが

www.subcul-girl.com

検索結果「全て」で見ると上位に表示されてるのに「画像」で見てみると

「あれ…？私のブログ写真１枚もない…」

ほとんど通販サイトの画像がずら～っと並んでて、私のブログの写真が全く載ってない…！

これ、はてなブログだと画像にalt属性がつかないせいなのかなーって気づきまして。

「キノピオの仮装どんなんでやろうかなー」って知りたい人だと記事のほうわざわざ開かずに、画像一覧画面でずら～っと見たりすると思うんよね。

例えば、ファッションアイテム探す時なんかも上位記事を読むよりも画像表示画面から「あ、これいいな〜」と思うものを探して、画像から記事に入っていく…ってやり方で探す人多いんじゃないかなって。（私はかわいい髪型とかアイテムとか探す時大体この探し方）

そもそもalt属性というのは、画像が表示されない時に代替テキストを表示するためのものなんだけど、alt属性を適切に入力していると、検索エンジンにブログ画像の情報を正しく伝える効果があるので、画像検索からの流入も見込めるようになります。

ブログ写真がこの画像一覧に表示されてたらSEO的にも強くなるなーと思って、はてなブログで画像にalt属性（名前）がつけられる機能『はてブロimageTitle』を使ってSEO対策してみました！

気持ち程度のものなので絶対するべき作業じゃないけど、使った結果、検索表示も少し良くなったのでやってて損はないかな〜と思います。

『はてブロimageTitle』って？

『はてブロimageTitle』は、はてなブログで使える画像のalt属性を設定するブラウザ拡張機能です。

こちらのブログで知りました。
www.aritai.net

製作者はすなばいじり(id:psne)さんです。
psn.hatenablog.jp

「はてな記法」
「Markdown記法」
のどちらかを使っているとタグで写真を表示していくので、alt属性を設定出来ないんよねー（見たままモードだとhtml編集から出来るけど）

この『はてブロimageTitle』を使うと、ブログ編集画面から写真タイトルを簡単に設定出来るようになります！

『はてブロimageTitle』のインストール

はてブロimageTitleはブラウザが「Chrome」「Firefox」でのみ使用することが出来ます。

Chrome使っているので、Chromeでのインストール方法と使い方説明していきますね。

まずChromeウェブストアを開いて左上の検索フィールドに『はてブロimageTitle』と入力。

検索で出てきた『はてブロimageTitle』の横にある「Chromeに追加」ボタンをクリックして、インストールします。

すると、追加確認するウィンドウが出てくるので「拡張機能を追加」をクリックします。

正しくインストールされるとブラウザの右上にこんなマークが表示されます。

アイコンをクリックすると設定ボタンなどが表示されます。

インストールが済むとブログ編集画面の写真を投稿の所がこんな感じに変わります。

※インストール時にブログ編集画面を開いてしまっていると、拡張機能が導入されなくなるので、ブログ画面を一度閉じてから開くと使えるようになっていると思います。

『はてブロimageTitle』の設定変更する

使う前にまずひとつだけ設定しておきましょう。

写真にalt属性を記入する時に「変更する」ボタンを一回一回押す必要があるんですが、これがなかなかめんどくさいので、ボタンを押さなくても設定できるように変更します。

ブラウザ右上に表示されているアイコンをクリックするとこういうメニューが開くのでみ緑色の「設定をする」をクリックしましょう。

すると「全般の設定」という画面が開きます。ここにある「変更するボタンを利用して編集する」という所にチェックボタンがあるので、これを外しましょう。

チェックボタンが外れ、設定が更新されました。これで一回ずつ変更するボタンを押さなくても入力できるようになります。行程が一回減って作業がスムーズに出来る様になるので、ここ必ず変更しておきましょう。

それでは、実際にブログ画面で機能を使っていきましょー！

『はてブロimageTitle』の使い方

さて、はてブロimageTitleの使い方ですが、めっちゃ簡単です！

ブログ編集画面で写真を投稿を開くと、タイトル変える欄が出来ています。初期設定のままだと写真を表示する日時の数字が羅列されていて、SEO的には全く意味がありません…。ここに画像に設定したいalt属性を入力していきます。

数字羅列を消してキノピオ仮装の作り方記事だったので「キノピオ仮装」と入力しました。（画像には変更するをクリックと書いてますが、先程の設定変更をしてたら押さなくてOK）

そして下の選択した写真を貼り付けをクリックか、写真をダブルクリックします。

すると、alt属性が挿入された写真が貼り付けられました。

設定ありの写真と設定なしの写真比較。
写真にマウスオンすると「ピノキオ仮装」と表示されるようになりました。

『はてブロimageTitle』導入してみた結果

さて、『はてブロimageTitle』で写真にalt属性をつけた結果、画像検索画面がどのように変化したかチェックしてみました。
導入前はブログ写真が１枚も表示されていなかった検索画面に…

トップではないけど、設定した写真が表示されるようになった〜〜〜！他のは衣装の写真ばかりなので、ここに文字入りアイキャッチ入ってると少しは効果ありそう。

全部Amazonの商品だ…

またスマホだとキーワードによっては、こんな感じで画像がファーストビューにでーんと表示されるので、もしもここに自分のブログ画像が表示されたりしたら、かなり流入もあがるんじゃないかなと思います。

まとめ

以上、SEO対策のために画像のalt属性を設定する『はてブロimageTitle』導入してみた結果でした。
検索が伸びるというのはこれから様子見といったところなんだけど、それでも画像が検索エンジンに認識されないよりは、されていたほうが効果は高いです。

製作者すなばいじりさんの記事で既にわかりやすく書かれているので、操作方法や削除の仕方などは、そちら読んでもらったほうが早いと思います。

本来このalt属性もSEO的にどこまで効果があるのか疑問、というところなので絶対に設定しなきゃダメ！というものではありません。とはいえ、数字羅列のままだとグーグルがクロールする時に「なにこの写真？」と正しく認識してくれないし、設定してやると画像が検索画面に表示されるようになるので、気になる人は一度やってみてもいいんじゃないかなーって思います。

あぁ、過去記事の写真達が…（そっと目をつぶる）