どうも、たつとら(@tatsutora6) です。
今回は、ずっと考えていた「ブログテーマ」を変更しました。
「半年経過」の記事の時も書いていましたが、元々余り考えずにテーマを設定していたので、今回変更するにあたり思った以上に時間を取られました…(後ほど書きますがグローバルナビの設置に結構時間が取られてしまいました)
「休日の時間がある時にしかできないな」と痛感しましたが…
結果的にブログを立ち上げた際は後々を見越してブログテーマは慎重に選んだ方がいいですね。
今回変更した「ブログテーマ」
今回変更したテーマは「薄グレーなテンプレ」で、
元が「Sentence」
だったので見た目は白基調で余り変わりはありませんが、はてなブログの「薄グレーなテンプレ」のテーマの説明によると
「名前の通り、白と薄グレーを基調としています。ところどころ丸みを帯びたデザインが特徴で、使い勝手がよい仕上がりです。サイドバーやヘッダーに、自分らしいカスタマイズをしたい方におすすめ。」
と、カスタマイズできる事を前提としたテーマみたいですが、ボクがこのテーマに変更した理由は「新着記事」「注目記事」「カテゴリー」などがそれぞれ枠でくくられて単純に見やすいからという理由です。
![それぞれ枠でくくられて単純に見やすいから](https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20190407/20190407230156.png)
他にも、雑記ブログなので記事のジャンルが特定されておらず、いろいろなジャンルにも対応できやすい極力白を基調としたデザインにしようと思いこのテーマに変更しました。
ただ、インストールした人の数は約800と少なく(1番人気の「Minimalism」は約30,000)、カスタマイズに関しては検索しても出てこないので自分でやるしかない所もありますが、逆にカスタマイズの記事にはしやすいのかもしれません。
テーマ変更に関しての注意
ブログテーマ変更の注意については、いろいろな方が書かれているので、ここでは特に取り上げませんがテーマを変更するには今まで設定していた「デザインCSS」や「背景画像」が破棄されるので注意が必要です。
また、テーマ変更の際に「テスト用ブログ」を立ち上げて見え方をチェックしたり、CSSが正しく反映されているかを確認することも必要ですね。
レスポンシブデザインであれば、PCとスマホでも見え方が変わってくるのでスマホでのチェックも重要です。
![](https://foxism.jp/wp-content/uploads/2020/12/20170409042514.png)
スポンサーリンク
「グローバルナビ」の設置
![グローバルナビの設置](https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20190407/20190407221101.jpg)
そして、今回時間がかかったのが「グローバルナビゲーション(通称グローバルナビ)」の設置です。(画像の赤枠部分)
![グローバルナビゲーション(通称グローバルナビ)」の設置](https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20190407/20190407230821.jpg)
いろいろなブログサイトを見ていたら見かけると思いますが、これは訪問したユーザーがページを巡回しやすくする(回遊性をあげる)のと同時にSEO的にも重要であるのでやっと設置することができました。
グローバルナビゲーションの設置は、検索エンジンにとっても非常に重要な要素です。
googleの品質評価ガイドラインでは、主要なコンテンツをメインコンテンツと位置付け、グローバルナビゲーションを含むサイドバーやフッター部分をサブコンテンツとして定義しています。Googleではサブコンテンツによるページ間のナビゲーションのわかりやすさや、使い勝手の良さをサブコンテンツの評価指標としています。
設置には今回はこちらのページを参考に作成しましたが、ボクも手探りで自分なりに試しながら作成したので時間がかかってしました。
![](https://photoshopvip.net/wp-content/uploads/2017/01/100css-menu.jpg)
ナビのメニューは全てブログの記事をカテゴリーごとに分け、今のブログでも設定していますがカテゴリーの下の小カテゴリーをマウスを乗せたら下に出てくる(トグル式)ようにしました。(グルメの小カテゴリーは作りすぎて長くなってしまいましたが…)
![トグル式](https://cdn-ak.f.st-hatena.com/images/fotolife/r/ryurou-shima1126/20190407/20190407231144.jpg)
今回このナビのコードも載せようかと思いましたが、今回は整理がされておらず乱雑で少し手直しするかもしれないので載せません。(キレイにできたら載せるかもしれません)
実際にはてなブログでも「グローバルナビ」の設置の仕方など書いている方もいるので、コードを扱えない方や簡単に済ませたい方はこちらを参考にされてはいかかでしょうか。
![](http://cdn-ak.f.st-hatena.com/images/fotolife/f/ftmaccho/20150622/20150622101904.jpg)
また、はてなブログでは最初からナビがついているテーマもあるのでナビを設置したい人はそちらに変更したら簡単かもしれません。
・ナビが設置されている人気のブログテーマ
最後に
今回テーマ変更と同時に「グローバルナビ」を設置したので、これで上手く読者がブログ内を巡回していただければ、アクセスアップにも繋がり設置した甲斐はあったと思いますが、果たしてどうなりますか。
ただ、やはりブログテーマに関しては安易に決めたりせず、早い段階でしっかりと決めた方が後々変更に手間取らずに済むので、変更する場合も後延ばしにせずブログを始めて早い段階で変更することをお勧めします。
では、また。
▼アフィリエイトを始めるならオススメはこちら
![](https://design-work.tatsublo.net/wp-content/uploads/2023/02/koneta.jpg)
![](https://design-work.tatsublo.net/wp-content/uploads/2023/02/go_top_title.jpg)
![](https://design-work.tatsublo.net/wp-content/uploads/2023/02/Gen-XYZ-consumers-are-the-future-of-conscious-consumerism.jpg)