[HTML]head要素
はじめに
今日はhead要素の記述内容について学習しました。
HTML文書のメタデータ
メタデータとは、HTMLでは“その文書に関する様々な情報”を意味します。
HTML文書のメタデータは、head要素の中に、
などのタグで指定します。
これらのタグで表現できないその他の様々なメタデータは、<meta>で表します。
文字コードの指定
HTML文書では文字コードを指定する必要があります。
<meta charset="utf-8">
- UTF-8はユニコードを表示する指定。近年の標準、特別な理由がない限りこれを選ぶ
- HTMLファイル出力時の文字コードと、meta要素の文字コード指定は必ず一致させる
- HTML文書では改行コードを指定するところはない
title要素
文書にタイトルをつけるタグです。省略はできません。
ここに記述したタイトルはブラウザのツールバーに表示、お気に入り登録時や検索エンジンの結果にも表示されます。SEO上重要な要素でもあります。
- ですます表現で記述しない
- “キーワード”(半角スペース)“カテゴリ”|”ユニーク語句"
- キーワード:開店間近・新規オープンなどサービスの特徴
- カテゴリ:カフェ、病院などカテゴリ
- ユニーク語句:店名など個別のもの
link要素
リンクする外部リソースを指定する際に使用します。
外部リソースとは、現在の文書ファイルに関連する外部ファイルのことです。
<link rel="stylesheet" href="style.css">
リンク要素には、href属性とrel属性が必須です。
href属性には、リンクする外部ファイルのURLを指定します。
rel属性にはリンクタイプを指定します。具体的には、現在のファイルとリンク先の外部ファイルとの関係性を表すキーワードを指定します。
代表的なキーワード値
- stylesheet:スタイルシートをインポート
- alternate:現在文書の代替表現を指定
その他の属性
- 外部リソースの対象メディアを指定するmedia属性
- 外部リソースの言語を指定するhreflang属性
- リンクする外部リソースのMIMEタイプを指定するtype属性
- アイコンのサイズを指定するsizes属性