ヘッダーの重要性

最も重要コンテンツなヘッダー要素

Webサイトは、上から順に読み込まれていきます。ユーザーは、ページ最上部左上から「Z」の字を描くようにサイトを見るといわれています。サイトのロゴマークが左上に多く配置されているのは、そのためです。

最上部に位置するヘッダーは、コンテンツの中でも最も重要で、しかも狭いエリアの中にたくさんのコンテンツを配置している場合が多く、コーディングも非常に複雑になっています。display要素を使って、コーディング出来るように練習してみましょう。

ヘッダー要素に多く含まれるリンクとは

ロゴマークは、必須です。例外を除いて、ほぼ左上に配置されています。ロゴマークをクリックすると、トップページに戻れるようにリンクしておきます。その他、多くあるものをご紹介します。

ロゴマーク
よくあるご質問
お問い合わせ
個人情報について
資料請求

ショッピングサイトカート
電話番号
見出し(h1)
個人情報について
資料請求

最近よく見かけるのは、「他言語」切り替えのボタンなどがあります。

練習してみましょう。

ECCジュニア
[code]
<header>
<h1>ECCジュニア子ども英会話教室<br />
幼児、小学生、中学生の英語・英会話教室のご案内</h1>
</header>
[/code]
ナビゲーション
[code]
<nav>
<ul>
<li><a href="http://www.eccjr.co.jp/">HOME</a></li>
<li id="n02"><a href="what/">ジュニア英会話No.1選ばれる理由</a></li>
<li id="n03"><a href="youji/">幼児の学習ならECCジュニア</a></li>
<li id="n04"><a href="faq/">よくあるご質問</a></li>
<li id="n05"><a href="reference/">お近くの教室を探す</a></li>
<li id="n06"><a href="https://www.eccjr.co.jp/contactus/">資料請求・無料体験レッスン</a></li>
</ul>
[/code]