WEBデザイン

【WEBデザインを独学で学ぶ】WEBページの構成要素を学ぶ

どーも。学長です!

 

 

【WEBデザインを独学で学ぶ】

WEBページの構成要素を学ぶ

 

 

WEBサイト作る前に構成要素を整理しておく必要があります。

ここではトップページについて説明していきます。

 

 

それでは授業を始めたいと思います。

 

WEBページを構成する領域について

WEBサイトの構成はいろいろあります。

今回は、当サイトをサンプルとして製作します。

1つ1つ説明していきますので、わからない場合は理解するまで読んでください。

 

構成

 

ヘッダー領域とは?

Aの箇所は「ヘッダー」と言う領域です。

基本的には企業のロゴや、ブランド名などを記載します。

 

 

またWEBサイト全体で共通の「サイト内検索」や「サイトマップ」への

リンクをここに掲載することもあります。

 

ナビゲーション領域とは?

Bの箇所は「ナビゲーション」と言われる領域です。

WEBサイト内で自由に閲覧できるように、

ナビゲーションやメニューボタンなどを掲載しています。

 

 

ナビゲーションは用途に合わせて様々な種類があります。

どのナビゲーションを採用するかは、そのサイトのレイアウトデザインによって

大きく変わります。

 

コンテンツ領域とは?

Cの箇所は「コンテンツ」と言われている領域です。

WEBサイトでは、メインとなる情報を掲載します。

掲載する内容ですが、用途や目的によって様々です。

 

 

訪問ユーザーに対して、インパクトある画像を掲載したり、

WEBサイトやリンクメニューを多数掲載しているWEBサイトなど、

様々です。

 

フッター領域

Dの箇所は「フッター」と言われる領域です。

基本的には「著作権の情報」やメインコンテンツを

補足するような内容のページへのリンクを掲載します。

 

 

「利用規約」や「プライバシーポリシー」に関するページへのリンクも

フッターに掲載されることが多いです。

 

構成要素とレイアウトの関係

これらの4つの領域とレイアウトデザインは深い関係です。

例えば、レイアウトの対象がヘッダー領域やナビゲーション領域、

フッター領域であれば、反復の原則を利用します。

 

 

反復の原則を利用して、

WEBサイト全体で同じレイアウトデザインを採用した方が、

一貫性のあるWEBデザインを実現することができます。

 

 

一方、コンテンツ領域であればある程度自由にレイアウトデザインができます。

どちらが良いというのはないので、領域ごとの特徴を加味してレイアウトデザインを、

考えるようにしましょう。

 

 

さて今日の授業はここまでです。

不明な点は学長までお願いします。



お名前 (必須)

メールアドレス (必須)

ピックアップ記事

  1. 学園長から挨拶

関連記事

  1. WEBデザイン

    WEBデザイナーがオススメする7つのフリー素材サイト!

    どーも!学長です!今日はフリー素材のサイトについて解説…

  2. WEBデザイン

    【WEBデザインを独学で学ぶ】ナビゲーションの種類を学ぶ

    どーも。学長です!【WEBデザインを独学で…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

ラジオはじめました!

クライアント様サイト

  1. ネットビジネス

    アドセンスで稼げたら物販アフィリエイト!
  2. 日記

    ぐんまちゃんの和菓子がかわいい!
  3. RADIO

    RGBラジオ絶賛放送中!
  4. 起業の心得

    【デザインマインド】予算を考える・波に乗る
  5. Photoshop

    超簡単!Photoshopでしわを消す方法
PAGE TOP