Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】meta要素の使い方

meta要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

metaオブジェクトは、HTMLドキュメントに関するメタデータ、つまり付加的な情報を定義するオブジェクトです。この要素は、ウェブページそのものの内容ではなく、そのページがどのように表示されるべきか、誰によって作成されたか、どのような情報を含んでいるかといった、ドキュメントのさまざまな特性をブラウザや検索エンジン、その他のウェブサービスに伝えるために使用されます。

meta要素は常に<head>要素内に配置され、通常はウェブページの閲覧者には直接表示されません。しかし、その情報はページの振る舞いや表示に不可欠な役割を果たします。

具体的な用途としては、以下のようなものがあります。charset属性を用いて、ページの文字エンコーディング(例: UTF-8)を指定し、文字化けを防ぎます。name属性とcontent属性を組み合わせて、ページの概要(description)やキーワード(keywords)、著者情報(author)などを提供し、検索エンジンのインデックス作成に役立てます。name="viewport"content属性で、モバイルデバイスでの表示領域(ビューポート)の設定を行い、レスポンシブデザインを実現します。http-equiv属性とcontent属性を用いて、ブラウザの動作を制御することも可能です。例えば、一定時間後にページを自動的に更新したり、別のURLへリダイレクトしたりする設定ができます。また、Open Graphプロトコルなどのソーシャルメディア共有に関する情報を定義し、SNSでの表示を最適化するためにも利用されます。

このように、meta要素は、ウェブドキュメントの背後にある重要な設定や情報を伝えることで、ユーザーエクスペリエンス、検索エンジン最適化(SEO)、互換性などを向上させる基盤となる非常に重要な要素です。

公式リファレンス: <meta>: The metadata element

構文(syntax)

1<meta charset="utf-8">

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ