headタグとbodyタグの違いとは？
HTMLには、headタグとbodyタグがあります。
headタグは、ページのタイトルや説明、外部ファイルの読み込みなど「ページについての情報」を記述する場所です。
bodyタグは、文章や画像など「ブラウザの画面に表示する内容」を記述する場所です。
簡単にいうと、headはページの情報、bodyは実際に表示する内容を記述する部分です。
それぞれの役割について、詳しく見ていきましょう。
headタグとは？
headタグには、サイトのタイトルやディスクリプションなど、サイト上には表示されない部分の情報定義を記述します。
〈具体的な記述例〉
titleタグ
サイトのタイトルを設定します。検索結果や、ブラウザのタブに表示されます。
metaタグ
description(ディスクリプション)やcanonical(カノニカル)など、SEO目的で設定する。
linkタグ
cssファイルなどの外部ファイルを読み込む。
scriptタグ
javascriptを読み込む。
このようなhtml自体の情報をメタデータといいます。
bodyタグとは？
bodyタグとは、Webページの画面上に表示する内容を記述するためのタグです。
bodyタグの中には、見出しや文章、画像、リンクなど、実際にブラウザ上でユーザーが見るコンテンツを記述します。
headタグとbodyタグの違い
headタグとbodyタグの違いは、記述する内容の役割です。
headタグには、ページのタイトルや説明、外部ファイルの読み込みなど「ページについての情報」を記述します。
一方、bodyタグには、文章や画像、リンクなど「ブラウザの画面に表示する内容」を記述します。
つまり、headはページの情報を設定する部分、bodyは実際に表示するコンテンツを記述する部分です。
htmlファイルの構成
htmlファイルはこのheadタグとbodyタグで構成されていて、記述の順番はheadタグが先で、次にbodyタグと決まっています。
また、htmlファイルを作成する際はDOCTYPE宣言をします。
どのバージョンでhtmlが書かれているのかを示した記述で、一行目に必ず宣言します。
下記サンプルの<!DOCTYPE html>の部分がその記述にあたります。
この<!DOCTYPE html>はhtml5の使用に基づいて書かれたドキュメントということになります。
その下の<html lang=”ja”>とはwebページの主要な言語を指定するもので、jaは日本語を意味しています。
全てのhtmlにはDOCTYPE宣言、htmlタグ、headタグ、bodyタグが必ず記述されています。これが、htmlファイルを作成するための基礎知識であり、骨格となる部分です。
関連記事
