HTML ヘッダーエレメント

更多实例

ドキュメントのタイトル
<title>タイトルはドキュメントのタイトルを定義します。
すべてのリンクのターゲット
baseタグを使用してページ内のすべてのリンクを新しいウィンドウで開く方法
ドキュメントの説明
<meta>要素を使用してドキュメントを説明します。
ドキュメントのキーワード
<meta>要素を使用してドキュメントのキーワードを定義します。
ユーザーをリダイレクトする
ユーザーを新しいURLにリダイレクトする方法

HTML <head>要素

<head>要素はすべてのヘッダーエレメントのコンテナです。<head>内の要素はスクリプト、スタイルシートの場所を指定する、メタ情報を提供するなどが含まれます。

以下のタグは head 部分に追加できます:<title>、<base>、<link>、<meta>、<script>、および <style>。

HTML <title> 要素

<title> タグはドキュメントのタイトルを定義します。

title 要素はすべての HTML/XHTML ドキュメントで必須です。

title 要素は以下のことができます:

  • ブラウザツールバーに表示されるタイトルを定義
  • ページがブックマークに追加された際に表示されるタイトル
  • 検索エンジン結果に表示されるページタイトル

簡略化された HTML ドキュメント:

<!DOCTYPE html>
<html>
<head>
<title>ドキュメントのタイトル</title>
</head>
<body>
ドキュメントの内容......
</body>
</html>

HTML <base> 要素

<base> タグはページ上のすべてのリンクにデフォルトのアドレスやデフォルトのターゲット(target)を指定します:

<head>
<base href="http://www.codew3c.com/images/" />
<base target="_blank" />
</head>

HTML <link> 要素

<link> タグはドキュメントと外部リソースの関係を定義します。

<link> タグは最もよくスタイルシートをリンクするために使用されます:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

HTML <style> 要素

<style> タグは HTML ドキュメントにスタイル情報を定義するために使用されます。

style 要素内で、ブラウザで表示される HTML 要素のスタイルを指定できます:

<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>

HTML <meta> 要素

メタデータ(metadata)はデータに関する情報です。

<meta> タグは HTML ドキュメントに関するメタデータを提供します。メタデータはページに表示されませんが、機械が読み取れる形式です。

典型的なケースでは、meta 要素はページの説明、キーワード、ドキュメントの著者、最終更新日時、その他のメタデータを定義するために使用されます。

<meta> タグは常に head 要素内に位置します。

メタデータは、ブラウザ(コンテンツの表示方法やページのリロード)、検索エンジン(キーワード)、または他のウェブサービスに使用できます。

検索エンジン向けのキーワード

一部の検索エンジンは、meta 要素の name と content 属性を使用して、あなたのページをインデックス化します。

以下の meta 要素は、ページの説明を定義します:

<meta name="description" content="Free Web tutorials on HTML, CSS, XML" />

以下の meta 要素は、ページのキーワードを定義します:

<meta name="keywords" content="HTML, CSS, XML" />

name と content 属性の役割は、ページの内容を説明することです。

HTML <script> 要素

<script> タグは、JavaScriptなどのクライアントサイドのスクリプトを定義するために使用されます。

script 要素についての説明は、後の章で行います。

HTML ヘッダーエレメント

タグ 説明
<head> ドキュメントに関する情報を定義します。
<title> ドキュメントのタイトルを定義します。
<base> ページ上のすべてのリンクのデフォルトのアドレスまたはデフォルトのターゲットを定義します。
<link> ドキュメントと外部リソースの関係を定義します。
<meta> HTML ドキュメントに関するメタデータを定義します。
<script> クライアントサイドのスクリプトを定義します。
<style> ドキュメントのスタイル情報を定義します。