どうも、事後報告となりますがブログのデザインを変更いたしました。理由といたしましては、カードデザインに飽きた（他のいろいろなところがやっているため）、子テーマで作成してなかった、ページスピードが遅いなどあげたらきりがありません。
その際にWEB歴1年未満の僕なりに気をつけたポイントをシェアしたいと思います。
1.デザインの方向性
これはブログに限った話ではないですがやはりここが一番肝心なところでないでしょうか。「誰に向けてのブログか」というところがぶれていたり定まっていなかったりするとデザインの方向性や記事の方向性が揃わずちぐはぐなブログになってしまいます。
このブログは僕のような経験がWEBの浅い人に（主にフロントエンド）向けて書いています。というより僕が役に立つものを書けると言ったらそれくらいかバンクーバーの美味しいラーメン屋くらいしかないので必然的に前者になりました。後者の重要がある場合は後者の方を書きます。
主にフロントエンドの方向けなのでデザインよりかは技術にフォーカスしている人がターゲットになります。ですので斬新でお洒落なデザインよりかはシンプルで要素の配置がわかりやすく、綺麗に整っているという方向性にしました。目立った要素はないんだけど、どこに何があるかわかりやすいデザインです。
どこに何があるかわかない時のイライラを感じさせるを避けるために、よくあるブログの構成からは大きく外れることはしていません。MacユーザーがWindowsを使った時（逆も然り）のあのなんとも言えない気持ちを味わってほしくはないので。
2.メニューの位置
ほとんどのWEBサイト及びブログのメニューは上部にあると思います。そちらの方が人間の視線の動きの特性上目につきやすいですし、よくある構成ですのでユーザーも「メニューは上」と思い込む人が大半でしょう。
上記でブログの構成から大きく外れないと言っている僕がそれでも横にメニューを配置した理由は、ファーストビューでの記事が見える割合とアイコンと文字を使用したメニューにしたかったからです。もう少し掘り下げて話しますと、
・ファーストビューでの記事が見える割合
メニューを上部にした場合、必然的に記事一覧はメニューの下に追いやられます。さらにメニュー以外にもヘッダーに画像やブログのタイトル、キャプションなどのセクションがある場合ファーストビューで見える記事はさらに少なくなります。
この現象を避けるためにメニューを横に配置し、サイトタイトルはロゴのみ、説明はなしとすることでファーストビューでの記事の見える割合がかなり大きくなりました。サイトの説明はあった方がいいんじゃない？と思われる方もいますが、このブログのターゲットはWEBの知識は大なり小なりある方を想定しているのでメニューの内容（アイコンと文字）、記事のタイトルをファーストビューで見るだけでサイトの内容はわかると考え省きました。
・アイコンと文字を使用したメニュー
メニューを作る際、文字のみ、アイコンのみ、アイコン+文字、画像などの選択肢があると思いますがアイコン+文字が一番認識されやすくFacebook,Twitterなどのアプリもアイコン+文字でのメニューを使用しています。
3.外部スクリプトの読み込み
ページが遅くなる原因としてFacebookページやInstagramなど外部からのデータを読み込むものは時間がかかります。ですのでFacebook、Twitterは表示させずにリンクのみでの表記にしました。そもそもこのブログの性質上Facebookページを設置してもあまりいいね！を稼げないし、そのためにページスピードを犠牲にはしたくなかったのでリンクのみという判断をしました。
あと、SNSに力を注ぐ時間がないためあまり見せられたものではないのも理由の一つです。
4.プラグインの選定
こちらもページスピードに関する問題なのですが、プラグインを多く使用するとその分ページスピードは遅くなります。ですのであまり意識せずプラグインを使用していると、いつのまにかかなりの量を使用しているなんてことになります。
・そもそもその機能は本当にいるのか
・その方法以外にないのか
・自分で実装できないのか
というポイントを考えてからプラグインを入れるようにしています。すべてのプラグインが重いと言っているわけではないので一度いれて試してみて、影響が全然ないようでしたら使用した方がいいと思います。（特に初心者の方が実装すると時間がかかるので）
4.広告
広告は以前までTOPページにも配置していたのですが、こちらは撤去。記事内にGoogle Adsenseを3つ表示する方法を取っています。記事サムネイルのしたに横長バナーを一つ。記事終わりにレクタングルを2つ並べて表示しています。サイドバーに表示することも考えましたが、貴重な3つという枠を記事内に使わないことに疑問を感じたためサイドバーへの配置はやめました。まだ、変更したばかりなので大きな変化はありませんが、以前よりも表示回数、収益は増加しております。
5.個別記事ページ
普通のブログの構成です。特に目立ったことはしていませんが、サイドバーを消して画面をメニューと記事のみにしました。また、今後パンくずリストの表示、カテゴリーの表示、記事の終わりに人気記事を表示しようと考えています。そうすればサイドバーの必要性がなくなるのではないかなと。記事を読み終わった後に次に進む動線が確保されていれば大丈夫でしょう。また、選択肢を多く与えすぎてしまうと人間は迷ってしまうので、ある程度絞った選択肢を与えることで迷わずに次のステップに進みやすくしています。
6.記事内のタイトルや見出し、文字
基本的に複数の色を使用することを避け、サイズの大きさと、色の濃さでメリハリをつけています。目立たせたいときはアクセントカラー（このブログではオレンジ）を使用しています。
文字サイズに関してはpタグは16pxで設定しています。もう少し文字を小さくしても良かったのですが可読性を高めたかったので大きめの16pxにいたしました。
行間(line-height)は1.75にしており、これは自分の好みです。1.5 ~ 2の間であれば使用しているフォントとの兼ね合いもありますがお好みの数字に調節していいと思います。
まとめ
上記なようなことを意識して今回はデザインしました。これからこれをベースにアクセス解析に基づき改善していこうと思っています。デザインも重要な要素の一つですがブログは結局書いている記事がためになるかならないかだと思うので、記事に力を注ぐのを忘れないでください。
