日頃から当ブログisLogをご覧になっていただきありがとうございます。
いよいよ夏のような暑さになってまいりましたが、皆様いかがお過ごしでしょうか。
我が家の猫、大五郎はと言いますと、
![01%e3%81%93%e3%81%ae%e3%82%88%e3%81%86%e3%81%ab%e4%bd%93%e5%85%a8%e4%bd%93%e3%81%a6%e3%82%99%e3%83%86%e3%83%bc%e3%83%95%e3%82%99%e3%83%ab%e3%81%ae%e5%86%b7%e3%82%93%e3%82%84%e3%82%8a%e6%84%9f](https://www.islog.jp/wp-content/uploads/2015/06/19193fdcea9f61c9e9126eaac27aa742.jpg)
このように体全体でテーブルの”冷んやり感”を味わっております。
さてさて、お気付きの方もいらっしゃるかもしれませんが、当ブログは昨日デザインを一新しました。
今回はそのご報告をさせていただきます。
見た目と利便性を考えてデザインを見直し
デザインの見直しと言っても見た目だけの見直しではなく、これまでの運用での印象と解析データを利用して使い勝手と機能についても考えて見直しをしました。
見直した理由についてはいくつか挙げていきます。
記事の増加に比例してカテゴリが増えてきた
当ブログではテーマを絞っていません。
ブログでは記事のテーマを3つ以内にしたほうが良い、つまりテーマを絞ったほうが良いと言う話があります。
そのほうがユーザも求めている情報を近似した別記事に辿り着けるし、SEOにも良い、と。
理屈はわかりますが、僕は絞ったテーマでは記事を書き続けることはできません。
もとい、記事を書くことはできるのかもしれませんが、楽しく書けないと思います。
なのでテーマは絞らず自由に書いています。
テーマを絞らないことで増えていくのは、そう、カテゴリです。
記事それぞれが属しているカテゴリですが、テーマを絞っていないだけにどんどん増えていくんですね。
デザインの一新にあたって、まずはカテゴリの整理をしました。
大カテゴリに子カテゴリが属する形とし、その大カテゴリに必ず記事は属している状態としました。
![02%e5%a4%a7%e3%82%ab%e3%83%86%e3%82%b3%e3%82%99%e3%83%aa%e3%81%ab%e5%ad%90%e3%82%ab%e3%83%86%e3%82%b3%e3%82%99%e3%83%aa%e3%81%8b%e3%82%99%e5%b1%9e%e3%81%99%e3%82%8b%e5%bd%a2%e3%81%a8%e3%81%97%e3%80%81](https://www.islog.jp/wp-content/uploads/2015/06/2b212137c8449ca5c16d1fb1f362006a.png)
また、カテゴリをナビゲーションから選択できるようにし、ユーザが目的のカテゴリにたどり着きやすいように配慮しました。
これまではカテゴリをそこまで意識していなかったのですが、スマートフォンでもカテゴリから検索しやすいようにヘッダーにプルダウンメニューを用意しています。
ランキングへの誘導
記事を読んでいただいた方にとって、当ブログを知っていただくにはランキングがわかりやすいかと思います。
今回の見直しでは思い切ってランキングを大きく打ち出しました。
![03%e3%83%a9%e3%83%b3%e3%82%ad%e3%83%b3%e3%82%af%e3%82%99%e3%81%8b%e3%82%89%e8%a8%98%e4%ba%8b%e3%82%92%e6%8e%a2%e3%81%9b%e3%82%8b%e3%82%88%e3%81%86%e3%81%ab%e3%81%97%e3%81%be%e3%81%97%e3%81%9f%e3%80%82](https://www.islog.jp/wp-content/uploads/2015/06/18976904ac00e95ef94f6271f23b765f.png)
PCビューでは、
- 週間ランキング
- 全体ランキング
- カテゴリ内ランキング
と3つのランキングから記事を探せるようにしました。
ユーザに多く読んでいただいている記事が必然的に良記事となることが多いからです。
また、僕自身がピックアップしたおすすめの記事をトップページに表示するようにしました。(PCビューのみ)
![04%e3%81%be%e3%81%9f%e3%80%81%e5%83%95%e8%87%aa%e8%ba%ab%e3%81%8b%e3%82%99%e3%83%92%e3%82%9a%e3%83%83%e3%82%af%e3%82%a2%e3%83%83%e3%83%95%e3%82%9a%e3%81%97%e3%81%9f%e3%81%8a%e3%81%99%e3%81%99%e3%82%81](https://www.islog.jp/wp-content/uploads/2015/06/cafe8c1418066694f0915e2144d1fe0d.png)
過去に埋もれてしまった記事も読んでいただきたい、そんな気持ちで設置しました。
あとはやっぱり何よりもデザイン
何を言ってもやっぱり見た目は変えたかった。
僕は基本的に飽きっぽいので、何か作った後でもすぐ見た目を変えたくなります。
デザイナーでは無いですが、ウェブ屋としてもそのあたりはこだわっていきたいな、と。
大きな変更点として、とにかく写真を大きく使うようにしました。
過去は、
![05%e3%81%93%e3%81%ae%e3%82%88%e3%81%86%e3%81%aa%e5%bd%a2%e3%81%a6%e3%82%99%e3%81%97%e3%81%9f%e3%81%8b%e3%82%99](https://www.islog.jp/wp-content/uploads/2015/06/75c71f450bce22bbbbc53c5be91a7400.png)
このような形でしたが、
このようにダイナミックに見せるように変更しました。
![06%e3%81%93%e3%81%ae%e3%82%88%e3%81%86%e3%81%ab%e3%82%bf%e3%82%99%e3%82%a4%e3%83%8a%e3%83%9f%e3%83%83%e3%82%af%e3%81%ab%e8%a6%8b%e3%81%9b%e3%82%8b%e3%82%88%e3%81%86%e3%81%ab%e5%a4%89%e6%9b%b4%e3%81%97](https://www.islog.jp/wp-content/uploads/2015/06/d7de7a8a4a4b431d932a7f21fda86363.png)
また、ダイナミックに見せるために横幅も広げてあります。
横幅の選定にはGoogle Analyticsの情報を参考にしました。
![07%e3%82%bf%e3%82%99%e3%82%a4%e3%83%8a%e3%83%9f%e3%83%83%e3%82%af%e3%81%ab%e8%a6%8b%e3%81%9b%e3%82%8b%e3%81%9f%e3%82%81%e3%81%ab%e6%a8%aa%e5%b9%85%e3%82%82%e5%ba%83%e3%81%91%e3%82%99%e3%81%a6%e3%81%82](https://www.islog.jp/wp-content/uploads/2015/06/995719a212b37d665a12928168f952b8.png)
皆様の閲覧環境は解像度が基本的に大きい方が多かったので、思い切って広めのデザインに変更してあります。
これまで写真が小さかった部分も、
![08%e3%81%93%e3%82%8c%e3%81%be%e3%81%a6%e3%82%99%e5%86%99%e7%9c%9f%e3%81%8b%e3%82%99%e5%b0%8f%e3%81%95%e3%81%8b%e3%81%a3%e3%81%9f%e9%83%a8%e5%88%86%e3%82%82](https://www.islog.jp/wp-content/uploads/2015/06/b962f01b32676def00002ca62019a1b9.png)
下記のように一目でわかりやすい形に変更しました。
![09%e4%b8%8b%e8%a8%98%e3%81%ae%e3%82%88%e3%81%86%e3%81%ab%e4%b8%80%e7%9b%ae%e3%81%a6%e3%82%99%e3%82%8f%e3%81%8b%e3%82%8a%e3%82%84%e3%81%99%e3%81%84%e5%bd%a2%e3%81%ab%e5%a4%89%e6%9b%b4%e3%81%97%e3%81%be](https://www.islog.jp/wp-content/uploads/2015/06/3ea6a5e25826a941a2b5d49bb913e270.png)
これからはなお写真に気を使わなければと誓っております。
まとめ
今回は解析の情報を参考にし、ユーザビリティを考えて見直しをしたつもりですが、いかがでしょうか。
次はいつ飽きてしまうかわかりませんが、それまでは今の形で運用していきます。
より良い形はどのようなものかと自問自答しながら、他のブログ・サイトを見て勉強しながら、模索していければと思います。
まだ細かい部分が気になっているので、今後も修正しながら進めさせていただきますよ。
今後とも当ブログをよろしくお願いいたします。
コメント