今日は真面目な記事なので「今日は何の日」は無しです。
Webレイアウトの基本パターン
シングルカラム
最近主流になりつつあるレイアウトです(個人的に)
画面の端から端まで使うので、写真を大きくのせることができます。
内容が煩雑ではない4~6ページ程度の小規模なサイトに向いている。
メリット
- レスポンシブ対応がしやすい
- 訪問者が内容に集中できる
デメリット
- ナビゲートが他のレイアウトに比べて劣るため訪問者が他のページに変移し辛い
- 人の目はZの動きで内容を読んでいくため、
端から端まで文字ばかりになると動きが大きくなり、離脱されやすい。
マルチカラム
メインカラムに対し、サイドバー(サイドカラム)と呼ばれる
サブ要素を掲載するレイアウト。
病院や学校など、関連する情報を表示したい際に向いている。
メリット
- より多くの情報を掲載しやすい
デメリット
- 内容がごちゃごちゃしやすい
カード型
小さな情報をカード型に掲載するレイアウト。
一度に多くの商品を訪問者に表示できる。
頻繁に新しいコンテンツが追加さ荒れるサイトや、
リアルタイムで表示されるようなもの、
見比べられるものなど、ファッション系のECに向いている。
メリット
- 一度に多くの商品を訪問者に表示できる
デメリット
- 整列されていないため、見づらく感じる
グリッドシステム
構築側でないとよくらからないと思う。
コンテンツを12個のボックスとして考えて、
その中に内容を入れて配置していくレイアウト。
メリット
- 整列されているため構造が解りやすい
デメリット
- 慣れるまで構築・レイアウトしづらい
フルスクリーン型
最近特に目立つようになってきたレイアウト。
イメージ写真や動画を画面いっぱいに表示させるレイアウト。
雰囲気が伝わりやすいためブランディングに最適。
メリット
- ブランドのイメージが伝わりやすい
デメリット
- テキストが表示されない分、何のサイトかわかりづらい
- 読み込むファイルサイズが大きいため表示までに時間が掛かる
結局、どのレイアウトがいいのか?
業種や掲載する内容にもよるので一概に
「このレイアウトがいい」とは断言できない。
SINGLEカラムレイアウトにこだわりすぎて、
コンテンツが多いのに毎回ページ上部までスクロールしなければ
他のメニューを見られない、というような利便性の悪いサイトになってしまっても本末転倒だ。
ユーザー側に立ち、
「ユーザーはどんな情報を求めているだろう?」
「この後どんなページを見るだろう」
を考えてレイアウトを決める必要がある。
今回はこちらの本を読んだので、
その中空一部抜粋して紹介しました。
今日は何の日、無いと思いました?
安心してください、ありますよ。