HTML5の必ず必要なタグと構造

投稿日時 : 2024/09/04 更新日時 : -

HTMLファイルを記述するにはひな型があります。

HTMLの絶対に必要な構造を見てみよう。


<!DOCTYPE html>
<html lang="ja">
<meta>
...
</meta>
<body>
...
</body>
</html>

これらのHTMLタグは絶対必要だ。

<!DOCTYPE html>宣言

HTMLタグを使うにはドクタイプ宣言が必要だ。Webデザイナーでもコピペで済ますので、このコードの文字を一文字ずつ覚える必要もタイプする必要もないので、下記を読んで知識だけ付ければOK。

毒タイプ宣言？

ハハハ。何かのゲームみたいだな。多分、ドキュメントの型の宣言って意味だぞ

DOCTYPE宣言はHTMLタグを使う場合にファイルの一行目に「おまじない」と思って書かなければならない。これは.htmlファイル以外で、.phpや.aspのファイルでもHTMLタグを使うならファイルのどこかにこのタグを出力する記述が必要だ。

気になったのですが、htmlを使うからDOCTYPEの横にhtmlと記述しているのですよね？
html以外にも型があるという事ですか？

良い質問だ。現在はHTML5が一般的だが、以前はHTML4でこれが数種類の定義があり、これをDOCTYPE宣言で記していたんだ

コードは現在は統一されてシンプルになった。IT系あるあるだが、コードの書き方は時代が進むにつれて簡素化する傾向にある。勿論、例外もたくさんあるが。


<!DOCTYPE html>
<html lang="ja">

<!DOCTYPE html>の下に書くコードがそのページがどの言語に対応しているのかを表す。
jaは日本語のjapaneseから来ているので、このページは日本語に対応している事を表している。英語ならenと書く。

jpじゃないんですね。jaだとジャマイカっぽいです

まぁ確かに。ちなみにジャマイカの公用語は英語らしいから、対応したいならenを使ってな

metaタグには、表示はされないがページの情報を記述する。例えばページのタイトルや検索にヒットさせたいキーワードや別の講座で解説するCSSファイルの読み込み等をここでする。

メタは目に見えない情報ってニュアンスがある。ゲームでたまにキャラクターが現実のプレイヤーに向かって「そこの君！　この謎が解けるかちゃんと考えなさい！」等のセリフを見る事があるが、これを「メタい」と表現する。

別のキャラクターが「え？　そこの君って誰？　もしかしてメタい話？」とツッコんだりもする。このメタとメタタグのメタが同じ意味なのかは知らんが、恐らく親戚だろう。

bodyタグはそのままの意味で身体だ。metaタグは見えないけど、bodyタグに記述するものは基本的に目に見える。

次の章で順次、詳しく解説する。