はてなブログのレスポンシブテーマ「Rouge」がめっちゃおすすめな件

はてなブログのレスポンシブテーマは「Rouge」一択！

はてなブログレスポンシブ

Rougeがとても気に入った！

はてなブログのデザインを変えたいと考え中の方、レスポンシブテーマなら断然「Rouge」がおすすめです！2015年3月現在、このブログのテーマがまさにRougeです。（Rouge = 赤にも関わらず真っ青なデザインなのですが、こちらはカスタマイズさせて頂きこのようになっています。）ざっと、こんな所がお気に入りポイント。

モバイルでスムーズに、高速で表示される
モバイルで最新記事をアピールできる
PCとモバイルで一括でデザイン変更出来るので楽
アドセンスのクリック率が向上した

こちらではRougeやレスポンシブテーマの利点などを軽くご紹介して行きたいと思います。はてなブログに限らず、ブログのレイアウトやSEOに関心のある方は是非ご一読下さい。

※上記画像参照元 YangChen

はてなブログテーマ「Rouge」が優れているトコロ

そもそもなぜテーマを変更しようと思ったか

僕は以前ずっと「Report」を使っていました。おそらくはてなブログの中で最もメジャーなテーマの一つだと思います。

f:id:thablue19:20141108023729j:plain

「Report」を上記のように色々カスタマイズして、何となくお気に入りのデザインが出来上がったのでしばらくそのまま利用していました。

これはこれで気に入っていたのですが、幾つか気になる点が出てきたのです。

はてなブログのモバイル切り替え、なんだか遅くないか?

モバイルで閲覧する場合、はてなブログはレスポンシブの設定をしなければ自動的にユーザーエージェントでモバイル用のCSSが適用されます。これによりPCのテーマを何にしていても、モバイルでは同じデザインになります。

このモバイル用もシンプルで全く問題の無いデザインではあるのですが、正直表示が遅い様な気がしていました。特に僕のブログは画像も多用していたりするせいもあるかも知れないのですが、特に古いAndroidでは相当時間がかかってしまっていました。

これではユーザーのストレスになる上、アドセンスの表示もかなり遅れがちであったため、せっかくのトラフィックをお金に変える事が出来ません。

レスポンシブにしたら速度が改善された感じがする！

レスポンシブにしたら、速度が改善するだろうか？そう思ってレスポンシブテーマを色々探していた所見つけたのがこのRougeでした。とてもシンプルでカスタマイズしやすく、一発で気に入りました。

はてなブログのテーマ〈Rouge〉 - Wedges.bin

他にも有名なレスポンシブテーマでは「レスポンシブルー」なんかがあると思います。一度試してみたのですが、モバイルで見た時に意図したレイアウトに変化しておらずダメでした。（僕のスマホが少し古いせいだったのかも）

そもそもこのブログ「文化ウェブbeta」は７割以上がモバイルトラフィックで、PCのレイアウト以上にモバイルの見た目に気を使う必要がある、というのもレイアウト変更を考えた理由の一つ。Rougeはモバイルで見た時にも非常に綺麗でした。

レスポンシブにして良かったその他の事

他にも良かったと思う事が色々あります。例えば、はてなブログのデフォルトのモバイル画面では記事下の最新記事の表示が出来ません。以前から「何とかならないかなあ」と思って悩んでいたポイントではあったのですが、これもレスポンシブ表示で一発解決です。PC状態の右カラムがそのまま記事下に移動されて来るため、導線も沢山確保出来ます。今のところ回遊率向上は確認出来ていないですが、これを活かしてもっとPVを増やしていけるのではと期待しています。

また、こちらは大変嬉しい事に、アドセンスのCTRも目に見えて向上しています。まだ変更してから1週間程度ですが、1.5倍位以上といったところでしょうか。表示速度が上がった事によりユーザーにちゃんと目に留めてもらえている事が要因だと考えられます。お金がちょびちょびでも入って来ると、やる気が俄然出てきますね。