プロゲート入門者です。HTMLでさっそくつまづいたのでどなたか教えてください。

Question

初めまして、nyanchuuと申します。
HTML&CSSの初級編を学び終えて、中級を学習し始めました。

<<div class="header" div class="main"のような、ヘッダーとフッターのためのタグは非常によく使われるので、HTML5は<header>と<footer>というタグが用意されています。<header>,<main>, <footer>を使う方が一般的なので、こちらを使いましょう。

とあったのですが、今後上記の<header>,<main>, <footer>を使用していくのなら何のために初級編で<div class="header">を学んだのかよく意図が分からないのでお聞きしたいです。

あと全体のレイアウトについてです。初級編でbodyの中はヘッダー、メイン、フッターは学習しWEBページを作っていました。

中級編は、mainでなくwrapperになってプロゲートには詳しい説明がないのでwapperってなんぞやともって自分なりに調べたのですが
分からないので・・ページの主なコンテンツはmainだと思うのですがwapperとはmainのことですか？

無知で申し訳ないのですが初心者にわかりやすく教えてくださると幸いです。よろしくお願いいたします。

Comments

[m.ts10806]

タイトルに何一つ要件が含まれていません。「初心者アイコン」もあるので、それに類する文言を含む必要はありません。

[nyanchuu]

アドバイスいただきましてありがとうございます。以後気を付けて投稿させていただきます。

[m.ts10806]

質問は編集できますので、以後ではなく、適宜対応してもらえると。

Answer 1

Progate の意図は Progate に聞くしかないですが、想像はできます。
たくさんの要素を一度に紹介すると混乱するからでしょう。
要素名は決められているので覚えないといけません。class は自由に名前を付けられます。
付けた名前が wrapper とか container とか変わるのかもしれませんが、そういう名前を付けたよという意味しかないのではないでしょうか？

Comments

[nyanchuu]

コメント頂きましてありがとうございます。今、確認してdiv　class＝””の""は自由に名前つけれたのでしたね、wrapper とか containerを要素だと勘違いしておりました。

Answer 2

提示された文章にヒントが書いてあるように思います。

<<div class="header" div class="main"のような、ヘッダーとフッターのためのタグは非常によく使われるので、HTML5は<header>と<footer>というタグが用意されています。<header>,<main>, <footer>を使う方が一般的なので、こちらを使いましょう。

まずはHTMLをCSSによって装飾することを覚え、そこから「より適切な構造の組み方」にステップアップしていってるのではと。
「CLASS,IDに意味を持たせる」ということも初級編では覚えられるのではと。