Technical SEO

Technical SEO bezeichnet alle technischen Maßnahmen, die dafür sorgen, dass eine Webseite von Suchmaschinen effizient gecrawlt, korrekt indexiert und optimal bewertet werden kann. Dieser Blog-Artikel gibt eine kleine Einführung in diese SEO-Teildisziplin.

Einführung

Um es gleich vorwegzunehmen: Ich bin kein SEO-Spezialist, ich gebe hier lediglich mein limitiertes Wissen über einen ganz bestimmten Teilaspekt von SEO wieder.

Also…

Suchmaschinenoptimierung, kurz SEO (für Search Engine Optimization), umfasst alle Maßnahmen, die dazu dienen, eine Webseite in den Suchergebnissen von Google & Co. auf höheren Positionen erscheinen zu lassen. Warum ist das wichtig? Die meisten Nutzer klicken bevorzugt auf die obersten Treffer einer Suchseite. Eine gute Platzierung bedeutet also mehr Sichtbarkeit und meist auch mehr Besucher auf Deiner Webseite.

Technical SEO bezeichnet alle technischen Maßnahmen, die dafür sorgen, dass eine Webseite von Suchmaschinen effizient gecrawlt, korrekt indexiert und optimal bewertet werden kann. Es geht dabei nicht um Inhalte, Schlüsselwörter, Backlinks etc., sondern um die technische Basis Deiner Webseite.

Google, Bing & Co

Das Ziel einer jeden Webseite ist es, möglichst gut gefunden zu werden. Die großen Suchdienste wie Google, Bing aber auch regionale Größen wie Yandex arbeiten im Großen und Ganzen immer (noch) nach dem gleichen Prinzip:

  • Ein Crawler saugt sich den Inhalt aus allen verknüpften Seiten einer Webseite heraus bzw. merkt sich die URLs, die der Indexer besuchen soll.

  • Ein Indexer erstellt auf Grundlage dieser Daten Suchbegriffe zusammen bzw. erstellt mithilfe von KI auch ganze Zusammenfassungen, die das Angebot des eigenen Dienstes qualitativ aufwerten sollen.

Als Webseiten-Besitzer hat man durchaus Einfluss auf das Verhalten des Crawlers wie auch des Indexers.

Zunächst sucht ein Crawler nach einer Datei namens robots.txt. Diese Datei gibt dem Crawler Feedback, welche URLs er besuchen bzw. nicht besuchen soll.

Eine typische robots.txt-Datei sieht wie folgt aus:

User-agent: *
Disallow:

Sitemap: https://www.beispiel.de/sitemap.xml

Hier wird einer Suchmaschine Zugriff auf alle Seiten gewährt. Außerdem wird explizit auf eine Sitemap verwiesen (dazu gleich mehr).

Die robots.txt-Datei könnte aber auch so aussehen:

User-agent: *
Disallow: /admin/
Disallow: /login/

Allow: /

Sitemap: https://www.beispiel.de/sitemap.xml

Hier wird der Suchmaschine signalisiert, dass die Bereiche admin (Administration) und login (Anmeldung) nicht vom Crawler besucht werden sollen.

Was noch so alles mit robots.txt gesteuert werden kann, spezifiziert das Robots Exclusion Protocol.

Eine Sitemap ist eine XML-Datei (in der Regel heißt sie sitemap.xml), in der alle gültigen bzw. gewünschten URLs einer Webseite aufgelistet sind. Dies erleichtert dem Crawler das Leben, weil er alle URLs auf dem Silbertablett geliefert bekommt und nicht ausschließlich auf das Sich-Durchhangeln der HTML-Seiten angewiesen ist.

Eine typische Sitemap-Datei sieht wie folgt aus:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://www.beispiel.de/</loc>
  </url>
  <url>
    <loc>https://www.beispiel.de/ueber-uns</loc>
  </url>
  <url>
    <loc>https://www.beispiel.de/kontakt</loc>
  </url>
</urlset>

Auch in einer Sitemap kann noch viel mehr kodiert werden. Hier geht es zur Spezifikation des Sitemap-XML-Formats. Wichtig ist, dass die Sitemap immer in robots.txt verlinkt ist und keine Weiterleitungen (Redirects via 301/302) aufweist.

Generell macht es Sinn, sich unter Google, Bing etc. als Webmaster für seine eigene Webseite zu registrieren. Man bekommt dann jeweils ein Dashboard zur Verfügung gestellt, mit dem man:

  • dem Crawler seine Sitemap explizit übermitteln kann.

  • den Crawler anweisen kann, so bald wie möglich mal wieder vorbeizuschauen, damit der Indexer die neuesten Daten zum Indexieren bekommt.

  • noch ein paar andere Tools nutzen kann.

Um den Indexer glücklicher zu machen, kann man seine Seiten mit zusätzlichen Metadaten versehen, die den Inhalt für den Computer verständlicher macht.

  • schema.org liefert eine maschinenlesbare Bedeutung Deiner Inhalte. Dadurch verstehen Suchmaschinen besser, was Deine Webseite an Informationen bietet. Diese Art der Auszeichnung ist mittlerweile sehr wichtig geworden für KI-basierte Suchen.

  • Open Graph protocol steuert, wie Deine Webseite aussieht, wenn sie geteilt wird. Primär geht es hierbei um das Erscheinungsbild in sozialen Netzwerken wie LinkedIn, Facebook, aber auch MS Teams oder Slack.

  • Twitter Cards haben eine ähnliche Aufgabe wie Open Graph, scheinen aber nicht mehr ganz so relevant zu sein. Es schadet aber nicht, diese zu unterstützen, vor allem dann, wenn man noch unter X/Twitter unterwegs ist.

Mobile-First

Die mobile Version Deiner Webseite ist die maßgebliche Version für Indexierung, Bewertung und Ranking. Suchmaschinen (insbesondere Google) analysieren primär die mobile Darstellung, Desktop ist nur noch sekundär. Das ist auch kein Wunder, da die Mehrheit der Suchanfragen mittlerweile von Smartphones kommen.

Es geht also darum, vorallem die mobile Version Deiner Webseite zu optimieren, d.h.:

  • Responsive Design via CSS Media Queries
  • Touch-Friendly und auch für kleine Bildschirme geeignet
  • Inhaltliche Gleichheit für Mobile und Desktop
  • Hohe Performanz

Semantik und Syntax

Ohne sauberes, semantisches HTML können Suchmaschinen Inhalte schlechter verstehen, einordnen und bewerten. Gerade für Blogs, die auf Sichtbarkeit, Lesbarkeit und Autorität setzen, ist das entscheidend.

Semantische HTML-Elemente beschreiben, was ein Inhalt ist, nicht wie er aussieht.

Wichtige Elemente sind beispielsweise:

  • <header> - Kopfbereich (Titel, Meta-Infos)
  • <main> - Hauptinhalt der Seite
  • <article> - eigenständiger Artikel
  • <section> - thematische Abschnitte
  • <nav> - Navigation
  • <aside> - ergänzende Inhalte
  • <footer> - Fußbereich

Überschriften <h1> bis <h6> strukturieren Inhaltsbereiche für Menschen und Maschinen:

  • Genau eine <h1> pro Seite
  • Klare Hierarchie: <h1> > <h2> > <h3>
  • Überschriften beschreiben Inhalte, nicht nur Schlüsselwörter
  • Keine Überschriften nur für ein besseres Styling verwenden

Auch die Inhalte selbst sollten strukturiert sein:

  • Absätze mit <p>
  • Listen mit <ul> oder <ol>
  • Zitate mit <blockquote>
  • Code mit <pre><code>

Ein häufig unterschätztes Problem ist, dass HTML-Seiten oft syntaktisch fehlerhaft sind, etwa wenn ein öffnendes HTML-Element kein entsprechendes schließendes Element besitzt. Moderne Webbrowser sind da recht nachgiebig und bügeln solche Fehler meist automatisch aus. Einem Indexer kann das aber durchaus die Laune verderben. Daher empfiehlt sich bei allen größeren Änderungen ein nachträglicher Markup Validation Check.

Performanz

Einer der größten Performanz-Killer sind zu große Bilder. Daher sollte man folgende Strategie verfolgen, um die Dateigrößen möglichst klein zu halten:

  • Bilder sollten stets eine minimale Auflösung besitzen, ein 4K-Image macht keinen Sinn, wenn es immer nur skaliert als 800 x 600 Image angezeigt wird.

  • Bei Full-Screen Hero-Images sollte man unterschiedliche Auflösungen bereitstellen und diese per CSS-Media-Query einbinden. Hintergrund: Bei mobilen Geräten mit kleiner Auflösung braucht man kein Hero-Image mit großer Auflösung.

  • Pixel-Bilder (PNGs, JPGS etc.) sollten auf alle Fälle durch einen Optimierer gejagt werden. Ein schönes Tool in diesem Zusammenhang ist TinyPNG. Die Ergebnisse sind oft erstaunlich, eine Reduzierung der Dateigröße um 50-70% sind keine Seltenheit.

Außerdem:

  • CSS-Dateien und JavaScript-Dateien aus eingebundenen Frameworks (z.B. Bootstrap) sollten immer über ein Content Delivery Network (CDN) geladen werden (z.B. https://cdnjs.com). Und bitte immer die Minified-Version (also die ohne Kommentare und unnötige Leerzeichen) nutzen.

  • Webbrowser laden HTML-, CSS- oder JS-Dateien deutlich schneller, wenn die Serverantwort komprimiert ist. Das gilt vor allem für textbasierte Inhalte. Bilder (JPEG, PNG, WebP, etc.) sind meist schon komprimiert, da lohnt sich kein zusätzlicher Komprimierungsschritt. Eine Komprimierung muss auf Serverseite konfiguriert werden.

    Wer tiefer in diese Thematik einsteigen möchte: Compression in HTTP

  • Webbrowser versuchen stets, bereits erfragte Inhalte für eine gewisse Zeit wiederzuverwenden (Caching), um nicht ständig das Gleiche abzufragen. Du kannst auf Serverseite Einfluss darauf nehmen, in dem Du beispielsweise die gewünschte Cache-Dauer für alle oder einzelne Dateien definierst.

    Wer tiefer in diese Thematik einsteigen möchte: HTTP caching

Verweise

Deine Webseiten sollten keine toten Verweise aufweisen. Das sind URLs, deren Aufruf im Webbrowser mit einer Fehlermeldung quittiert werden (z.B. 404-Fehler), weil kein passender Inhalt gefunden werden konnte. Tote Verweise entstehen durch Tipp- oder Copy&Paste-Fehler oder weil die Zielseite plötzlich nicht mehr erreichbar ist.

Du kannst dies sehr gut mit einem Link-Checker testen. Bei größeren Webseiten mit sich ständig verändernden Inhalten macht es Sinn, diese Aufgabe zu automatisieren und ein regelmäßiges Monitoring einzuführen.

HTTPS

Deine Webseiten sollten immer unter https erreichbar sein, ein Aufruf über HTTP sollte lediglich zu einem Redirect auf https führen. Die Google-Suche bewertet Webseiten mit HTTPS tendenziell höher als Webseiten ohne HTTPS.

Da HTTP-Verbindungen in allen modernen Webbrowsern mittlerweile als potentiell unsicher gekennzeichnet werden, gibt es kaum noch öffentliche Webseiten ohne HTTPS.

Wer tiefer in diese Thematik einsteigen möchte:

Fazit

Im Kontext von SEO geht es zunächst weniger darum, dass eine Webseite schick aussieht oder durch atemberaubende Animationen aus dem Rahmen fällt. Vielmehr sollte eine Suchmaschine alle notwendigen Informationen schnell und strukturiert finden können und zudem den (messbaren) Eindruck bekommen, dass eine Webseite fix lädt, auch auf kleinen Mobilgeräten gut konsumierbar ist und generell in einem gepflegten Zustand ist.

Ist das gegeben, bist Du schon einen guten Schritt weiter. Was dann kommt ist klassisches SEO: Content-SEO (Inhalte), OffPage-SEO (Backlinks), Haste-Nicht-Gesehen-in-Englisch-SEO. Und natürlich irgendwas mit KI.

Teile diesen Artikel