今回のリニューアル。「新たなHDDのレビュー記事5~6件を追加し、トップページからリンクするために、記事をカテゴリ単位でまとめてレイアウトする」というのがコンセプト。これに基づいて、どのような配置にするか、頭悩ますところです。
今のデザインを見てみると...

今のデザインでは、右のような感じでいくつかのコンテンツがトップページに掲載されています。で、赤い太線で囲った部分が最初に表示されるスクロールなしで見える範囲。こうして見ると随分記事一覧部分が長くなっていることが分かるかと。
新しい記事を追加したところで数的にはさほど多くはならないわけですが、新たに同じ数の記事をアップすれば単純に考えて長さが倍になるわけです。
そう考えると、これと同じような形で記事スペースを縦に積み上げるのはちょいと苦しい感じ。
まずはこの部分をなんとかしないと非常に分かりづらい&見づらいサイトになっちゃうなー...ってことで、この部分のレイアウトを考えてみることにしました。
縦に並べるか横に並べるか...
どんな感じが読みやすいかな?と考えてみたんですけど、下手に凝ってスタンダードではないレイアウトになるとさらに読みやすさが失われてしまうので、ここは深く考えず、縦並びか横並びのいずれかにすることにしました。

パッと思いついたのがこのレイアウト。それぞれ、赤が新規にアップする記事、青が従来からある記事です。
左は今ある記事の上に同じように縦に並べたもの(=リニューアルなしのレイアウト)。真ん中はカテゴリを縦に、記事スペースを横に並べたもの。右はカテゴリを横に、記事スペースを縦に並べたもの。さて、真ん中と右、どちらにいたしましょ!?ということになるんですが...。
右のものだと、横スクロールなしで掲載できるメインスペースのサイズを考えると、横に並べられるカテゴリは多くても2つまで。今後、記事を追加するときは、結局縦長なサイトになっちゃうんですよね。
他にも、下の方にくるとどっちがどっちのカテゴリだか分からなくなっちゃいそう、一旦上にもどらないと次のカテゴリを最初から見れない、2カテゴリだけでも結構な長さになりそう、などなど...欠点ばかりが目に付いちゃいました。
真ん中のタイプは、こーゆーレイアウトのサイトをちょくちょく見かけますし、ボリューム感も出てきそうな感じがしたので、最終的にはこの「カテゴリは縦並び、記事スペースは横並び」というレイアウトにすることに決めました。
ウェブサイトの見本誌
とまぁこんな感じでリニューアル後のレイアウトを決めたんですが、私はちょくちょくこんな本を参考に、レイアウトやデザインの構想を練ったりしてます。
毎日コミュニケーションズ (2006/12)
売り上げランキング: 64502

このWEB制作会社がこんなサイトを作ってますよーという本で、かなり価格がお高いんですが、数多くのサイトを一度に見ることができるんですよ。
「他のサイトを参考にしたい!」と思って検索しても、あのGoogleさんですらデザインの良し悪しでは検索できない(ま、クールサイトを集めたリンク集みたいなものなら検索はできますが。)わけですが、この本があると何も考えずにいろんなタイプのサイトをパッと見ることができるので、あれこれ行き詰ったときにすっごく重宝してます。
「MTサイトのリニューアル」関連記事
- サイトのリニューアル・リデザイン
- [リニューアル] コンセプトを整理する
- [リニューアル] レイアウトを考える
- [リニューアル] Photoshopで素案作成
- [リニューアル] WEB2.0的デザインのパーツ作り
- [リニューアル] HTML&CSSコーディング
- [リニューアル] MTテンプレートの作成
- [リニューアル] リニューアル完了
この記事に関連情報
同一カテゴリ内の新着記事
- 完全に1カラムになりました
- 今年3度目のリニューアル、ほぼ完了
- うかブログ デザインVer.5
- うかブログ デザインVer.4
- うかブログがなぜ黒/白を選択しているのか?
- ブログのデザインはシンプル イズ ベスト
- メモリ増設レビューサイトをリニューアル
- ブログに掲載するのに適当な写真のサイズ
- うかブログ デザインVer.3.1
- Photoshopで簡単レタッチ
- このカテゴリの記事を全て見る
関連カテゴリ一覧
トラックバック
トラックバック先URL:
