HTML ヘッダー
head要素は文書のヘッダ部分を指定するタグです。htmlタグのあと、bodyタグの前に書きます。
文書のタイトル、作者情報、サーチエンジン向けのキーワードや説明、スクリプト(script)とスタイルシート(CSS)など、その文書に関する情報を記述します。
metaタグの一部
charset=”UTF-8″
日本では、「UTF-8」、「Shift_JIS」、「EUC-JP」の3つがよく使われている文字コード(文字エンコーディング)です。HTMLでは UTF-8 を使用することが推奨されています。変更せずにこのままでいいです。
name=”keywords”
キーワードを指定する属性です。現在SEO対策に一切関係していないので、この属性は無視してもいいと考えます。
<meta name="keywords" content="HTML, CSS, JavaScript, PHP ">
name=”author”
著者情報です。特に重要ではありませんが、ページ作成者の個人名や企業名を書いたりします。
<meta name="author" content="haku">
name=”description
検索エンジンの検索結果にも引用される重要なmeta要素で、キーワードを効果的に散りばめて記述すればそれだけでもSEO的な効果が期待できます。(検索エンジン最適化)
現在、Googleでのディスクリプションの表示数はPCが120文字前後、スマートフォンが50文字前後と言われております。
<meta name="description" content="…">
name=”format-detection”
各種スマートフォンやタブレット端末では、電話番号や住所またはメールアドレスだと推測される文字列があると自動でリンクが貼られます。
この機能を制御するのが「format-detection」です。
「telephone=no,address=no,email=no」の場合は、すべての自動リンクを無効化しています。
<meta name=”format-detection” content=”telephone=no,address=no,email=no”>
titleタグ
titleタグは文書にタイトルをつけるタグです。
タイトルとして記述された内容はWebブラウザの上部タイトルバーや検索結果のタイトル、ブックマークに入れた時のタイトルとしても表示されます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>タイトル</title>
</head>
<body>
内容
</body>
</html>
linkタグ
現在の文書と外部のリソースとの関係を指定します。このタグはスタイルシート(CSS)へのリンクに最もよく使用されます。
CSSについては次のページで説明します。
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
styleタグ
スタイルシートを記述するためのタグです。
<html>
<head>
<title>タイトル</title>
<style type="text/css">
body {
background-color:yellow;
}
p { color:black }
</style>
</head>
<body>
<p>
ここにテキストが入ります。
</p>
</body>
</html>
scriptタグ
JavaScriptなどのスクリプトを文書内に埋め込んだり外部スクリプトを読み込んだりするために使用するタグです。
<script> 要素については、後の章で詳しく説明します。
コメント