12,964
回編集
「HTML - headタグ」の版間の差分
ナビゲーションに移動
検索に移動
→概要
(→概要) |
|||
| 1行目: | 1行目: | ||
== 概要 == | == 概要 == | ||
metaタグは、HTMLドキュメントに関するメタデータ (データについてのデータ) を定義するための要素である。<br> | |||
通常、head要素内に配置されて、ページの内容そのものは表示されないが、Webブラウザや検索エンジンに重要な情報を提供する。<br> | |||
<br> | |||
基本的な書式を以下に示す。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta name="キー名" content="値"> | |||
<meta http-equiv="キー名" content="値"> | |||
<meta property="キー名" content="値"> | |||
</syntaxhighlight> | |||
<br> | |||
主な用途として、文字エンコーディングの指定がある。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta charset="UTF-8"> | |||
</syntaxhighlight> | |||
<br> | |||
また、ページの自動リフレッシュやリダイレクトにも使用できる。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta http-equiv="refresh" content="5;url=https://example.com"> | |||
</syntaxhighlight> | |||
<br> | |||
これらのmetaタグを適切に設定することにより、WebサイトのSEO対策、ソーシャルメディアでの表示制御、ブラウザの動作制御等、様々な目的を達成することができる。<br> | |||
<br> | |||
特にSEOやスマートフォン対応では、適切なmetaタグの設定が非常に重要となる。<br> | |||
<br><br> | |||
== 文字エンコーディングの指定 == | |||
<syntaxhighlight lang="html"> | |||
<meta charset="UTF-8"> | |||
</syntaxhighlight> | |||
<br><br> | |||
== Open Graph Protocol == | |||
SNSでシェアされる際の表示を制御するOpen Graph Protocolにも使用される。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta property="og:title" content="ページのタイトル"> | |||
<meta property="og:description" content="ページの説明"> | |||
<meta property="og:image" content="シェア時の画像URL"> | |||
</syntaxhighlight> | |||
<br><br> | |||
== ページの自動リフレッシュやリダイレクト == | |||
ページの自動リフレッシュやリダイレクトにも使用できる。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta http-equiv="refresh" content="5;url=https://example.com"> | |||
</syntaxhighlight> | |||
<br><br> | |||
== キャッシュの制御 == | |||
キャッシュの制御も可能である。<br> | |||
<syntaxhighlight lang="html"> | |||
<meta http-equiv="cache-control" content="no-cache"> | |||
</syntaxhighlight> | |||
<br><br> | <br><br> | ||