HTMLタグとは？head・bodyの役割をやさしく解説

HTMLタグとは

HTMLタグとは、文章や画像が「見出しなのか」「段落なのか」といった意味を、ブラウザに伝えるための目印です。文章の前後を目印で挟むことで、ブラウザはそれをどう表示すればよいか判断します。

たとえば「ここは見出し」「ここは段落」と印を付けておくと、ブラウザは見出しを大きく太く、段落はふつうの文章として表示してくれます。

つまりタグは、ただの文字の集まりに「役割」を与えるラベルのようなものだと考えると分かりやすいでしょう。

ページの骨組みになる基本構造

HTMLのページは、大きく見ると入れ子になった箱の集まりです。一番外側にページ全体を表す箱があり、その中に二つの大きな箱、headとbodyが入っています。

headはページの設定や情報を入れる箱、bodyは実際に画面に表示される中身を入れる箱です。この二つを正しく分けることが、整ったページの第一歩になります。

この骨組みがしっかりしていると、後から内容を足したりデザインを変えたりしても崩れにくくなります。

実務ではどこで関係する？

HTMLタグは言葉の意味だけ覚えても、HTML共有の判断にはつながりません。実務では「表示に関係する話か」「検索に関係する話か」「アクセス制限に関係する話か」を分けて考えると整理しやすくなります。

HTMLタグについて迷ったら、相手が安全に開けるか、検索に出してよいか、ブラウザや環境差で壊れないかを順番に確認します。用語理解は、その判断を早くするための道具として使います。手順が決まったら、HTML/ZIPをアップロードして共有URLを発行し、相手に確認してほしい観点と期限を添えて送ります。

• 表示の話: HTML/CSS/JS、パス、ブラウザ互換性を確認する
• 検索の話: noindex、canonical、sitemap、robots.txtの役割を分ける
• 制限の話: URL共有、パスワード、メール認証、会社ドメイン認証を混同しない
• 運用の話: 期限、差し替え、削除、共有メッセージまで決める

headとbodyの役割の違い

headには、ページのタイトルや文字の種類の指定、検索結果に表示される説明文など、画面には直接出てこないけれど大切な情報を書きます。ページの「裏方の設定」が集まる場所です。

bodyには、見出しや本文、画像やボタンなど、実際に利用者が目にする中身を書きます。私たちが普段ページとして見ているのは、このbodyの中身です。

headは設定、bodyは中身、という対比で覚えると、どちらに何を書けばよいか迷いにくくなります。

基本構造を組み立てる手順

簡単なページを作るときは、外側から内側へ箱を作っていくイメージで進めると整理しやすくなります。

1. ページ全体を表す一番外側の箱を用意する
2. その中に、設定を入れるheadの箱を作る
3. headにページのタイトルや説明など裏方の情報を書く
4. headの次に、表示する中身を入れるbodyの箱を作る
5. bodyに見出しや本文、画像などの実際のコンテンツを書く

作ったHTMLを確認・共有するには

HTMLは作っただけでは自分の手元にあるだけで、そのままでは他の人に見てもらえません。誰かに確認してもらうには、外からアクセスできる状態で公開する必要があります。

ギガサイト便では、作成したHTMLファイルをドロップするだけで共有URLが発行され、相手にリンクを送って表示を確認してもらえます。会員登録なしでも公開でき、headやbodyの組み方が意図どおりに表示されるかを手早く確かめたいときに便利です。