KAZULOG

ジャズについて/読書・映画の感想/趣味の実践記

ブログリニューアルの内容紹介【テーマ変更・SEO・自力でカスタマイズ出来ない時は?】

f:id:kazu0610blog:20170502225543j:plain

ブログ開設1周年を目前に2回目にブログリニューアルを行いました。

 デザインについて、SEOについて、ユーザビリティについて等。

タイトル名変更や、ブログコンセプトの見直しがメインの前回に比べ、今回のリニューアルは過去記事の調整を伴う改修もあったので結構苦労しました(^^;)

また自分では解決できないことも・・・。

リニューアルについて詳細を記事にしたいと思います(^^)/

リニューアルのきっかけ

 

ズバリ、お気に入りのテーマが見つかったからです!

ZENO-TEAL - テーマ ストアというテーマ。

トップ画面はカード型表紙でフラットデザインで・・・。

まるでワードプレスかのようなこのテーマをTwitter情報で知り、一目で気に入りました。

前回のリニューアルの際もテーマについては悩んだのですが結局は決め手に欠け、変更しませんでしたからね(^^;)

www.kazulog.com

お気に入りのテーマが見つかったところで、今まで気になっていた部分を一気に改修してしまおうという運びです(^^;)

今回のリニューアルで行った施策

①アイキャッチ画像をほとんど全て変更した

今回のテーマはカード形式にキレイに並ぶのでせっかくならアイキャッチ画像も仕様に合ったものにしたいと思いました。

ZENO-TEALというテーマは16:9の割合の画像をアイキャッチにするときれいに収まるとのことでアイキャッチ画像を作成し直しました。

 

例えばペン字ブログならこちら

f:id:kazu0610blog:20170427234647j:plain

 

 

映画感想ならこちら

f:id:kazu0610blog:20170425233954j:plain

 

 

ブログ運営ならこちら

f:id:kazu0610blog:20170426113324j:plain

 できるだけカテゴリー別にアイキャッチ画像に統一感を持たせるように留意しました。

ちなみにアイコンのイラストはこちらのサイトから使用させていただいております。

flat-icon-design.com

後はブログのトップ画面がアイコンだらけでもアレですので無料素材の写真や自分で撮った写真などを加工しながら適宜使う予定です。

 

②SEOを意識しh2タグを活用するようにした

SEO的にはhタグは順番に使った方が良いみたいですね。

でも何故かはてなブログでは大見出しがh3タグですよね(^^;)

ググってみてもSEO的にそこまで大きな効果がある訳ではなさそうですので今まで特に意識はしていなかったのですが、ZENO-TEALは何かh3タグから始めるとデザイン的にすわりが悪い感じがして(^^;)

結局はSEOの要素とデザインの要素が加わり、h2タグの使用を決定しました。

shiromatakumi.hatenablog.com

その際にはこちらのプラグインを活用させていただきました。

過去記事は一発変換とは行きませんが、それでもいちいち手動でタグを書き換えるよりも随分、手間が省けます。

今後の記事作成にも役に立つ機能満載で重宝しそうです(^^)

 

③カテゴリーをツリー化した

例えばこちらはジャズについての本の記事です。

www.kazulog.com

 

今まででしたらジャズをキーワードで来てくれた人にも見てほしいし、読書をキーワードできてくれた人にも見てほしい・・・。

そんな欲張りな願いからカテゴリーはジャズ読書の両方を付与していました。

 しかし、一記事に複数のカテゴリーを付与するのはSEO的に良くなく、階層化されたカテゴリー分け、即ちツリー化することはSEOにとっても重要だそうです。

 Googleのクローラーがサイトを見に来る際に階層化されていた方がどんなサイトか理解されやすいとのことです。

 ツリー化とはこんな感じです。

f:id:kazu0610blog:20170501234029j:plain

 すべてのカテゴリーは記載しませんでしたが・・・

先ほどのジャズ本でしたら親カテゴリジャズ内の子カテゴリジャズ映画・本が付与するカテゴリとなります。

こうなると読書をキーワードで来てくれた方にはこの記事は関連表示されませんが・・・

ここはユーザー様をイメージし「ジャズの本」に興味がある方は読書よりジャズをキーワードでくるだろうと想定します。

 ユーザー様を想定しツリー化することでGoogleクローラーだけでなく、人にとっても見やすいサイトとなる訳です。

 こんな感じで今まで欲張っていたカテゴリーを整理しました。

しかし、はてなブログはデフォルトではカテゴリーの階層化はできません(^^;)

はてなブログ界隈ではとても有名なこちらのサイトを参考にさせていただきました。

bulldra.hatenablog.com

 

④ページトップの戻るボタンを設置した

長い記事を読んでいただいた後は便利と思いまして・・・。

nohack-nolife.hatenablog.com

こちらの記事を参照させていただき、配置してみました。

少しでもユーザビリティが良くなればと・・・。

 

⑤トップ画面上部のおすすめ記事と記事下のあわせて読みたい

ZENO-TEALはトップ画面上部におすすめ記事を表示させる機能が実装されてます。

こんな感じです。

f:id:kazu0610blog:20170502213045j:plain

 

 

また実装はまだ一部の記事のみですが記事したにあわせて読みたいを導入しました。

f:id:kazu0610blog:20170502212752j:plain

 

双方ともに回遊率アップの施策です!

検索流入が少しずつ増えてきたので訪問してくれたユーザー様に少しでも他の記事を見て帰ってくれたらな・・・という想いです。

以前のブログリニューアルではサイドバーの関連記事のモジュールを記事下に持ってくるという施策を行いましたがイマイチ効果はなかったようです(^^;)

今回の施策がどの程度、効果があるのか検証していきたいと思います。

こちらのあわせて読みたいの実装はこちらの記事を参考にいたしました。

shiromatakumi.hatenablog.com

 

どうしても自分でカスタマイズできない時は

 

ZENO-TEALではデモサイトの記事で簡単にグローバルナビを実装できる方法の記載があります。

テーマに合ったものが実装できるのでとても良いのですが、ドロップダウンメニューの機能がないシンプルなものです。

スマホで見た際も単純にメニューの幅が縮まるという仕様。

私のような雑記ブログはカテゴリーを絞ってもどうしても多くなるので出来れば

  • PCのドロップダウンメニュー
  • スマホ時のトグルメニュー

を実装したいところ。

www.yukihy.com

上記の記事を参照しながら自分で試行錯誤しましたが・・・。

どうも挙動がおかしい(^^;)

一見、上手くいってるのですがスマホ表示にすると上部のおすすめ記事が消えたりします。

結構がんばりましたが恥ずかしながら自力で解決できず(>_<)

今回は思い切ってココナラの有料サービスを活用することにしました。

coconala.com

ご依頼後はとても迅速に対応していただき、お陰様で思い通りのグローバルナビを実装できました。

最初はブログカスタマイズにお金をかけるのはちょっと・・・。

という気持ちもありましたが長時間、カスタマイズに悩むのなら安価で対応していただけるこのサービスはとても有用と感じました。

カスタマイズも大事ですが時間は有限です。

同じブログにかける時間なら記事作成に時間を割く方が良いかなと(^^)

 

まとめ

今回はテーマ変更を伴うリニューアルだったので過去記事修正とかに思いの他、時間がかかりました(^^;)

ブログの構造に関わるようなリニューアルは早めに対応するにこしたこはないですね(^^;)

今回はカテゴリーの整理など過去記事にも関わる部分もリニューアルしたため、アクセス数にどんな影響が出るのか・・・。

不安な面もありますが、しばらくはこのテーマで少しずつ成長していけるように引き続き頑張りたいと思います(^^)