・ページの情報 <head>~</head>
書式 | <head>~</head> |
---|---|
タグの分類 | html要素の子要素 |
(用途)
Webブラウザにheadタグに記載したページの情報を渡して、表示してもらうようにします。
(注意)
検索順位を上位表示するための対策のことを「SEO対策」と言いますが、headに書く情報はこのSEO対策に大きく関係してきます。
検索順位の決定はGoogleがおこなっているため、metaタグとlinkタグを使って適切にwebページの情報を書くことはwebサイトを検索上位に表示することに繋がっていきます。
(内容)
headタグは、HTML全体に影響する情報が含まれるタグです。
htmlでwebサイトを作成する時のコードを大きくわけると次のように「headタグ」と「bodyタグ」に分かれています。そしてそれぞれの役割は以下のようになっています。
headに書くタグは大きく分けて「**metaタグ」**と「linkタグ」の2種類になります。
metaタグにはそのWebサイトの「文字コード」「説明文」「作成者」などを書き、linkタグには外部のWebページとの関係性やcss・javascriptファイルの読み込み先などを書きます。
す。
・文字コードの指定 <meta carset=”UTF-8”>
書式 | <meta carset=”UTF-8”> |
---|---|
タグの分類 | head要素の子要素、空要素(metaデータ) |
(用途)
文字化けを防ぐために、文字コードを指定します。
(内容)
主にWebページの情報に関するmetaデータを書くためのタグです。この部分はheadに書く情報の中でも基本的な部分です。
webページの文字コードを指定するためのmetaタグです。
<meta charset="utf-8">
文字化けを防ぐために必ず書いておきます。
タグの後ろに半角スペース区切りで入力し、そのタグに付加的な意味を与えるものは一般に「属性(Attribute)」と呼ばれます。
charset属性にはページの記述で使用されている文字コードを指定するための属性です。
過去にはShift_JISやEUC-JPなどの日本語専用の文字コードも使用されましたが、現在では世界中の文字を収めた
UnicodeのUTF-8を使用するのが主流です。
(英語の意味)
meta(メタ):付帯情報、データ本体ではなくそのデータの説明書き
charset=charactor set(文字セット、文字集合)
・ページの説明文 <meta name = “description” content=”~”>
書式 | <meta name = “description” content=”~”> |
---|---|
タグの分類 | head要素の子要素(metaデータ) |
(用途)
ユーザーが検索した時にどんなサイトなのかを判断できるように、説明文を書く
(内容)
検索エンジン対策で指定するページの「説明文」や「キーワード」については、<meta name=にてname属性とcontent属性の両方を記述します。
そのページの説明文を記述する際、まずはname属性に「説明文」の意味の「description」を指定します。次に、その実際の内容をcontentの箇所に記述することになります。
<meta name="description" content="**ページの説明文**">
<meta name=”description” content=”〇〇”>に書いたテキストは検索結果の説明文に使用されます。ユーザーが検索した時にどんなサイトなのかを瞬時に判断できるように、必要な
キーワードを混ぜて記述。
表示される文字数が約120字と制限があるので説明文を全て表示したい場合は意識します。
120文字を超えたからといって検索順位が下がるということはなく200文字〜300文字のdescriptionでも上位表示しているwebサイトは多くあります。大切なのは「簡潔かつ正確にページの概要を書く」ということです。
(英語の意味)
description:説明
・ページのタイトル <title>~</tilte>
書式 | <title>~</tilte> |
---|---|
タグの分類 | head要素の子要素(metaデータ) |
(用途)
ページの内容を簡潔に表し、検索した方に何のページか分かるようにする。
(内容)
そのページの内容を一言で表したものをtitleに記述します。
<title>ページのタイトル</title>
titleに書いたテキストは検索結果やブラウザのタブ名に使用されます。
Googleの検索結果に表示されるタイトルの文字数には制限があるため、日本語で30~33文字以内で作成することが理想的です。
tatleがシンプルすぎるからといって、検索順位が下がるということはありません。大切なのはいかに的確にページの内容を伝えるかです。
(英語の意味)
title:内容を短く表した言葉