概要
htmlのmetaタグってなんじゃい。
目次
そもそもmetaってなに?
概説(Wikipedia)
メタ(meta-)とは、「高次な-」「超-」「-間の」「-を含んだ」「ーを入れた」「-の後ろの」等の意味の接頭語。ギリシア語から。
例えば物質界の現象を超越した世界を取り扱う学問を「形而上学」というが、これは英語でmetaphysicsであり、physics(物理学)の後の学問として存在する(詳しくは「形而上学」の項を参照のこと)。
なに言ってるかよくわからないね。
狭義のメタ(Wikipedia)
ある対象を記述したものがあり、さらにそれを対象として記述するものを、メタな○○、あるいは単にメタ○○と呼ぶ。
ほう
広義のメタ(Wikipedia)
広義に、何かを取り込んだ何か、何かについての何か、といったものがメタと呼ばれる場合がある。たとえば、Wikipediaの記事一覧の一覧などはメタ的な記事の一つだろう。情報理論では、情報に付加されるそれ自身に関する情報がメタデータ(メタ情報)と呼ばれる。
へぇ
htmlのmetaタグっていう文脈でのmeta
とはつまり
何かについての何か
言い換えると
情報についての情報
つまり
サイト内情報についての情報
意訳すると(少し違うけど)
サイトの付属情報
結論htmlのmetaタグはなんなの?
htmlファイルのheadタグ内に記述する、サイトの付属情報
的な感じでしょうか。
<!DOCTYPE html>
<html lang="ja">
<head>
<!-- headタグの中にはWebサイトに関する情報(サイトの付属情報)を記述します -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="desctiption" content="ブラウザで検索したときに検索結果に表示される説明文です">
<title>This is title.</title>
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<!-- bodyタグの中に記述したものがブラウザに表示されます -->
Hello, World!
</body>
</html>
よく使うmetaタグ
charset
文字エンコーディングの設定。今はもうとりあえずUTF-8って書けばいいと思います。
<meta charset="UTF-8">
name="description"
googleの検索結果に表示されたりするページの説明です。
<meta name="description" content="ページの概説をここに書きます。">
name="viewport"
ビューポートの初期サイズに関する設定です。(モバイル端末のみで使用されます。)
レスポンシブ化するときとかに使うよ。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
http-equiv
プラグマディレクティブを定義します。属性名が http-equiv(alent) なのは、利用できる値のすべてが特定の HTTP ヘッダーの名前だからです。
<meta http-equiv="X-UA-Compatible" content="ie=edge">
metaタグの詳しい使い方
<meta>: 文書レベルメタデータ要素 - HTML: HyperText Markup Language | MDNを参照
ちなみに
ちなみにエディタ(下のはvscode)でhtmlの雛形一気に生成できるよ。
参考サイト
最後に
ここ違うよっていうところがあればいつでもコメントお待ちしております🙇♂️🙇♂️