Reihenfolge der HTML-Meta-Tags

15

Ein SEO Unternehmen vorgeschlagen , dass wir den Auftrag unserer HTML - Meta - Tags , so dass zu ändern <title>und <meta name="description">sind die ersten beiden. Sie sagen, dies soll sicherstellen, dass Suchmaschinen diese beiden Tags verwenden können. Ich hatte den Eindruck, dass die Reihenfolge der Tags im Kopf des Dokuments nicht signifikant ist. Habe ich mich geirrt Gibt es wirklich Suchmaschinen, die davon ausgehen, dass die ersten beiden Tags immer titleund descriptionund aufhören, sie zu suchen, wenn dies nicht der Fall ist?

seo html meta-tags Kaivosukeltaja
quelle
Siehe auch Stack Overflow: Kann sich das Hinzufügen von Link- und Metatags auf dem Kopf einer Webseite nachteilig auswirken?
oder

Antworten:

15

Du hast Recht. Die Reihenfolge dieser Tags spielt für SEO keine Rolle. Sie müssen nur anwesend sein. Wer auch immer das gesagt hat, ist offensichtlich ahnungslos (und führt natürlich ein SEO-Geschäft. Seufz).

John Conde
quelle
Können Sie eine Quelle oder eine Fallstudie bereitstellen?
s_hewitt
3
Nur eine Meinung, die auf Erfahrung basiert. Hier ist eine SearchEngineWatch-Diskussion zum Thema - Bestellung spielt keine Rolle: forums.searchenginewatch.com/showthread.php?t=16452
Ciaran
6

Während für die Zwecke der Suchmaschinenoptimierung die Reihenfolge möglicherweise nicht von Bedeutung ist, trifft dies nicht zu, wenn andere Aspekte wie die Sicherheit, die Anzeige von Inhalten (Zeichen) oder die Ladegeschwindigkeit berücksichtigt werden. Es ist eine gute Idee, den Kopf Ihrer Seite ungefähr so ​​zu ordnen (vorausgesetzt HTML5 für die Syntax):

<head>

Bisher sollten Sie in dem Dokument keine Nicht-ASCII-Zeichen verwenden, sodass die Zeichenkodierung noch kein Problem darstellt. Die Wahrscheinlichkeit, Nicht-ASCII-Zeichen zu verwenden, steigt jedoch deutlich an, sobald Sie dieses Head-Tag öffnen. Dementsprechend (und unter der Annahme, dass Sie Ihre Zeichenkodierung nicht programmgesteuert oder auf Serverebene deklarieren) sollten Sie die nächste Anweisung als Zeichenkodierungsdeklaration festlegen. Dies erfüllt auch Parser / Browser / Agenten, die nach Zeichencodierungsanweisungen suchen würden:

  <meta charset="utf-8">

Die folgenden zwei ( X-UA-Compatibleund viewport) werden von den Leuten bei Bootstrap empfohlen (erst kürzlich als v3.3.4). Ich bin mir fast sicher, dass diese Empfehlungen auf Leistung basieren, aber das meiste, was ich sagen würde, wäre spekulativ:

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

Wenn Sie an ein geräteunabhängiges Design / Entwicklung denken (einschließlich kleinerer Benutzeragenten, die keine Desktop-Benutzeragenten sind), sollten Sie Folgendes einbeziehen:

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

Zum Schluss der Titel:

  <title>Ingenious Page Title</title>

Als nächstes bieten Sie das CSS so bald wie möglich nach dem Titel an (kein "Tageslicht" dazwischen):

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

Wenn Sie Stile auf Seitenebene verwenden, werden diese hier angezeigt. Dies liegt hauptsächlich an der Kaskadierung von CSS: der letzten Deklaration von identischen Spezifitätsebenen (z. B. zwei Anweisungen, die auf einen Absatz abzielen p). Um das Überschreiben externer Stile zu vereinfachen (dh ohne größere Spezifität zu verwenden oder !important), sollten Sie Stile auf Seitenebene hinter externe Stile setzen <link>. Es ist im Allgemeinen auch nicht ratsam, die @ import-Direktive in Stilen auf Seitenebene zu verwenden, da dies das gleichzeitige Herunterladen anderer Stilelemente behindert:

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

Dies ist der Punkt, an dem es am besten erscheint, Meta-Tags, Favicons und andere Cruft zu platzieren. Es ist zu vermuten, dass Favoriten oder ähnliche Elemente (z. B. iOS-App-Bilder) vor den meisten Metatags geladen werden, da das Herunterladen dieser Elemente geringfügig früher gestartet wird.

  <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">

Da das Rendern blockiert / verzögert wird, sollten Sie Skripte, die Sie benötigen, so spät wie möglich laden. Wenn sie sich in der befinden müssen head, können Sie sie vor dem Schließen der head( </head>) laden . Wenn Sie sie später laden können, setzen Sie sie vor das Ende des bodyTags ( </body>).

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

In den meisten Fällen scheint es unwichtig, der Reihenfolge der Meta-Tags für SEO-Zwecke viel Aufmerksamkeit zu schenken, da Indizierungs-Bots (dh Suchmaschinen-Spinnen) die gesamte Seite verbrauchen werden. Wie würden sie andernfalls den Inhalt einer Seite indizieren oder diesen Index später aktualisieren?

Es fällt mir auf, dass Websites wie Amazon, Google und andere Personen, die sich eindeutig dafür interessieren, bei allem, was wir zu wissen glauben und bei allen Empfehlungen, die wir im Web finden (auch von Orten wie Google und Bing Webmaster Tools usw.) Über solche winzigen Leistungssteigerungen halten Sie sich nicht an diese Regeln.

David Eldridge
quelle
Während X-UA-Compatible, viewportund Apple Touch - Symbole waren noch (relativ) neue im Jahr 2010 waren alle im Einsatz. HTML5 wirkte sich nur auf die Länge der Zeichensatzdeklaration aus. CSS, JS und Image Pipelining waren damals ein Thema, ebenso wie das (Re-) Rendering von Seiten nach der Anwendung von CSS und JS. Ungeachtet dessen konnte ich diese Informationen nicht an einer Stelle (außerhalb der heads von HTML-Dokumenten) finden, und nachdem ich über diese Frage gestolpert war, schien es gut, dies hier zu tun.
David Eldridge
Gute Antwort @ DavidEldridge. Aber würde es Ihnen etwas ausmachen, Ihre Antwort zu aktualisieren, um application/ld+jsonSkripte für strukturierte Daten einzuschließen? Aus Geschwindigkeitsgründen. Wo wäre es am besten, es zu platzieren? Sollen wir es als externe JavaScriptDateien behandeln?
Brendan Vogt
2

Aus funktionaler Sicht scheint das Folgende aus Bootstrap die bessere Reihenfolge der Meta-Tags zu sein: 

    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">

Laut den Leuten bei Google ist das, was für SEO wichtig ist

  1. mobil freundlich sein
  2. Titel und Beschreibung
  3. einzigartiger und lohnender Inhalt

Wenn Ihre Website nicht für Handys geeignet ist, sehen sie sich nicht einmal 2) oder 3) an. Wenn es für Handys geeignet ist, können sie den Titel und die Beschreibung verwenden, wenn sie Ihre Website auflisten. Keine Garantie dafür. Sie können sich dazu entschließen, eine eigene Beschreibung zu erstellen, die auf dem basiert, was sie auf Ihrer Website finden.

Wenn Ihr Inhalt plagiiert oder wiederholt ist und Sie versuchen, ihn mit Stichwörtern zu füllen oder andere "BlackHat" -Techniken zu verwenden, verletzen Sie diese Dinge und verbieten Sie möglicherweise.

Michael Moriarty
quelle