この記事は3分で読めます

HTMLに必須の要素

投稿日2024.9.13
更新日2024.9.13

- 開発
- フロントエンド

開発

ほなみ

あとで読む

HTMLの必須要素には何があるのでしょう。これからHTMLを学びたい、最近学び始めた、という方はこの記事でホームページ作成に役立ててみてください！

はじめまして、イッパイアッテナです。

ITと教養で、優秀なネコの手となり、あなたのあらゆる問題を解決します。あなたの相談役だったり、デザイナーだったり、広報だったり、わたしたちは”イッパイ”の顔をあなたに見せることができます。

Web制作の相談はこちら

トップページのファイル名
HTMLに必須の要素
まとめ

トップページのファイル名

まず、コーディングを始める際、テキストエディタを開いたらページごとにファイル名をつけます。
しかし、トップページのファイル名はなんでもいいというわけではありません。必ず「index.html」を用いなければ読み込まれません。

HTMLを書き始める前に、まずはファイル名を正しく設定してから書き始めましょう。

HTMLに必須の要素

次に、テキストエディタを起動し、新規ドキュメントを開くと、下記のようなHTMLが元から書かれた状態になっています。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>無題ドキュメント</title>
</head>

<body>
</body>
</html>

こちらに書かれているものが、HTMLに欠かせない要素です。

ここからそれぞれの要素について説明していきます。

DOCTYPE宣言

<!doctype html>

HTMLには、新旧のバージョンがあり、どのバージョンでHTMLを記述しているかを宣言するのがDOCTYPEです。DOCTYPEは、必ず1行目に書く必要があります。 DOCTYPE宣言が無いと、ブラウザ側がどの形式で記述しているのかがわからず、CSSが実装される以前のWebサイト/ブラウザとの互換のための「互換モード」でHTMLを表示させてしまいます。互換モードではCSSの記述がうまく読み込まれず、レイアウトが崩れてしまう場合があります。

html要素

<!doctype html>

head要素

<head>
</head>

head要素は、HTML文書に関する情報（メタデータ）を記述します。head要素の中には1つだけ、必ず明記することが義務づけられている要素があります。それがtitle要素です。headタグ内に記述した内容は、ブラウザに表示されませんが、titleタグのテキストは、タブ名やブックマークで表示されます。