Ich habe diesen Beitrag für eine Weile in Entwürfen gehabt, hauptsächlich als Container, in den ich Teile fallen kann, wenn ich Zeit habe, ihn in einen richtigen Newsletter zu erweitern.

Dann veröffentlichte mein guter Freund Jono Alderson sein ausgezeichnetes Stück über semantische HTML, und für ein paar Wochen verlor ich den Willen, meine zu vervollständigen.

Aber ich dachte, ich sollte meine Version sowieso beenden, da mein Fokus etwas anders und vielleicht etwas praktischer ist als Jonos.

Sie sollten Jonos Blog immer noch auf jeden Fall lesen. Es sagt alles, was ich sagen möchte und mehr.

Semantische HTML

Beginnen wir mit einem kurzen Überblick darüber, was semantische HTML ist.

Während die Sprache, auf der das Web erstellt wird, ist HTML ein Markup, der Text umgibt, um es mit Struktur zu versorgen.

Der

Tag um einen Inhaltsblock zeigt an, dass es sich um einen Textabsatz handelt.

Der

Etwas um einen Satz zeigt, dass es sich um die Hauptüberschrift der Seite handelt.

Der

Tag gibt den Beginn einer geordneten (normalerweise nummerierten) Liste an.

Der Tag gibt an, dass Sie ein Bild auf die Webseite laden. Und so weiter.

Semantisches HTML wurde verwendet, um jede Webseite zu codieren.

Der Inhalt war von bestimmten Tags umgeben, die darauf hinwiesen, wofür jeder Inhalt gedacht war, und dann wurde CSS angewendet, um ihn gut aussehen zu lassen. Es war keineswegs perfekt, aber es hat funktioniert.

Es bedeutete auch, dass Sie sich die RAW -HTML -Quelle einer Webseite ansehen und sehen konnten, was die Seite zu liefern versuchte und wie. Die HTML hat die Struktur und Bedeutung jedes Inhaltsbits auf der Seite ausgeschildert. Sie konnten den Zweck der Seite nur sehen, indem Sie sich ihren Code ansehen.

Dann kamen Wysiwyg -Redakteure und später JavaScript -Frameworks vor Ort an, und HTML traf einen Rücksitz. Anstatt

Und

wir haben endlose Nestings von
Und Tags.

Das Endergebnis ist die Webseite HTML, die keine Struktur hat und keine Bedeutung hat, bis es im Browser vollständig auf einen Bildschirm gerendert und visuell gestrichen wird. Erst dann versteht der Benutzer (und ein Maschinensystem, der versucht, einen Benutzer zu emulieren), was der Zweck der Seite ist.

Aus diesem Grund macht Google die Mühe, Seiten als Teil seines Indexierungsprozesses zu rendern (obwohl es wirklich nicht will).

Wir wissen, dass Google normalerweise nicht die Zeit hat, einen Nachrichtenartikel zu rendern, bevor er in Top -Stories und anderswo einstufen muss. Die RAW -HTML ist daher für Nachrichtenverlage immens wichtig.

Gutes HTML ermöglicht es Google, Ihren Artikelinhalt mühelos zu extrahieren und Ihre Geschichte zu bewerten, wo dies im Google -Ökosystem verdient.

Semantisches HTML ist hier ein Schlüsselfaktor. Dies ist der Grund, warum SEOs wie ich darauf bestehen, dass die Überschrift eines Artikels in der eingewickelt ist

Überschrift Tag, und dass dies die einzige Instanz von ist

Auf einer Artikelseite.

Die H1 -Überschrift zeigt die primäre Überschrift einer Webseite an. Es für den Artikel beginnt, sodass Google den Artikelinhalt leicht finden kann.

Welche HTML -Tags sind semantisch?

Jenseits der

Überschriften -Tag, es gibt viele andere semantische HTML -Elemente, die Sie implementieren können, mit denen Google Ihren Artikelinhalt leichter extrahieren und indizieren kann.

In keiner bestimmten Reihenfolge sind die Elemente, die Sie verwenden sollten,:

• Absätze: Verwenden Sie nicht
  Und Tags, um den Artikel in Absätze zu formatieren. Es gab ein Tag dafür, solange HTML existiert hat, und es ist das

  Etikett. Benutze es.

• Unterwegungen: Verwenden
  

  /

  /

  Unterschrift -Tags, um Ihre Seitenstruktur zu geben. Verwenden Sie Unterhose in einem Artikel, um bestimmte Inhaltsabschnitte in Ihrem Artikel vorzubilden. Verwenden Sie Unterhose für die Header über Betonstrukturelementen, wie z. B. empfohlene Artikel.

• Bilder: Verwenden Sie immer das Tag, wenn Sie ein Bild anzeigen möchten, das Google ebenfalls sehen soll. Google empfiehlt dies ausdrücklich.
• Klickbare Links: Verwenden Sie beim Verknüpfen mit einer anderen Seite, entweder intern oder extern, das Tag mit einem “HREF” -Werwert, der die Ziel -URL enthält. Es ist der einzige Link, dem Google definitiv folgen wird.
• Relationale Links: Der Mit Tag können Sie eine Beziehung zwischen der aktuellen URL und einer anderen URL erstellen. Dies kann eine kanonische Seite sein, ein Stylesheet, eine alternative Sprachversion der aktuellen Seite usw.
• Listen: Kugellisten sollten die verwenden
  Tag und nummerierte Listen sollten verwendet werden
  Etikett. Sie können sie mit CSS aussehen lassen, verwenden Sie jedoch die Listen -Tags als Fundament.
• Schwerpunkt: Wenn Sie ein bestimmtes Wort oder eine bestimmte Phrase hervorheben möchten, gibt es semantische HTML -Tags, die Sie dafür verwenden sollten: für KursivschriftUnd für deutlich.

Alle obigen Tags, mit Ausnahme vonsind für den Inhalt der Webseite bestimmt, die dem Text Struktur und Bedeutung bieten.

Es gibt zusätzliche semantische HTML -Tags, die dem Code der Seite Struktur und Bedeutung bieten sollen.

Mit diesen Tags können Google verschiedene Elemente auf der Seite identifizieren, z. B. die Navigation im Vergleich zu einer Seitenleiste, und sie entsprechend verarbeiten.

Semantisches HTML -Bild von w3schools.com (Bildnachweis: Barry Adams)

• Der Und Tags existieren, um die Metadaten der Seite zu trennen (in der ) aus dem tatsächlichen Inhalt (in der ). Jede HTML -Seite beginnt mit diesen beiden.
• 
  

  Kann verwendet werden, um den Kopfabschnitt der Seite zu wickeln, auf dem sich das Logo, die Navigation und andere stilistische Elemente befinden.

• 
  

  sollte für die Hauptnavigation Ihrer Website verwendet werden. Mega -Menüs, Hamburger -Menüs, Top -Navigationslinks und unabhängig von Ihrer Navigation sollten Sie sie in die einwickeln

• Sie können verwenden
  

  Tags, um Ihre Seite in mehrere Abschnitte zu unterteilen. Ein Abschnitt könnte der Artikel sein; Ein anderer könnte die Kommentare unter dem Artikel sein.

• ist das Tag, das zeigt, wo der tatsächliche Hauptartikeltext der Seite beginnt (einschließlich der Überschrift). Dies ist ein sehr wertvolles Tag für Nachrichtenverlage.
• Mit Anwesend Sie können Inhalteblöcke wie eine Seitenleiste von Trendgeschichten, empfohlenen Artikeln oder den neuesten Nachrichten angeben.
• 
  

  wird für die Fußzeile der Webseite verwendet.

Diese strukturellen semantischen Tags helfen Suchmaschinen, den Zweck und den Wert jedes HTML -Abschnitts zu verstehen.

Es ermöglicht Google, Ihre Inhalte schnell zu indizieren und die verschiedenen Elemente Ihrer Seiten angemessen zu verarbeiten.

Für verschiedene Zwecke stehen Ihnen viel mehr semantische HTML -Tags zur Verfügung. Die Chancen stehen gut, dass es für jeden erdenklichen Anwendungsfall ein HTML -Element gibt.

Anstatt Ihren Code voller Code von zu beschränken

Tags, um etwas geschehen zu lassen, sehen Sie zuerst, ob es ein ordnungsgemäßes HTML -Element gibt, das den Trick macht.

Wie hilft es KI?

Wir wissen, dass LLMs wie Chatgpt und Verwirrung das offene Web für Trainingsdaten sowie für bestimmte Benutzeranfragen kriechen, die Inhalte aus dem Web erfordern.

Was einige von Ihnen vielleicht nicht wissen, ist, dass LLMs JavaScript bei der Verarbeitung von Webseiten nicht rendern.

Google ist die Ausnahme von der Regel, da es viel Ressourcen für die Rendering von Webseiten im Rahmen der Indexierung gewidmet hat.

Da Gemini von Google das einzige LLM ist, das im Google -Index basiert, ist Gemini die einzige LLM, die Inhalte von vollständig gerenderten Webseiten verwendet.

Wenn Sie also eine Chance haben möchten, als zitierte Quelle in Chatgpt oder Verwirrung zu zeigen, können Sie sicherstellen, dass Ihr vollständiger Seiteninhalt in Ihrem rohen, nicht gebrauchten HTML verfügbar ist.

Die Verwendung semantischer HTML zur Strukturierung Ihres Codes und der Bedeutung bietet diesen LLMs auch dabei, Ihren Kerninhalt einfach zu identifizieren.

Es ist viel einfacher für Chatgpt, ein paar Dutzend semantische HTML -Tags anstatt mehrere hundert (oder sogar tausend) verschachtelt zu analysieren

Tags, um den Hauptinhalt einer Webseite zu finden.

Wenn und wenn das „agentische Web“ zum Leben erweckt wird (ich bin skeptisch), ist semantisches HTML wahrscheinlich ein entscheidender Aspekt des Erfolgs.

Mit bedeutungslos

Und Tags, es ist für einen KI -Agenten viel einfacher, die von ihm auszuführenden Maßnahmen falsch zu verstehen.

Wenn Sie semantische HTML für Dinge wie Schaltflächen, Links und Formen verwenden, sind die Chancen, dass ein KI -Agent seine Aufgabe nicht scheitert.

Die Bedeutung, die den ordnungsgemäßen HTML -Tags inhärent ist, wird dem AI -Agenten mitteilen, wohin er gehen und was zu tun ist.

Was ist mit strukturierten Daten?

Sie mögen denken, dass strukturierte Daten semantische HTML veraltet haben.

Schließlich können Sie mit strukturierten Daten Maschinensysteme mit den erforderlichen Informationen über den Inhalt und den Zweck einer Seite in einem einfachen maschinell-lesbaren Format zur Verfügung stellen.

Dies ist bis zu einem gewissen Grad wahr. Strukturierte Daten sollten jedoch niemals semantische HTML ersetzen. Es dient einem ganz anderen Zweck.

Strukturierte Daten haben Einschränkungen, die semantische HTML nicht haben.

Strukturierte Daten werden keine Maschine angeben, welche Schaltfläche einem Wagen ein Produkt hinzufügt, was die Unterschrift vor einem kritischen Textabsatz vorausgeht und auf welche Verknüpfung der Leser für weitere Informationen klicken sollte.

Verwenden Sie auf jeden Fall strukturierte Daten, um Ihre Seiten zu bereichern und Maschinen zu helfen, Ihre Inhalte zu verstehen. Sie sollten aber auch aus den gleichen Gründen semantische HTML verwenden.

Semantische HTML und strukturierte Daten sind zusammen eine unschlagbare Kombination.

Erstellen Sie Websites, keine Web -Apps

Ich könnte mit einem 2.500-Wörter-Scherz darüber gehen, warum wir Websites anstelle von Web-Apps erstellen sollten und wie die Appifizierung des Webs ein Gräuel für die Prinzipien ist, auf denen das World Wide Web gegründet wurde, aber ich werde Ihnen diese bestimmte Polemik ersparen.

Es genügt zu sagen, dass Web-Apps für Websites für Inhalte (wie Nachrichtenseiten) fast immer minderwertige altmodische Websites sind.

Und Websites werden auf HTML erstellt oder sollten sein. Nutzen Sie alles, was HTML zu bieten hat, und Sie vermeiden 90% der technischen SEO -Fallstricke, in die Web -Apps tendieren, um sich selbst zu versichern.

Das war’s für eine andere Ausgabe. Danke fürs Lesen und Abonnieren, und wir sehen uns beim nächsten!

---

Dieser Beitrag wurde ursprünglich auf SEO für Google News veröffentlicht.

---

Ausgewähltes Bild: N Universe/Shutterstock