ドキュメントのhead内に入れるべき重要なメタタグは何ですか？

Question

Accepted Answer

``タグはページに関するメタデータを提供します — 文字エンコーディング、ビューポート動作、SEOの説明、およびソーシャル共有プレビューです。レンダリングされませんが、ブラウザ、検索エンジン、およびソーシャルプラットフォームによって読み込まれます。 ## 必須の2つ ```html ``` - **`charset`**はテキスト（特に非ASCII）が正しくデコードされることを確認します。最初に配置してください。 - **`viewport`**は、サイトをモバイルで**レスポンシブ**にするものです — これがないと、携帯電話は偽の980px幅でレンダリングしてズームアウトし、レスポンシブなCSSを破壊します。 ## SEOメタ ```html Page Title — 50–60 chars ``` ``と`description`はGoogleの検索結果に表示される内容なので、クリックスルーを促進します。`canonical`は検索エンジンに正式なURLを伝えます。 ## Open Graph — ソーシャル共有プレビュー ```html <meta property="og:title" content="Shareable title" /> <meta property="og:description" content="Shown when shared" /> <meta property="og:image" content="https://site.com/preview.jpg" /> <meta property="og:url" content="https://site.com/page" /> <meta name="twitter:card" content="summary_large_image" /> ``` これらはリンクがFacebook、LinkedIn、Slack、Xなどで共有されるときに表示されるカードを制御します — これらがないと、醜いまたは空のプレビューが表示されます。 ## なぜ重要なのか `charset`と`viewport`は正しいレンダリングとモバイルレスポンシブネス性のために非交渉です。`title`/`description`/`canonical`はSEOを促進します。Open Graphタグはリンクが共有されるときの見え方を制御します。まとめると、これらはページを正しくレンダリングし、ランクをつけ、よく共有されるようにするメタデータレイヤーです。