Beeinflussen visibility:hidden und display:none das Google-Ranking?


Wir klären, ob die CSS-Tags visibility:hidden und display:none das Google Ranking beeinflussen.

Über eine Kundenwebseite bin ich auf eine Problematik gestoßen, welche in dieser Form doch schon etwas länger kursiert. Es geht darum, ob die CSS-Tags wie visibility:hidden und display:none das Google Ranking beeinflussen oder nicht. Werden mit CSS „ausgeblendete“ Inhalte nun indiziert oder nicht?

Matt Cutts stellte schon im Oktober fest: „I don’t recommend that people use CSS to hide text“. Nun ist es jedoch so, dass es im Webdesign Gang und Gebe ist z.B. das Logo als Bild darzustellen und den H1-Tag per CSS entweder aus dem für den User sichtbaren Bereich zu schieben (z.B. mit text-indent:-999px) oder eben den Text mit display:none komplett auszublenden.

Jetzt stellt sich natürlich die Frage inwieweit das Ersetzen einer H1 (bzw. H2 etc) Überschrift durch ein Bild und ein per CSS ausgeblendetes H1 – Tag für die Suchmaschinenoptimierung schädlich ist?  Die Essenz eines älteren Beitrags im Abakus Forum scheint zu sein, dass sich Google nicht dafür interessiert ob ein Text mit CSS versteckt ist oder eben nicht. Ein Blogbeitrag auf webdesign-in.de scheint hier etwas anderes herauszulesen. Und auch hier und hier ist man der Meinung, dass Google die versteckten elemente nicht indiziert. Wenn es so ist, hilft es dann etwas die CSS-Datei per robots.txt vor dem frechen Google-Bot auszusperren? Es herrscht also alles andere als eine einhellige Meinung zu diesem Thema.

Was tun sprach Zeus? Also setze ich mich einfach einmal hin und baue mir zwei Testumgebungen auf. Die Umgebungen habe ich auf meinen Kunden gemünzt, welcher die H1-Tags konsequent durch Typo3 in Bilder umwandeln lässt, aber den H1-Tag selbst per CSS ausblendet. Leider ist es so, dass ausgerechnet bei diesem Kunden die Funktion „Im Cache“ nicht funktioniert. Eventuell kann mir ja ein SEO erklären, warum die Seite im Index erscheint aber kein Cache abgebildet werden kann. Aber das nur nebenbei. Zurück zum Thema: Also die erste Testumgebung simuliert die Einstellung meines Kunden. Es sind drei Dateien relevant:

Erste Testumgebung: Die HTML-Datei:

[html]<html>
<head>
<title>Hidden-Test</title>
<link rel=“stylesheet“ type=“text/css“ href=“styletest.css“ />
</head>
<body>
<h1>Kuriolgrmpfl</h1>
<img src=“img/558899×1.png“/>
<h2>Sipldropa</h2>
<img src=“img/558899×2.png“/>
</body>
</html>[/html]

Nun noch die CSS Datei:

[css]html {    margin: 0, padding: 0;}
h1{ display:none; }
h2{ visibility:hidden; }[/css]

und die robots.txt

[text]# Ganze Seite ist freigeben
User-agent: *
Allow: /[/text]

Im Gegensatz zur ersten Testumgebung habe ich nun in der zweiten die CSS-Datei per robots.txt ausgesperrt. Falls in der ersten Umgebung die ausgeblendeten Texte nicht indiziert werden so hoffe ich doch, dass es etwas bringt die CSS-Datei für Google „unsichtbar“ zu machen. Man darf gespannt sein. Hier nun die Dateien der zweiten Umgebung:

Die HTML-Datei:

[html]<html>
<head>
<title>Hidden-Test</title>
<link rel=“stylesheet“ type=“text/css“ href=“extstyles/styletest.css“ />
</head>
<body>
<h1>Ibldroubli</h1>
<img src=“img/885566y1.png“/>
<h2>Ukadropali</h2>
<img src=“img/885566y2.png“/>
</body>

</html>[/html]

Die CSS Datei ist dieselbe wie vorher. Nur ist diese nun ausgelagert in den Ordner /extstyles/, welchen ich dann später per robots.txt aussperre.

[text]# Stylesheet ausschließen
User-agent: *
Disallow: /extstyles/[/text]

Damit die zwei Textumgebungen von Google auch indiziert werden muss ich diese auch aus diesem Blogbeitrag verlinken. Also hier geht es nun zur Umgebung 1 und hier zur Umgebung 2. Bitte achtet nicht auf die Domainnamen, das sind nur Testdomains.

Ergebnis des Tests:

Mittlerweile wurden endlich die zwei Testdomains indiziert. Es ist nun definitiv so, dass die CSS-Tags visibility:hidden und display:none keinerlei Auswirkung auf die Indizierung seitens Google haben. D.h. mit diesen Tags verborgene Texte werden indiziert. Somit ist es natürlich Quatsch irgendwelche externen CSS-Dateien vor Google per robots.txt aussperren zu wollen.

Es ist jedoch trotzdem nicht anzuraten, nur für die Suchmaschine, viele H1-Tags im Text zu platzieren und diese dann per CSS zu verstecken. Es kann durchaus sein, dass Google diese Technik dann mit einem Malus belegt. Jedoch spricht einem ersetzen der HTML Überschriften durch Images hinsichtlich der Indizierung und somit der Auffindbarkeit nichts dagegen.

Beeinflussen visibility:hidden und display:none das Google-Ranking?