menu

Webページは第一印象が大事。レイアウトで最低限注意したい2つのポイント

制作

WordPressをはじめとしたCMS(コンテンツマネジメントシステム)の普及によって、Webサイトは誰でも手軽に制作できるものになりました。ただ、WordPressなど汎用的なツールで簡易的に制作したWebサイトは特徴がなく、どこにでもありがちな印象のものになってしまう場合もあります。

「野暮ったい‥」、「何か物足りない‥」。そんなWebページを避けるためには、どんな点に気をつける必要があるのでしょうか。レイアウトで最低限注意したい2つのポイントについてご紹介します。

・センタリングの乱用に注意
Webデザインの最近のトレンドの1つとして、カラムを使わずにコンテンツをセンタリング(中央揃え)で表示するWebページが増えてきています。

センタリングされたコンテンツはレスポンシブ対応もしやすく、ユーザーの視点を1か所に集める効果があります。その点で、ファーストビューで写真を全画面表示させるページなどとは相性がいいのですが、一方でページのホワイトスペース(余白)が中途半端になり、野暮ったい印象を与えてしまうことがあります。また、文章の切れ目が揃わないため、読みにくさにつながることもあります。

テキストが多めのページや、複数の見出しがあるページ、画像とテキストが左右横並びに配置されたページなどではセンタリングは避け、カラムを使ってオーソドックスにレイアウトした方がいいかもしれません。

・画像やイラストの効果的な配置とは?
SEO対策を意識するあまり、Webページのテキストを増やし過ぎてしまうとメリハリがなく、ページの印象も安っぽいものになりがちです。そういった意味ではやはり画像やイラストも効果的に使いたいもの。

画像やイラストを配置する際は、脳医学に目を向けてみるのもいいかもしれません。脳医学では、人間の右脳は「直感的」、左脳は「理性的」に働くとされ、それぞれ左右の視野に交差して結びついています。

あくまでコンテンツやデバイス環境との兼ね合いにはなりますが、ページ左側に直感的な表現にマッチした画像・イラストを配置したうえで右側にテキストを流すと、ユーザーによりスムーズに情報を届けるともできるのではないでしょうか。

また、リサーチ系のコンテンツなら、マーケットデータを数値化・ビジュアル化したインフォグラフィックを利用するのも1つの方法です。現在ではインフォグラフィックを手軽に作成できる無料ツールも多数公開されています。

Web制作に関するご依頼、ご相談、お見積はこちら

小野 良勝

小野 良勝 代表取締役

投稿一覧

横浜の制作会社アイティネットの代表取締役。WEB、モバイル、DTP、デジタルサイネージを事業展開。それぞれの特性を活かした メディアミックスを得意とする。iPhoneやiPadを活用したBtoB向けのアプリケーションを開発。モチベーションの高い人や異業種との交流がたまらない。華の47年組。趣味はオートキャンプ

marketing20カスタマーサポートの改善事例「みずほ銀行」お問い合わせ・FAQ

listing03サービス開始から約14年。変化し続けるリスティング広告の「今」(3)

関連記事

  1. web06

    Webサイトのコンテンツをどう見せるか。共有・拡散されやすい3つ…

    Webサイトのコンテンツは内容に加えて「どう見せるか」、「どう届けるか」という視点も非常に大切です。…

  2. web10

    制作メンバーの進捗管理や効果測定をよりスムーズに行える「Goog…

    スケジュールの進捗管理や効果測定はWebディレクターの大切なミッションの1つです。こうした管理業務に…

  3. アイコンとあわせてフラットデザインに活用したい無料フォント&ベクター素材

    アイコンとあわせてフラットデザインに活用したい無料フォント&ベク…

    Webサイトにフラットデザインを取り入れる際は、アイコンのデザインやレイアウト、文字情報の配置に気を…

  4. web04

    月間ユーザー1億人以上のサービスも。Webディレクターが知ってお…

    世界中で10億人以上の人に利用されているSNS。Webサイトも分野を問わずSNSからの流入が増えてお…

  5. 購買率が1.68倍UP。ECサイトに取り入れたい「短め」デモンストレーション動画

    購買率が1.68倍UP。ECサイトに取り入れたい「短め」デモンス…

    企業のメッセージやブランドの価値観を伝えるブランディング動画とあわせて、動画マーケティングに取り組む…

  6. webdesign02

    Photoshopの編集作業をより快適にする、ショートカットキー…

    メインの画像編集ソフトとしてPhotoshopを使っている場合、初期設定のカスタマイズとあわせて使い…

  7. web01

    YouTubeやFacebookは既に導入済み。Yahoo! J…

    Webサイトの制作・運営においてセキュリティは非常に大切です。日ごろのWebディレクター業務では企画…

  8. web03

    Webサイトのプランニングに活用できる「マインドマップ」(前編)…

    ユーザービリティ向上やコンバージョン率改善など、Webサイト制作の目的はさまざまです。目的を実現する…

PICKUP

  1. BLEBeacon専用アプリケーション外注までの5つのステップ
  2. web09
  3. 【SEO】 軸&優先順位がキーとなる「対策キーワード選定」のポイント
  4. Web運用を委託した方がいい企業5つの特徴!!と、1つの注意点
  5. seo07
  1. ec01
  2. デキルトレード
  3. director06
  4. bc-hydro-smart-meter
  5. marketing05
  6. 繋
  7. marketing13
  8. ad01
  9. 【SEO】 具体的な対策の起点となる「対策キーワード選定」
PAGE TOP