
No.1ベストアンサー
- 回答日時:
HTML5--html5ではない。
英語圏で大文字は省略形や頭文字を示します。この場合はHyper Text Markup Languageですから)--では、文書構造を明確に示されるように新しい要素が追加されました。HTML4では、<h1>とか<<blockquote>とか<address>、<p>位しかなくて、idやclassとDIVやSPANを併用して文書構造を示すしかありませんでした。
『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加する( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』
あなたがHTML4.01の時代に
<div class="header">
<div class="nav">
としていた物が、
<header>
<nav>
とかけるようになったという事です。
・Webの3つの問題を解決する「HTML5」とは何なのか( http://www.atmarkit.co.jp/ait/articles/1008/30/n … )の中ほど『問題2】文書内に埋め込まれた「意味」が不明確』を読んでおくこと
header要素は、その文書のヘッダーを示す要素ですから、文書の見出し<h1>~<h6>とか、サイトのナビゲーションが入っても良いでしょう。本文(section)の目次が入る場合もあるでしょうが、それはsection内に入れるほうが良いでしょうね。
>一番上に、ロゴが左にあって、その横にナビボタンが並ぶレイアウトにするつもりなのですが (^^;
ロゴはその文書の内容には関係ないのでHTMLには書かなくても良いでしょう。ナビゲーションに含めても良い。
<body>
<h1>ページのタイトル</h1>
<nav>
<ul>
<li><a href="/">TOP</a></li><!-- これをロゴにデザイン -->
<li><a href="/Products">製品</a></li><!-- リンクボタンにデザイン -->
<li><a href="/Manual">マニュアル</a></li>
HTML5では、『一番上に、ロゴが左にあって、その横にナビボタンが並ぶレイアウト』というようなプレゼンテーション/デザインは一切考えずに、文書構造だけをマークアップすることになります。DIVなどは原則使えなくなります。
そして、『一番上に、ロゴが左にあって、その横にナビボタンが並ぶレイアウト』なんてのはスタイルシートに任せます。デザインを目的にHTMLは書かない・・・・まあ、これはHTML4.01のときも『構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )』として散々言われ続けてきたことなのでいまさらですが。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
html の divとtable の役割
-
HTML属性での「""」 「''」違い
-
【ヒトの神秘】美男美女から何...
-
含む含まないという概念自体の...
-
ulタグやliタグの中でbrタグ...
-
表示倍率を変えるとレイアウト...
-
複数の画像にメニュー表示させたい
-
tdに対してmin-heightの定義、...
-
番号付きリスト(<Ol><Li>・・...
-
header部分とnaviの位置の調整...
-
input type="hidden"で取得した...
-
ワードにコピペ、画像が表示さ...
-
<ul>~</ul>が二つ続くと間に改...
-
CSSのみで作る横ドロップダウン...
-
floatを適用したdiv内部にあるp...
-
htmlの<ol>タグで、数字などを...
-
双方向リストのソート方法につ...
-
webのナビメニューで、どうして...
-
カラープレーンってなんですか?
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlのolやulなどlistにtitleや...
-
html の divとtable の役割
-
複数のボタンを等間隔に、かつ...
-
1時間30分を簡単に表したいで...
-
HTML属性での「""」 「''」違い
-
min-heightとheightの違いについて
-
スペースを使わず文字位置を揃...
-
ヘッダーとフッターだけ背景を...
-
セクションをdivで囲むと見出し...
-
<!-- #BeginLibraryItemとは
-
【html&css】太さの違う2本線の...
-
ヘッダーを左右に二分割する方...
-
HTMLのバリデーション
-
<div id="container">の使いか...
-
フッタの背景画像をリピートxで...
-
HP製作を仕事にしたく相談です。
-
グリッドレイアウトで"auto-fit...
-
</div>は、どのdivに対しての終...
-
html5でheader,footerこみのwra...
-
h1を親要素の縦中央、画像の横...
おすすめ情報