文字エンコーディングの指定

Webページの文字エンコーディングを指定するために使用します。一般的にはUTF-8を指定するのが標準です。

<meta charset="UTF-8">

これにより、ページの文字コードがUTF-8として解釈され、文字化けを防ぐことができます。

レスポンシブデザインの設定

スマートフォンやタブレットで適切に表示されるように、ビューポートを設定できます。

<meta name="viewport" content="width=device-width, initial-scale=1.0">

この設定により、画面の幅に合わせてレイアウトが調整され、拡大縮小の初期値も設定できます。

検索エンジン向けの説明文

検索結果に表示される説明文（meta description）を設定できます。

<meta name="description" content="このページの簡単な説明をここに記述">

適切な説明文を設定することで、検索結果のクリック率を向上させることができます。

キーワードの指定

検索エンジン向けにキーワードを設定できますが、現在ではほとんどの検索エンジンが無視しています。

<meta name="keywords" content="HTML, metaタグ, SEO, 設定">

かつてはSEOに有効でしたが、現在ではほぼ不要です。

ページのリフレッシュやリダイレクト

一定時間後にページを更新したり、リダイレクトしたりすることができます。

<meta http-equiv="refresh" content="5; url=https://example.com">

この例では、5秒後に「https://example.com」にリダイレクトします。

検索エンジンのクロール制御

検索エンジンのクロールやインデックスの制御が可能です。

<meta name="robots" content="noindex, nofollow">

この設定により、検索エンジンがページをインデックスしないようになります。

キャッシュの制御

ページのキャッシュを制御し、常に最新の状態を表示させることができます。

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">

<meta http-equiv="Pragma" content="no-cache">

<meta http-equiv="Expires" content="0">

これらを設定することで、ブラウザのキャッシュを防ぎます。

OGPによるSNS向け設定

OGP（Open Graph Protocol）を使うことで、SNSでの共有時の見栄えを改善できます。

<meta property="og:title" content="ページのタイトル">

<meta property="og:description" content="ページの説明">

<meta property="og:image" content="https://example.com/image.jpg">

<meta property="og:url" content="https://example.com">

FacebookやTwitterなどでの共有時に適切な情報を表示できます。

http-equiv属性を使った制御

`http-equiv`属性を使うと、HTTPヘッダーと同様の動作をページ内で指定できます。

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

この例では、ページのMIMEタイプを指定しています。