あっかぎのページ

サイトリニューアル計画2

20150408_4

サイトのお引越しが完了したので、サイトリニューアル計画2です。

先日、サイトリニューアル計画のサイトのお引越し(ロリポプラン→コロリポプラン)が完了しました。今のサイトはWordPressのデフォルトデザインのままなので、もう少し情報を整理して見やすいサイトにしたいなと思っています。

ということで、サイトリニューアル計画の後半「新サイトデザイン」を検討中です。新サイトの要件はこんな感じです。

  • 情報が整理されている
  • レスポンシブ対応

情報が整理されている

今のサイトは直帰率が90%と高く「検索したページだけ見て帰る」という率がすごく高いです。一番の原因はこのサイトのカテゴリーが発散していることです(ドラクエとRaspberry Piが同居してるとか)。「自分のメモ」がこのWebの目的なのでこれは変えないとして、せめて情報の整理の仕方の工夫でこの状況を改善したいなと思っています。

具体的な方針は「カテゴリーごとに情報を整理して記録する」をコンセプトにしようと思っています。

レスポンシブ対応

このサイトのアクセスデータを見ると40%近くがスマホからのアクセスでした。世間一般も同じような感じで、50%近くがスマホからのアクセスとなってきています。さらにGoogleがスマホ(モバイル)対応を検索順位に加味すると最近発表しました。

それを受けてWebの世界ではスマホ対応が必須の要件になってきました。

では、どうやって対応するかということですが大きくは2つの戦略があります。

  • PCとスマホサイトを作る
  • レスポンシブ対応

1つ目はPCとスマホサイトを別々に作る方法です。これはアクセスしたデバイスを見て対応するサイトに誘導する方法です。さらにURLを別にする方法やプログラムで表示するページを分けるなどいろいろと方法があります。

2つ目はレスポンシブ対応といって、デバイスの画面ごとにレイアウトを切り変える手法で最近のトレンドとなっています。スマホ・タブレット・PCそれぞれの大きさに応じて最適なレイアウト構成を作ります。例えば、Microsftのサイトもレスポンシブ対応していて、ブラウザの画面を小さくしたり大きくすることで画面のレイアウトが可変します。

1,2どちらもメリット・デメリットがありますが、今回はレスポンシブ対応を意識したサイト作りをしたいと思います。

参考イメージ

20150416_3

20150416_1

上で紹介するサイトのようなシンプルな見た目のサイトを目指してみたいと思います。

こちらはレスポンシブ対応のサイト作りにオススメの本です。

schooでこの筆者(菊池 崇先生)のレスポンシブデザインの授業もありましたので合わせて紹介します。