display:none und Suchmaschinen. Wie man Google und Co. bei der Stange hält.
Posted 2 years, 5 months ago at 19:10. 6 Kommentare
Wissen gerne alles: Google und Co.
Bei der Erstellung von Webseiten mit primär grafischem Inhalt – wie z.B. Galerien – steht man als Webmaster oft vor dem Problem, dass Computer und somit Suchmaschinen leider – zumindest noch – keine Bilder interpretieren können. Nun gibt es die Möglichkeit zu jedem Bild eine lange Beschreibung hinzuklatschen, doch was, wenn das der Kunde gerade nicht möchte?
Sinnvoll ist hier die von vielen zu Unrecht verpönte Methode, Text in per “display:none” ausgeblendete Bereiche zu packen. Es soll hier jetzt gar nicht zu großen Diskussionen ÜBER diese Methode kommen sondern ich möchte Tipps geben wie man die Tücken dieser Methode austricksen kann.
Das Problem
Das Problem ist nämlich, dass Google die Texte, die für den Besucher unsichtbar sind, auch selbst missachtet, um so Seiten mit versteckten SEO-Spam den Garaus zu machen.
In unserem Fall jedoch handelt es sich nicht um Spam sondern sinnvollen Inhalt. Die Besucher können ein Bild betrachten und es verarbeiten. Eine Suchmaschine ist auf grafischer Ebene jedoch nahezu Blind (mal abgesehen vom crawlen nach Bildern). Zudem kommt noch, dass wir bei einer simplen Galerie nur Bilder darstellen würden, es kann also sogar passieren, dass unsere Seite noch nicht einmal indiziert wird.
Die Lösung
Die Lösung ist ein kleiner Trick. Wir lagern unsere Stylesheets einfach in externe .css Dateien aus und legen in der Von Google und Co. strikt befolgten robots.txt fest, dass eben diese Stylesheets für Webcrawler nicht zugänglich sind. Somit “erfährt” die Suchmaschine gar nicht erst, dass unser Text für den Besucher nicht sichtbar ist und nimmt ihn ganz normal wahr.
Code
Jeder der sich schon ein wenig mit HTML, CSS und SEO beschäftigt hat sollte wissen wie das funktioniert, jedoch möchte ich eine simple Lösung keinesfalls vorenthalten:
- legt einen Ordner /CSS an, in dem ihr eure .css-Dateien speichert
- in einer eurer .css Dateien fügt ihr folgenden Code hinzu:
.seo{display:none;} - bindet eure Stylesheets per
<link rel="stylesheet" href="CSS/euer_css_filename.css" type="text/css" />in der jeweiligen .html- bzw. .php-Datei ein - den Text, den ihr unsichtbar machen wollt, packt ihr nun ein ein span-Objekt und verseht es mit der CSS-Klasse seo die wir eben erstellt haben. Zum Beispiel:
<span class="seo">Diese moderne Schwarz-Weiss-Fotografie einer jungen Brunette machte Manfred Mustermann im Jahre 2009 mit seiner Spiegelreflexkamera in der Nähe des Fühlinger Sees. Das Bild gehört der Kategorie 'blablabla' an.</span> - erstellt, falls noch nicht vorhanden, in eurem root-Verzeichnis die Datei robots.txt und schreibt dort folgenden Code rein:
User-agent: *
Allow: /
Disallow: /CSS/ - ladet alles hoch und fertig!
Google und die anderen kleinen Web-Heinzelmännchen haben ab sofort keinen Zugriff mehr auf das Verzeichnis /CSS/.
Ende gut, alles gut.
Euer Luke
Hallo,
schöner Beitrag
Allerdings hätte ich einen eventuellen Einwand. Ich bin in der Hinsicht sehr vorsichtig dem Google-Bot per Robot.txt die Einsicht in die CSS zu verbieten. Google “könnte” denken, der hat doch was zu verbergen. Lieber sollte man durch geschickte Anordnung der Div Container sein Content an den Richtigen stellen platzieren
Gruß
Sipatshi
Die Überlegung ist mir auch gekommen, allerdings schreibt Google selbst, dass die robots.txt streng befolgt wird.
Da hat der GoogleBot nichts zu denken, es geht um Privatsphäre (gut, die findet Google ja eh eher störend ^^).
Verwehre ich dem Robot zum Beispiel den Zugriff auf bestimmte HTML Dateien darf er dadurch auch nicht die anderen ihm zugänglichen Seiten schlechter bewerten.
Die robots.txt ist eine von den Suchmaschinisten freiwillig angebotene Methode den Zugriff für Bots zu beschränken. Wenn diese sich selbst ernst nehmen, sollten sie keine Unterscheidung hinsichtlich Dateiendungen machen. Und schon garkeine Rückschlüsse ziehen. Wenn der Zeitpunkt kommt, dass Google mir misstraut, dann “ziehe” ich freiwillig aus
Hallo Lukas,
es ist zu schön um wahr zu sein, das der Google-Bot die Robot.txt strengstens befolgt
Natürlich hält sie sich an gewisse Regeln, wie z.B. bestimmte HTML Dateien nicht anzuschauen.
Es ist wie in der Politik. Sie sagt uns, das die Privatsphäre geschützt werden soll, aber hinter den Kulissen beschlaust man wen man möchte!
Ich könnte mir gut vorstellen, das man bestraft wird ohne Rückschlüsse auf die externe “CSS-Datei” zu haben. Das heißt, das man nicht aus dem Index ist, aber man verliert an Ranking-Points!
Ich habe da andere Methoden. Ich verbiete Google fast nichts. Sie macht doch sowieso was sie möchte
Gruß
Serkan
ich werde mal in den Statistiken (vom Server) nachschauen, ob der GoogleBot einen entsprechenden Traffic zu den .css Dateien verursacht oder nicht.
Bitte schau doch in deiner Statistik, ob andere Bots existieren, deren Herkunft du nicht kennst, die aber versuchen auf die .css Datei zuzugreifen. Muss ja nicht unbedingt der Google Bot sein
Gruß
Sipatshi
super, danke. genau das habe ich gesucht, mal schauen ob’s bald gefunden wird…