<head>タグは、文書のヘッダ情報を表す際に使用します。
文書のヘッダ情報とは、そのHTML文書に関する情報(メタデータ)を集めたものです。
文書のヘッダ情報は、例えば以下などが該当します。
これらのメタデータはすべて<head>~</head>の内側に配置します。
head要素内のメタデータの量は、多くても少なくてもかまいません。
title要素はほとんどの状況でhead要素の子要素として必須となりますが、
より高いレベルのプロトコルでタイトル情報が提供される場合には省略できます。
例えば、電子メール作成フォーマットとしてHTMLが使用される際に、
電子メールの件名でタイトル情報が提供される場合にはtitle要素を省略できます。
以下のサンプルでは、head要素内にはtitle要素しかありません。
<!doctype html>
<html lang=ja>
<head>
<title>head要素の内容が少ない文書の例</title>
</head>
<body>
...
次に、head要素内のメタデータの記述が長いサンプルを示します。
<!DOCTYPE HTML>
<HTML LANG="JA">
<HEAD>
<META CHARSET="UTF-8">
<BASE HREF="https://www.example.com/">
<TITLE>head要素の内容がより多い文書の例</TITLE>
<LINK REL="STYLESHEET" HREF="default.css">
<LINK REL="STYLESHEET ALTERNATE" HREF="big.css" TITLE="Big Text">
<SCRIPT SRC="support.js"></SCRIPT>
<META NAME="APPLICATION-NAME" CONTENT="Long headed application">
</HEAD>
<BODY>
...
余談ですが、上記サンプルのように要素や属性などを大文字で記述するのは、HTML4時代の名残かもしれません。
HTML Living StandardではHTMLの要素や属性などは小文字で定義されていますが、
実際にウェブページを作成する際には大文字・小文字のどちらでもかまいません。
上記サンプルは、以下のように記述しても同じです。
<!doctype html>
<html lang="ja">
<HEAD>
<meta charset="utf-8">
<base href="https://www.example.com/">
<title>head要素の内容がより多い文書の例</title>
<link rel="stylesheet" HREF="default.css">
<link rel="stylesheet alternate" href="big.css" title="Big Text">
<script src="support.js"></script>
<meta name="application-name" content="Long headed application">
</head>
<body>
...