3.7. Web Scraping

Mit der kostenpflichtigen Version des SEO Spiders kannst Du Inhalte auf einer Website finden und speichern. Dazu muss aber zuerst geklärt werden, in welcher Form diese Inhalte vorliegen.

Wenn Du beispielsweise die Preise auf Produktdetailseiten eines Online-Shops auffinden und speichern möchtest, musst Du sicherstellen, dass Du ein gemeinsames Muster erkennst, nach dem Preise auf diesen Seiten ausgegeben werden. Vielleicht nutzen alle Produktdetailseiten das gleiche Template und Du kannst die Position des Preises anhand von Textpassagen oder HTML-Elementen auf der Seite genau bestimmen.

Bleiben wir beim Beispiel mit der Preisinformation auf den Produktdetailseiten. Steht der Preis bereits im ursprünglichen HTML? Dann kannst Du auf das aufwendigere JavaScript-Rendering verzichten. Ist der aktuelle Preis aber tatsächlich erst im gerenderten HTML sichtbar, musst Du für Scraping-Prozess die Konfiguration des SEO Spiders anpassen und das JavaScript-Rendering aktivieren: Du wählst dazu im Hauptmenü den Punkt Konfiguration > SEO Spider und änderst die Einstellung im Tab Rendering.

Anschließend musst Du eine oder mehrere Extraktionsanweisungen hinterlegen. Du definierst damit den Such- und Speicherbereich innerhalb einer Seite. Wenn Du den Preis eines Produkts auf der Produktdetailseite auslesen möchtest und weißt, dass im betroffenen Online-Shop immer das gleiche HTML-Raster für diese Seiten zum Einsatz kommt, untersuchst Du dazu einmal den Quelltext. Vielleicht sieht er an der entscheidenden Stelle immer so aus – natürlich mit unterschiedlichen Preisen:

<div class="Price">
 <span class="price-value">
  <span itemprop="price" content="8.80">8,80</span>
  <span itemprop="priceCurrency" content="EUR">€</span>
 </span>
</div>

Gehen wir davon aus, Du möchtest den Betrag ohne Währungsangabe extrahieren. Für das abgebildete Code-Beispiel soll also 8,80 gespeichert werden.

Dazu öffnet Du im Hauptmenü: Konfiguration > Benutzerdefiniert > Extraktion.

In diesem Fenster kannst Du nun Elemente und Regeln für die Extraktion hinzufügen, die sich aus dem Suchmarker und einer Aktion zusammensetzen. Im SEO Spider gibt es drei verschiedene Möglichkeiten Suchmarker zu definieren. Zusätzlich zur Definitionsmethode musst Du dann noch festlegen, was beim Auffinden des Suchmarkers passieren soll.

Damit stehen Dir folgende Optionen zur Verfügung:

Suchmarker-Definition	Inneres HTML	HTML-Element	Nur Text	Funktionswert	Exakte Entsprechung
CSSPath	✅	✅	✅	❌	❌
XPath	✅	✅	✅	✅	❌
Regex	❌	❌	❌	❌	✅

XPath (XML Path Language) ist eine Abfragesprache für XML-Dokumente, mit der spezifische Elemente oder Attribute innerhalb einer Seite ausgewählt werden können. Mit XPath kannst Du beispielsweise alle Elemente eines bestimmten Typs in einer Seite auswählen, die unter einem bestimmten Element verschachtelt sind. Oder Du kannst alle Elemente auswählen, die einen bestimmten Attributwert haben. XPath verwendet eine Pfadsyntax, um den Pfad zum gewünschten Element oder Attribut innerhalb des XML-Dokuments anzugeben.

Auf unser Beispiel angewandt kannst Du folgenden Marker per XPath definieren und auf die Extraktion von Nur Text festlegen:

//span[@itemprop='price']

Diese XPath-Regel sagt aus, dass nach einem Span-Element gesucht wird, das das Attribut itemprop mit dem Wert price hat.

CSSPath ist eine zu XPath ähnliche Abfragesprache für HTML-Dokumente. Es ermöglicht das Auffinden von Elementen auf einer Webseite mithilfe von CSS-Selektoren. Du kannst darüber gezielt bestimmte HTML-Elemente auszuwählen und ihre Inhalte oder Attribute auslesen.

Im Vergleich zu XPath ist CSSPath für Einsteiger etwas leichter anzuwenden, weil die Syntax aus dem Aufbau von HTML und CSS vertraut ist.

Eine Möglichkeit, wie unser Beispiel per CSSPath umgesetzt werden kann, siehst Du hier:

.price-value > span[itemprop='price']

Diese CSSPath-Regel wählt das Span-Element aus, die das Attribut itemprop mit dem Wert price hat und innerhalb eines anderen Span-Elements mit der Klasse price-value liegt. Der >-Operator besagt, dass das ausgewählte Span-Element direkt unter dem Span-Element mit der Klasse price-value liegen muss.

Weitere Informationen
Screaming Frog – XPath-Beispiele

Regex (reguläre Ausdrücke) sind eine spezielle Textkette, die zum Abgleich von Mustern in Daten verwendet wird. Die Anwendung eignet sich unter Umständen für einige fortgeschrittene Anwendungen. In den meisten Fällen führen Dich CSSPath oder XPath schneller und besser zum Ziel.

Weitere Informationen
Screaming Frog – Regex-Beispiele

Um das Scraping einer Website zu starten, startest Du wie gewohnt einen Crawl. In Echtzeit kannst Du nun in der URL-Übersicht im Tab Benutzerdefinierte Extraktion mitverfolgen, welche Entsprechungen zu Deinen Suchmarkern der SEO Spider findet. Als Filter stehen Dir in dieser Ansicht Deine selbst definierten Suchmarker zur Verfügung.

Weitere Informationen
Website Boosting – So holen Sie sich Daten von Webseiten: Scraping mit XPath & CSSPath
Christian Feichtner – 3 Beispiele für Web-Scraping mit Screaming Frog