metaタグの使い方 <上級編⑬>

gold-163519_1280

metaタグはHTMLドキュメント上のhead要素内で使います。

メタタグを設定することで、
ウェブサイトのページ内の様々な設定をおこなうことができます。

titleタグほどではありませんが、設定することで、
ユーザビリティやクローラビリティの向上に役立つタグも存在します。



 

meta要素には、その要素の性質を規定する属性と、
content属性の2つの属性が必ずつきます。

たとえば、
<meta name=”description” content=”ーkazumiya’s net -” />

であれば、
name属性で「description(プロパティ名)」と記述することで、
そのmetaタグの性質を規定し、
どんな内容にするか(値)をcontent属性内で記述しています。

 

どのmetaタグも終了タグがない空要素ですので、
brタグやimgタグ同様、XHTMLに対応させる場合は、
タグ終了前に半角スペースと半角の斜線を記述します。



 

【name属性(中身はdescription)】

meta要素name属性(description)のタグは説明文タグとも呼ばれ、
検索エンジンに表示される自サイトのページの説明文に使われます。

content属性内に、全角90文字以内で文章を設定します。

検索エンジン上で、
titleタグに設定したリンク名の下のほうに表示されますので、
このタグを使用する場合は、ユーザビリティを考慮します。

現在このタグに、SEO的な意味はほとんどありません。

使用しない場合は、
検索エンジンが該当ページのコンテンツ内の文章を読み取り、
任意に適当な箇所を説明文として、検索エンジン上に映しだしてくれます。

説明文タグは無理やり入れようとすると不自然になります。

検索エンジン結果にでてくる自サイトのページの説明を、
自分で決めたい場合のみに、使っていくといいでしょう。

 

【name属性(中身はkeywords)】

meta要素name属性(keywords)のタグは、
そのページに関連性のある単語を、
content属性内に複数記述することで、
検索エンジンのクロールを促す、という効果があります。

しかし現在では過度な使用はスパム扱いされるタグとなっており、
ちまたでは使わないほうがいいタグ、とすら言われています。

keywordsメタタグは、トップページだけに使用し、
各コンテンツぺージには使用しないという差別化をはかることで、
若干トップページをSEO的に上に立たせることができる、
という効果があります。



 

【http-equiv属性】

meta要素http-equiv属性は、
そのページで使用する言語や文字の設定に関わってくるタグです。

最も重要なのが文字コードの設定に関わるmetaタグで、
これをしっかり設定することでコンテンツの文字化けを防げます。

今後はUTF-8というコードが標準となっていきますので、
なるべくUTF-8を設定しましょう。

設定のやり方は、http-equiv属性の中身をContent-Typeと記述し、
content属性の中身を、
「text/html; charset=UTF-8」という風に記述します。

他、

ページ内でスタイルシート(CSS)を使う場合は、
http-equiv属性内にContent-Style-Typeと記述し、
content属性にtext/cssと記述。

JavaScriptを使う場合は、
http-equiv属性内にContent-Script-Typeと記述し、
content属性にtext/javascriptと記述するのが基本です。

関連記事

コメントは利用できません。

カテゴリー

ページ上部へ戻る