JavaScript Part 2 – Wie Suchmaschinen sich das Internet erschließen

Das erwartet euch in diesem Artikel

  • Was ist ein Crawler und was tut er?
  • Wo kann es beim Crawling Probleme geben?
  • Warum kann JavaScript das Crawling beeinflussen?

In diesem Artikel geht es darum, wie Suchmaschinen – also Google, Bing und Co. – sich das Internet erschließen. Im Rahmen unserer Serie zu JavaScript SEO ist dies der erste Artikel, der euch erklären soll, wie eure Website es überhaupt in den Google-Index schafft und wo auf diesem Weg Stolperfallen und Hindernisse lauern.

Inhalte im Internet & das World Wide Web

Im allgemeinen Sprachgebrauch bezeichnet der Begriff Internet in der Regel das World Wide Web, also das WWW. Dabei handelt es sich um ein Netzwerk aus Hypertext-Dokumenten, welches über das Internet abrufbar ist.

Das Internet ist quasi die darunterliegende Struktur mit viel mehr als nur dem WWW. Hier finden sich auch E-Mails, Gopher (na, wer kennt’s?) oder IRC (na wer kennt das auch?) und viele, viele andere Dinge.

Suchmaschinen haben meist das Ziel, Inhalte im WWW auffindbar zu machen. Spezielle Suchmaschinen finden auch andere Inhalte, das ist für unsere Zwecke aktuell aber eher nebensächlich. Der Abruf der Inhalte im WWW erfolgt über HTTP(S), also HyperText Transfer Protocol (Secure).

Dies regelt die Kommunikation zwischen Client und Server. Der Client fragt einen Inhalt an und der Server liefert diesen aus (bzw. beantwortet die Anfrage).

Welche Inhalte werden im WWW bereitgestellt?

Grundsätzlich findet man hier nahezu alles, was man so auf dem Computer speichern kann, also

  • Bilder
  • Videos
  • PDF
  • Audio-Files

Der Grundstein dafür sind HTML-Dokumente:

Screenshot:Ein simples HTML-Dokument

Abb. 1: Ein simples HTML-Dokument, erreichbar unter http://beispiel.de/.

HTML-Dokumente haben dabei eine Besonderheit. Sie können auf andere Dokumente verweisen (referenzieren). Das funktioniert mit den allseits beliebten (Hyper-)Links. Diese sehen folgendermaßen aus: <a href=“https://www.beispiel.de/beispiel/“>Beispiel-Link</a>

Dabei steht das href für Hyperreference.

So kann man sich von einem Dokument zum nächsten bewegen und verschiedene Dokumente auf einer Website oder unterschiedlichen Websites besuchen. Es entsteht also ein Netzwerk aus mehreren Seiten.

Grafik: Ein Netzwerk aus Dokumenten

Abb. 2: Ein sehr simples Netzwerk aus Dokumenten.

Trotz der Einfachheit des dargestellten Netzwerkes kann es schon hier für einen Menschen schwer sein, das Dokument zu finden, nach dem er gerade sucht. Wie kommt man zum Beispiel am besten und ohne ewige Klickstrecken von Dokument 1 zu Dokument 5?

Grafik: Der Weg von Dokument 1 zu 5

Abb. 3: So geht der kürzeste Weg von Dokument 1 zu Dokument 5.

Doch was passiert, wenn ich die Dokumente gar nicht selbst kenne? Und das ist oft der Fall, weil das WWW so riesig ist. Was, passiert, wenn neue Dokumente hinzukommen?

In solchen Fällen nehmen die Suchmaschinen uns die Arbeit ab. Um möglichst alle Dokumente im WWW zu finden, nutzen sie die Kerneigenschaft der Dokumente: ihre Verbindung durch Hyperlinks.

Daher gilt: ohne Links kein WWW!

Das Crawling

Ein Webcrawler (auch “Spider”, oder “Bot” genannt) ist ein Programm, das genau das tut:

  1. Aufrufen eines Dokumentes
  2. Extraktion aller Hyperlinks
  3. Übermittlung der Hyperlinks an einen Scheduler
  4. Weiter geht’s von vorn (Googlebot schläft nie 😉 )
Grafik: Crawling einfach dargestellt

Abb. 4: Stark vereinfachtes Schema.

Der Einstieg passiert auf Dokument 0.

Grafik: Einstieg in Dokument 5

Abb. 5: Beim Einstieg auf Dokument 0 findet der Crawler sechs Links zu neuen Dokumenten.

Danach folgt der Aufruf der Dokumente 1, 2, 3, 10, 11 und 12. Nicht sonderlich schwierig, möchte man meinen.

Ein Webcrawler extrahiert Links zu Dokumenten im Web und bereitet diese auf. Sein Ziel ist es, weitere Dokumente zu finden.

Damit ist der erste und wichtigste Punkt im gesamten Kontext schon gefunden: scheitert das Crawling, entfallen alle weiteren Schritte der Verarbeitung! Das Crawling ist also essenziell.

Stolperfallen

Screenshot: Aussage von Google

Abb. 6: Das wird gecrawlt (© Tom Greenaway @ Google I/O 2018, 10:12).

Gehen wir davon aus, dass alles stimmt, was der Mann von Google da sagt (auch wenn wir wissen, dass Google bedeutend mehr URLs folgt, als nur den hrefs). Hier leben wir einmal kurz im Google-Idealzustand. Was kann nun alles schiefgehen?

Bedenkt: es ist ein Computerprogramm, das versucht, den Link aus dem Quelltext zu extrahieren. Diesem Vorgehen liegen mindestens zwei recht komplexe Annahmen zugrunde:

  1. Ein Link ist eine URL, die in einem HTML-Dokument in einem <a> Tag als href referenziert wird.
  2. Der Ersteller des Dokumentes weiß das und hält sich an die bekannten Standards.

Again: Wenn man hier gegen die Vorgaben verstößt, sieht man schon alt aus.

Klassische Fehler:

  • Website-Quelltext nicht valide → <a href=https://www.beispiel.de/beispiel/>Beispiel-Link</a>
  • Referenz relativ → <a href=“/beispiel/“>Beispiel-Link</a>
  • URL doof → <a href=“https://www.beispiel.de/beispiel#magie“>Beispiel-Link</a>
  • Scripting → <span onclick=“changePage(‚/beispiel/‘)“>Beispiel-Link</span>
  • Inhalt wird erst nachgeladen
Screenshot: Problematische Navigation

Abb. 7: Im Quelltext der Website steht ein JavaScript. Dieses fragt die Navigationsstruktur bei einem Service an und erstellt sie dann dynamisch.

Screenshot: Vielleicht deakiviert

Abb. 8: Wenn kein JavaScript ausgeführt wird, wird keine Navigation erstellt.

Crawling und JavaScript

Problematisch wird es, wenn Links erst durch die Ausführung von JavaScript erkennbar werden. Denn diese Ausführung ist nicht nur ressourcenintensiv, sondern auch fehleranfällig und komplex.

Beispiel

Ein HTML-Dokument funktioniert auch ohne Markup:

Screenshot: HTML ohne Markup

Abb. 9: Auch ohne Markup kann ein HTML-Dokument funktionieren.

Anmerkung: Das ist ein Extrembeispiel! Eine korrekte Syntax ist immer noch ein wichtiges Kriterium für gut funktionierende Websites!

Aber ein fehlendes ; kann ein komplettes Skript unbrauchbar machen. Gemäß dem oben definierten Konzept liest der Crawler lediglich die Inhalte des HTML-Quelltextes und extrahiert die Links.

Nehmen wir folgendes Dokument an:



<html>

<head>
<meta charset=“utf-8″ />
<script>
var eins = „<a href=’http://www.beispiel.de/“;
var zwei = „beispiel/‘>Link zu Beispiel“;
var drei = „.de</a>“;
</script>
</head>

<body>

<h1>testdokument</h1>
<script>
document.write(eins + zwei + drei);
</script>

</body>

</html>

Rufe ich das Dokument im Webbrowser auf, so sehe ich, dass alles funktioniert, wie es soll:

Screenshot: Dokument mit Link

Abb. 10: So soll es sein.

Ein Crawler sieht bei Abruf des Dokumentes folgendes:

Screenshot: Was sieht der Crawler

Abb. 11: An der Stelle, an der wir den Link erwarten, sieht der Crawler lediglich das Skript.

Hier endet die Arbeit für den Crawler. Erst, wenn er die Fähigkeit erhält, das JavaScript im HTML-Dokument auszuführen, kann er den Link entdecken und ihm folgen:

Screenshot: Java ausführen

Abb. 12: Ist der Crawler in der Lage, JavaScript auszuführen, so kann er den Link sehen.

Und jetzt wird es haarig:

Screenshot: Der Fehler steckt im Detail

Abb. 13: Ist das Skript nur minimal fehlerhaft, kann der Link nicht mehr generiert werden.

Dieses Script ist mehr als simpel und diese und ähnliche Ausnahmen treten im WWW durchaus häufig auf.

Folgen für den Crawler

Die Programmierer des Crawlers versuchen, möglichst alle bekannten und möglichen Ausnahmen abzufangen. Daher ruft der Googelbot alles auf, was in irgendeiner Form an eine URL erinnert (auch außerhalb von <a href=““>). Doch die Verarbeitung der Dokumente gestaltet sich deutlich schwieriger.

Folgen für uns als SEOs

Daraus schließen wir: Wer sicherstellen will, dass eine URL gecrawlt wird, stellt sie als HTML-Link zur Verfügung.

Doch wenn es bei einfachen Links schon so viele Probleme geben kann, wie sieht es dann erst bei komplexen Inhalten aus?

Was könnt ihr tun? Wie könnt ihr analysieren? Was müsst ihr ändern? Oh Gott, wo fangt ihr an?

Bild: Yoda

Abb. 14: Einen Moment Geduld.

Crawler Steuerung

Es ist für euch extrem wichtig, den Crawler richtig zu steuern, bzw. nicht auf Irrwege zu leiten. Das geht folgendermaßen:

  1. Die robots.txt

Jede Website sollte eine haben. Sie regelt, welche Seitenbereiche vom Crawler besucht werden dürfen – und welche nicht. Sie spricht jedoch nur eine Empfehlung aus. Der Googlebot hält sich daran, aber der Bot vom Internet Archive zum Beispiel nicht. Sie hält also die meisten Bots davon ab, die Inhalte aufzurufen – sie bietet aber keinen Indexierungsschutz. Der Einfachheit halber solltet ihr komplizierte Regeln wo es geht vermeiden.

Ein Beispiel für eine robots.txt wäre die folgende:

User-agent: *
Disallow: /nicht-crawlen/

  1. Die Meta-Angaben

Die Meta-Angaben stehen im Quelltext von HTML-Dokumenten und sehen zum Beispiel so aus:



<html>
<head>
<meta name=“robots“ content=“index, follow“>
[…]
</head>

[…]

</html>

Für den Crawler sind vor allem die Angaben „follow“ und „nofollow“ wichtig. Sie geben an, ob den ausgehenden Links des Dokuments gefolgt werden soll.

Außerdem interessiert sich der Crawler für die Angaben „Index“ und „Noindex“. Diese sind für die spätere Verarbeitung entscheidend.

Der Unterschied zur robots.txt ist, dass das Dokument beim Einsatz von „nofollow“ zur Sackgasse wird. Bei der der Sperrung mittels robots.txt kann weitreichender ausgeschlossen werden.

  1. Die komplexen Block-Strategien

Komplett aussperren könnt ihr Crawler z.B. durch IP-Blockaden, Login-Formulare (hier genügt schon eine basic http authentication).

Nun wisst ihr, warum das Crawling so wichtig ist – und was ihr beachten müsst, damit es auf eurer Seite problemlos funktioniert. Im nächsten Artikel wird es darum gehen, wie Menschen sich mithilfe von Browsern das WWW erschließen.

Über den Autor

Sebastian Adler

Redakteur
Den Einstieg in die Online-Marketing-Welt fand ich 2011 bei Barketing im Offpage-Bereich. 2013 wechselte ich dann zu Searchmetrics in die SEO-Beratung, um dort den Kunden bei ihren SEO-Strategien mit Rat und Tat zur Seite zu stehen. Nach einem kurzen Ausflug ins Produktmanagement führte mich mein Weg im Sommer 2017 (zurück) zu LEAP/, wo ich nun wieder als SEO-Consultant tätig bin.
Kommentare