HTMLメタタグの順序


16

SEO会社はそのよう私たちはHTMLメタタグの順序を変更する提案<title>とは、<meta name="description">最初の2つです。これは、検索エンジンがこれらの2つのタグを確実に利用できるようにするためだという。ドキュメントのヘッド内のタグの順序は重要ではないという印象を受けました。私は間違っていましたか?最初の2つのタグが常にtitleありdescription、そうでない場合は検索をあきらめると仮定する検索エンジンは本当にありますか?


回答:


15

あなたは正しいです。これらのタグの順序は、SEOには関係ありません。彼らはただ存在する必要があります。それが明らかに無知であると言う人は誰でも(そしてもちろんSEOビジネスを営んでいます。ため息)。


ソースまたはケーススタディを提供できますか?
s_hewitt

3
経験に基づいた単なる意見。トピックに関するSearchEngineWatchのディスカッションを次に示します-順序は関係ありません:forums.searchenginewatch.com/showthread.php?t
Ciaran

7

SEOの目的のために、順序は重要ではないかもしれませんが、セキュリティ、コンテンツ(キャラクター)の表示、読み込み速度などの他のことを考慮するときはそうではありません。このように、おおよそページの頭を注文することをお勧めします(構文にHTML5を想定):

<head>

これまでのドキュメントでは、非ASCII文字を使用するべきではなかったため、文字エンコードはまだ問題になりません。しかし、非ASCII文字を使用する可能性は、そのヘッドタグを開くと著しく上がります。それに応じて(また、プログラムまたはサーバーレベルで文字エンコードを宣言していないと仮定して)、次のステートメントを文字エンコード宣言にする必要があります。これは、文字エンコード文のスニッフィングを行うパーサー/ブラウザ/エージェントも満たします。

  <meta charset="utf-8">

次の2つ(X-UA-Compatibleおよびviewport)は、Bootstrapの人々によって推奨されています(最近v3.3.4として)。これらの推奨事項がパフォーマンスに基づいていることはほぼ肯定的ですが、私が言うことのほとんどは推測に基づくものです。

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

デバイスに依存しない設計/開発(デスクトップ以外の小規模なユーザーエージェントを含む)を検討している場合は、以下を含める必要があります。

  <meta name="viewport" content="width=device-width, initial-scale=1">

最後に、タイトル:

  <title>Ingenious Page Title</title>

次に、タイトルの直後にCSSを提供します(それらの間に「夏時間」はありません)。

  <link rel="stylesheet" href="stylesheet-1.css">
  <link rel="stylesheet" href="stylesheet-2.css">

ページレベルのスタイルを使用している場合、ここに移動します。これは主に、CSSの「カスケード」性、つまり同一レベルの特異性の最後のスタイル宣言(段落をターゲットとする2つのステートメントなどp)によるものです。外部スタイルのオーバーライドを簡単にするために(つまり、より詳細に使用することなく、または!important)、外部スタイルの後にページレベルのスタイルを配置する必要があります<link>。また、他のスタイルアセットの同時ダウンロードを妨げるため、ページレベルのスタイルで@importディレクティブを使用することはお勧めできません。

  <style>body{color:black;}</style>

これが、メタタグ、ファビコン、その他のクラフを配置するのが最も適切と思われるポイントです。ほとんどのメタタグの前にファビコンまたは類似のアセット(iOSアプリの画像など)がロードされるのは、これらのアセットのダウンロードがやや早く開始されるためです。

  <link rel="shortcut icon" href="favicon.ico">
  <link rel="apple-touch-icon" href="apple-icon.png">
  <meta name="description" content="Some information that is descriptive of the content">
  <meta name="generator" content="Microsoft FrontPage 2002">

レンダリングをブロック/遅延するため、スクリプトが必要な場合は、妥当な限り遅くロードしてください。それらがになければならない場合headhead</head>)の終了前にそれらをロードできます。後でロードできる場合は、bodyタグを閉じる前に配置します(</body>)。

  <script src="script-1.js"></script>
  <script src="script-2.js"></script>
</head>

インデックス作成ボット(つまり、検索エンジンスパイダー)がページ全体を消費することを考えると、ほとんどの場合、SEOの目的でメタタグの順序に多くの注意を払うことは重要ではないようです。それ以外の場合、どのようにページのコンテンツにインデックスを付けるか、後でそのインデックスを更新しますか?

私たちが知っていると思うすべてのこと、およびウェブ上で見つけるすべての推奨事項(GoogleやBing Webmaster Toolsなどの場所からでも)、Amazon、Googleのようなサイト、そして明らかに気にする他の人々このような非常に小さなパフォーマンスの向上については、これらのルールに従っていません。


一方でX-UA-Compatibleviewportアップルのタッチアイコンは、2010年に(比較的)まだ新しかった、すべてが使用されていました。HTML5は、文字セット宣言の長さにのみ影響しました。CSS、JS、およびイメージパイプラインは、CSSとJSの適用後のページの(再)レンダリングと同様に、当時の懸念事項でした。それにもかかわらず、私はこの情報を一箇所(headhtml文書の外)で見つけることができませんでした。
デビッド・エルドリッジ

@DavidEldridgeの良い答え。しかしapplication/ld+json、構造化データ用のスクリプトを含めるように回答を更新してみませんか?速度のために。どこに置くのがベストでしょうか?外部JavaScriptファイルとして扱う必要がありますか?
ブレンダンフォークト

2

機能の観点から、Bootstrapからの次のメタタグの順序が優れているようです。

    1) <meta charset="utf-8">
    2) <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    3) <title></title>
    4) <meta name="description" content="">
    5) <meta name="viewport" content="width=device-width, initial-scale=1">

Googleの人々によると、SEOにとって重要なのは

  1. モバイルに優しい
  2. タイトルと説明
  3. ユニークで価値のあるコンテンツ

サイトがモバイルフレンドリーでない場合は、2)または3)も見ません。モバイルフレンドリーの場合、サイトをリストするときにタイトルと説明を使用できます。それについての保証はありません。彼らはあなたのサイトで見つけたものに基づいて彼ら自身の説明を思い付くことを決めるかもしれません。

コンテンツが盗用されたり、繰り返し使用されていたり、キーワードを詰め込んだり、他の「BlackHat」テクニックを使用しようとすると、それらがあなたを傷つけ、場合によっては禁止します。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.