meta情報指定｜ネットショップの作り方

現在地: Home » ネットショップの作り方 » ネットショップ作成 » meta情報指定

ネットショップ作成

meta情報指定

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" -----1
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> -----2
<head>
<meta http-equiv="Content-Style-Type" content="text/css" /> -----3
<meta http-equiv="Content-Script-Type" content="text/javascript" /> -----3
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> -----4
<meta name="description" content="ウェブサイトの内容説明" /> -----5
<meta name="keywords" content="キーワード,キーワード,キーワード" /> -----5
<title>サンプルネットショップ</title> -----6
<link rel="stylesheet" href="base.css" type="text/css" media="screen" />-----7
</head>

1：部分

サンプルのネットショップはXHTML1.0 Transitionalで記述しています。尚、IE6対策の為XML宣言は記述していません。ご自身のレベルに合わせて変更して下さい。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

上記を使用の場合はmetaタグ内の最後の[/]を削除の事。

2：部分

上記のHTML4.01 Transitionalで記述の際は、下記ソースに書き換え。

<html lang="ja">

3：部分

記述必須項目

4：部分

文字コードです。この他によく使われるのは「UTF-8」「EUC-JP」「ISO-2022-JP」

5：部分

昔は検索エンジン対策として有効でしたが、現在ではSEOとしてはさほど重要性は高くない。しかしながら、一部ブラウザの検索結果にはmeta name="description"部分が表示されるので、一応記述しておきましょう。

ユーザーが興味を引くような文面が望ましいです。因みにGoogleでは下記のように説明しています。

ぞれぞれのページに合った説明を作成する。
検索結果に表示される個々のページについて、同じまたは同様の説明を使用しても有効ではありません。型どおりの説明は表示される可能性が低くなります。個々のページを正確に表す説明を記述してください。メインのホームページや他の総合ページにはサイトの説明を使用し、その他の部分には各ページの説明を使用します。すべてのページの説明を記述する余裕がない場合は、コンテンツに優先順位を付けます。少なくとも、ホームページや人気のあるページなどの重要な URL には説明を作成してください。

明確な情報を説明に含める。
メタタグの説明は、文章形式とする必要はありません。ページの体系的なデータを記述することもできます。たとえば、ニュースやブログの投稿の場合は、作者、公開日、署名などをリストできます。これにより、スニペットには表示されない関連性の高い情報をユーザーに提供できます。同様に、商品ページの場合は、価格、発売年、メーカーなど、ページのさまざまな場所に記載された重要な情報を記述できます。これらのデータをすべてまとめて記述すると、効果的なメタタグの説明になります。

<META NAME="Description" CONTENT="著者: A.N. Author, イラストレーター: P. Picture, カテゴリ: 書籍, 価格: 17.99 米ドル, ページ数: 784 ページ">

以上、引用Google:効果的なメタタグの説明を記述する方法

サンプルサイトでは、meta name="description"部分を検索結果に表示しない検索サイト用にXHTML上で<body>の直後にmeta name="description"部分にあたる記述を入れています。この部分にページのキーワードを混ぜて記述するとSEO上でも効果が出ます。

<body>
<p class="description">*****各ウェブページの説明を入力(商品キーワードを入れると効果的)*****</p>
<div id="wrapper">

meta name="description"部分と<p class="description">部分は同じ文章を記述すれば良いので、効率的です。ただしブラウザ上でデザイン面からみると、あまり長文は記述できません。サンプルサイトでは横幅830px内に収まるような文書が望ましいです。

サンプルサイト

6：部分

SEO上、最も重要な部分です。時間をかけて十分に練り上げたタイトル記述をしましょう。

Googleでは、各ページ毎に用意する事。各ページ内で最も重要なトピックを示すようにしなさいと言っています。下記はGoogleが掲載している適切な記述例です。

不適切な例:
<title>ホーム</title>

適切な例:
<title>Webmaster Central ホームページ</title>

最適な例:
<title>Webmaster Central ホームページ | 検索エンジンに対応するためのウェブマスター向けのヒントやツール</title>

避けるべき例 (不正なサイトと見なされる可能性がある):
<title>Webmaster Central seo 最適化 検索エンジン 検索エンジン google ウェブ検索 google 検索結果 
 検索結果の改善 seo 検索の最適化 serps の検索</title>

以上、引用Google:TITLE タグと ALT 属性の説明をわかりやすく正確なものにする

7：部分

赤字部分を、ご自身が作成したファイル名に変更。

Next；会社情報等の指定

▲Top