• ホームページのレイアウト|コンテンツならサイトロジック

    • 会社概要
    • サイトマップ
  • コンテンツならSITELOGIC.
    • コンテンツならサイトロジックTOP
    • ホームページ制作
    • WEBシステム
    • イラスト・デザイン
    • クリエイター紹介
    • お問い合わせ
      1. コンテンツならサイトロジックTOP
      2.  > イラスト・デザイン
      3.  > ホームページデザイン
      4.  > ホームページのレイアウト

      ホームページのレイアウト

      そもそもホームページのデザインというのは、非常に自由度の高いものです。

      ただし、そのホームページもある程度、パターンがフォーマット化されていて、特に奥深い意図が無い限りは、その慣例に従うべきでしょう。

      例えばコーポレートサイトなどの最も一般的なレイアウトでは、ホームページの看板となるヘッダーがあり、その下に主要コンテンツを並べたナビゲーションメニューがあり、コンテンツ部分にはサブメニューなどの用途に使われるカラムがあり、フッターメニューがあります。

      左に簡単な図で最もオーソドックスなレイアウトを描いてみましたが、要するにこのサイトロジックのホームページの体裁そのままですね(笑)。

      もちろん、その気になれば斬新なフレームワークでユーザーの度肝を抜くことも不可能ではないのですが、さすがに意味はありません。

      ユーザーが直感的にわかることが一番親切な設計であると言えますので、基本は基本として抑えておきましょう。

      カラムは右か、左か!?

      上に描いた図では、あえてカラムを右にしてみました。

      ちなみに見てお分かりのとおり、このサイトロジックのホームページもカラムは右です。

      これはもちろん、私自身が右カラム派である、ということが最も大きいからですが、それにはいくつか理由があります。

      例えば、ヤフーやニコニコ動画、Youtube、なんでもそうですが、今はやりのメガバナー(比較的大きなサイズで、FLASHによるリッチなアニメーション広告)は、必ず右側にあります。

      これはユーザーの視線移動が、左上から始まって右下に降りていって止まる場所、とされている、つまり最も目につきやすい場所だからです。

      文章を読むときは必ず左から右へ視線が移動しますので、目立たせたい要素は右側に集中させることが効果的だというわけですね。

      なので、必然的にカラムは広告や、誘導したいコンテンツへの導線を貼るために最適とされる、右側に置くことが理想だと言えるわけです。

      もちろん、左側にすることが絶対的なタブーというわけでもないですし、なんなら左右両方にカラムを置くパターンだってあります。

      デザイン次第で売上が増える!?

      もうひとつ、地味な理由ですが、インターネットブラウザウィンドウの横幅をどんどん縮めていくと、必ず右側が隠れ、左側が残っていきます。

      例えばディスプレイ解像度の小さなモニターを使っているユーザーが、複数のウィンドウを並べようとしたときには・・・コンテンツ側が残っていくほうが圧倒的に親切なわけです。

      これはほんのひとつの要素に過ぎませんが、こうした配慮をいくつも積み重ねていくことによって、1%のコンバージョン率を2%にすることができたら・・・売上は2倍にも膨れ上がるわけです。

      勝手に売ってくれる自動販売機こそ、緻密な戦略が重要であり、デザインもそのための要素のひとつだということですね。

      1. よいホームページデザインとは?
      2. ホームページのレイアウト
      3. リンクのデザイン性について
      • ホームページ・イラスト・システム開発|お問い合わせはこちら
        お気軽にご相談ください
          • 例)info@sitelogic.jp

          • 例)山田太郎

        送信する

      新着記事一覧サイトロジックのノウハウを公開!

      サイトロジックでは、コンテンツ制作に関わるさまざまなノウハウを、惜しみなく公開しています。
      コンテンツ制作のご参考に、ぜひお役立てください。

      • インターネット成功の基準
      • MovableTypeでリンクを相対パスに
      • リンクのデザイン性について
      • SEO効果検証を公開
      • インデックス数を稼ぐ
      • MovableTypeとは?
      • イラストの役割
      • CSSを解除するJavascript
      • バックリンクの効果
      • 共通パーツをインクルード処理

      全21件の記事中最新の10件を表示 >> 続きを見る

      話題のキーワードでニュースを検索!
      • 吉野紗香
      • マイク・ケリー
      • 栗きんとん入り干し柿
      • 大屋夏南
      • ガスパン遊び
      • 芦田修正
      • 矢沢心
      • 岸部四郎
      • ドラゴン桜 円周率
      • トマトの木
      • 七里ヶ浜 シーラス
      • 三宅健
      • 広田レオナ
      • 博多ばってんラーメン
      • フェルトアート
      • 「さっぽろ雪まつり」が最初に開催された年
      • マーレカルモ
      • LOT165
      • ZIPPEI 声帯
      • 福岡都市高速
      • >> キーワードアクセスランキング

    ▲戻る

  • ホームページのレイアウト|コンテンツならサイトロジック
      • コンテンツならサイトロジックTOP
      • キーワードアクセスランキング
      • 会社概要
      • サイトマップ
      • お問い合わせ
      • CSSを解除
      • ホームページ制作
        • WEBコンサルティング
        • SEO対策
        • アクセス解析
      • WEBシステム
        • システム研究
        • PHPプログラム
        • Javascriptプログラム
        • movabletype
      • イラスト・デザイン
        • ホームページデザイン
        • イラストレーション
        • ロゴデザイン
        • FLASH
      • クリエイター紹介
    Copyright©2012 KCP Co.,Ltd. AllRights Reserved.