Text via CSS (und ohne display:none) verstecken

Manchmal möchte man bestimmte Textbereiche per CSS ausblenden, z.B. um innerhalb einer Überschriften-Hirachie die h1-Überschrift mit dem Allgemeinen Titel des Blogs unsichtbar zu machen, da meistens eh ein Logo zum Einsatz kommt. Dennoch ist es sinnvoll, die h1-Überschrift im Code zu belassen, um eine logische Struktur z.B. in der Druckversion zu gewährleisten.

Ein stumpfes Ausblenden mit „display:none;“ kann dazu führen, dass Google den Inhalt der Überschrift nicht mehr indexiert. Es ist besser „text-indent“ mit einem negativen Wert zu nutzen:

h1 {
text-indent:-9999px;
}

Schreibe einen Kommentar