こんにちは、ひつじのジョージです。
大都会でプログラマーとして10年以上活躍しています。普段は会社員として働いていますが、個人でシステム、Webアプリケーションを複数運用しています。
HTMLの全体構成レッスンでは「HTMLの全体の枠組み」「DOCTYPE宣言の意味」「headタグとbodyタグの役割」を理解する必要があります。
これらはWEBページを作る時に必ず使うので、これらを理解していないとWEBページを作ることはできません。
- HTMLの全体の枠組みの型を理解する
- DOCTYPE宣言の意味を理解する
- headタグとbodyタグの役割を理解する
これまでに学んだ見出しタグやリストタグはbodyタグ内に記述します。
目次
HTMLの全体構成レッスンの答え
このレッスンの回答はindex.htmlとstylesheet.cssの2つのファイルに記述する必要があります。
index.htmlでHTMLの全体の枠組みを学びます。
stylesheet.cssでもこれまでに学習したことを用いて記述する必要があります。
<!-- DOCTYPE宣言を追加してください --> <!DOCTYPE html> <!-- <html>要素を追加してください --> <html> <head> </head> <body> </body> </html>
stylesheet.cssでは以下のように記述すると正解です。
/* body要素のfont-familyを"Avenir Next"にしてください */
body {
font-family: "Avenir Next";
}
「Avenir Next」をダブルクォーテーション（"）で忘れずに囲んでください。
なぜダブルクォーテーションで囲む必要あるのかわからない方はこちらの記事を参照してください。
よくあるミス
このレッスンではDOCTYPE宣言をしていないことやheadタグやbodyタグを正しい順序で記述していないミスが多くあります。
これらの型はすべてHTMLの型として決められているので正しく記述しましょう。
- DOCTYPE宣言をしていない
- headタグとbodyタグを正しい順序で記述していない
よくあるミス1：DOCTYPE宣言を記述していない
<!-- DOCTYPE宣言を記述していない -->
<html>
<head>
</head>
<body>
</body>
</html>
DOCTYPE宣言ではHMTLのバージョンを宣言しています。
最新のバージョンはHTML 5ですがバージョンによって使いないタグがあるので、一番初めにどのバージョンでHTMLを記述するのか宣言する必要があります。
また、DOCTYPE宣言では終了タグは必要ありません。
よくあるミス2：headタグとbodyタグを正しい順序で記述していない
<!-- headタグとbodyタグを正しい順序で記述していない -->
<html>
<body>
</body>
<head>
</head>
</html>
HTMLの型ではheadタグを記述したあとにbodyタグを記述します。
headタグ内ではWEBページの設定に関する情報を記述します。
WEBページのタイトルなどheadタグ内に記述しますが、タイトル以外は通常画面に表示されません。
headタグ内に記述された情報を元にbodyタグ内を画面上に表示します。
そのため、bodyタグよりも先にheadタグを記述する必要があります。
まとめ：HTMLの全体の枠組みの方を理解しよう
HTMLの全体構成レッスンでは「HTMLの全体の枠組み」「DOCTYPE宣言の意味」「headタグとbodyタグの役割」を学びました。
これらはWEBページを作る時に必ず使うので、これらを理解していないとWEBページを作ることはできないので必ず理解しましょう。
- HTMLの全体の枠組みの型を理解する
- DOCTYPE宣言の意味を理解する
- headタグとbodyタグの役割を理解する
HTMLの全体の枠組みでよくあるミスは「DOCTYPE宣言をしていない」「headタグとbodyタグを正しい順序で記述していない」ことです。
これはすべてHTMLの型で決まっています。
型に従ってHTMLタグを記述していきましょう。
- DOCTYPE宣言をしていない
- headタグとbodyタグを正しい順序で記述していない
