Qualitativ hochwertiger Inhalt ist aus SEO Sicht immer noch eines der wichtigsten Ranking Kriterien. Damit der Text auch für das menschliche Auge ansprechend und leserlich wird, ist die richtige Textstruktur mittels HTML-Tags unerlässlich. Gleichzeitig erkennen Suchmaschinen wie Google durch passende Formatierung, welche Worte relevant sind. In diesem Artikel erfährst Du wie man Texte sinnvoll strukturiert, damit diese leserlich bleiben und die Suchmaschine den Textinhalt richtig wertet.
Mach es dem Nutzer leicht Deinen Text zu lesen und zu verstehen. Die Verwendung von Überschriften, Absätzen und anderen Formatierungen wie fett oder kursiv hilft bei der Strukturierung und lenkt das Augenmerk auf bestimmte Worte oder Sätze. Laut Dr. Jacob Nielsen sind nur strukturierte Texte auch lesbare Texte. Das bestätigen zahlreiche Studien.
Der Internetbenutzer scannt den Text nach Wörtern, die Informationen vermitteln. Diese müssen entsprechend verpackt werden um Aufmerksamkeit zu erzielen. Das macht eine Gliederung und Hervorhebung von Texten und Textteilen notwendig.
Überschriften strukturieren die Seite
Überschriften helfen dabei die einzelnen Abschnitte optisch zu unterteilen. Sie erregen Aufmerksamkeit und unterstützen den Leser beim scannen des Inhalts. Die HTML-Tags für Überschriften reichen von H1 bis H6. Wobei H1 für die Suchmaschinen am bedeutendsten ist und H6 am wenigsten gewichtet wird. Auch optisch ist die H1-Überschrift in der Regel größer als alle anderen Inhalte dargestellt. Wichtig ist hierbei, dass es auf jeder Seite genau eine H1-Überschrift gibt und diese sich inhaltlich von den anderen H1-Überschriften unterscheidet. In Drupal wird in der Regel der Node-Titel beim speichern innerhalb von H1 gesetzt. Die H1-Überschrift sagt dem Leser und der Suchmaschine, worum es im Artikel oder Blogbeitrag geht. Auch Screenreader-Nutzer verschaffen sich durch hierarchisch richtig gesetzte Überschriften einen schnellen Überblick über die Seite.
Die anderen Überschriften von H2 bis H6 verwendet man dann dazu, den Inhalt weiter zu unterteilen. Damit der Leser auf einen Blick sieht, womit sich die einzelnen Abschnitte befassen. Viele Leute legen den Fokus zu stark auf die H-Tags und vergessen dabei ganz die Möglichkeit etwas fett oder kursiv darzustellen.
Meiner Meinung nach macht es wenig Sinn innerhalb des Textes die ganze Palette an H-Tags für Überschriften zu verwenden. Es reicht H1 bis H3, in seltenen Fällen auch noch H4. Danach sollte aber Schluss sein. Die restlichen Bereiche lassen sich besser mit fetten oder kursiven Textformatierungen, sowie Listen und Aufzählungen gliedern. Oft werden H4 bis H6 Überschriften an Stellen verwendet, wo kursive oder fette Passagen angebrachter sind.
Was es beim Einsatz von Überschriften zu vermeiden gilt
Wer mit den H-Tags (H = Heading) zur Strukturierung seines Inhalts arbeitet sollte folgendes beachten:
- Überschriften Tags nicht für einen kompletten Absatz verwenden.
- Mit den H-Tags sparsamer umgehen. Sie sollen die Bereiche Gliedern / Untergliedern, aber nicht füllen.
- Die ganze Überschriftenpalette (H1 - H6) verwenden.
- H1-Tag nur ein einziges Mal auf der Seite einsetzen. Den Rest dann hierarchisch mit H2, H3 etc. weiterführen.
Wichtige Textformatierungen im Überblick
Damit der Inhalt möglichst leserlich wirkt, ist der Einsatz der folgenden Textformatierungen innerhalb des Inhaltsbereich eines Artikels möglich:
Fett
Fett / betont, hebt wichtige Wörter (z. B. Keywords) innerhalb des Textes hervor. <b> </b> <strong> </strong> Der Unterschied zwischen beiden ist, dass bold den Text optisch fett darstellt. strong hingegen betont das dazwischen stehende Wort und weist die Suchmaschine darauf hin, dass es sich hier um ein wichtiges Wort / eine wichtige Textpassage handelt. Es wird nicht unbedingt immer fett dargestellt. Manche Browser zeigen den Tag auch einfach wie normalen Text an. In dem Fall sollte man eine Anpassung in seiner CSS-Datei durchführen um sicher zu gehen, dass strong ebenfalls fett dargestellt wird. strong ist kein Ersatz, sondern lediglich eine Steigerung für b.
Kursiv
Kursiv / betont, hebt Eigennamen oder fremdsprachige Wörter innerhalb eines Textes hervor. <i> </i> <em> </em> Auch hier liegt der Unterschied darin, dass i den Text nur optisch kursiv darstellt. em hingegen betont den Text stärker. Die Optik ist dem Kursiv nachempfunden, wird aber nicht zu hundert Prozent von allen Browsern so dargestellt. Deswegen ist auch hier eine Anpassung der CSS-Datei sinnvoll. em ist kein Ersatz, sondern lediglich eine Steigerung für i.
Überschriften
Da die Gewichtung der Inhalte nach unten stark abnimmt ist es ausreichend bis H3 zu gehen und dann auf andere Gliederungs- / Formatierungsmöglichkeiten umzusteigen. ```<h1> </h1>
### Auflistungen
Auflistungen sind ungeordnete Liste mit Aufzählungszeichen. Das Aussehen der Aufzählungszeichen lässt sich durch das CSS Style Sheet anpassen.
### Aufzählungen
Aufzählung, also geordnete Listen sind nummerierte Aufzählungen (1., 2., 3., ...)
Sowohl Aufzählungen als auch Auflistungen erhöhen laut Dr. Nielsen die Lesbarkeit. Bereits bei mehr als zwei Aussagen lohnt sich der Einsatz von Aufzählungen bzw. Auflistungen.
### Bilder
Bilder lockern lange Texte auf. Als Faustregel kann man sagen, dass pro DIN A4 Seite (ca. 4000 Zeichen) zwei Bilder ideal sind. Verwendet man Bilder zur Textstrukturierung, dann sollte man darauf achten, diese suchmaschinentauglich einzusetzen.
### Links
Hyperlinks sind ebenfalls ein wichtiges Gestaltungsmittel. Dennoch ist hier Vorsicht geboten. Untersuchungen haben ergeben, dass in längeren Texten zu häufige Linkverweise eher störend wirken. Links werden wie fette und kursive Wörter sparsam verwendet.
### Filter HTML Einstellungen in Drupal
Damit das mit den Textformatierungen in Drupal auch so funktioniert, wie hier beschrieben, überprüfe am besten gleich deine Drupal Filter HTML-Einstellungen. Im Bereich <i>Erlaubte HTML-Tags begrenzen</i> sollten folgende Tags auf jeden Fall hinterlegt sein:
<ul> <ol> <li> <h1> <h2> <h3> <h4> ```
BUEditor
Wer mit den HTML-Tags zur Strukturierung des Seiteninhalte nicht klar kommt, kann auf Editoren zurück greifen, die sich um diesen Part kümmern. Für Drupal gibt es hierfür zum Beispiel den BUEditor. Du kannst dessen Schaltflächen entsprechend einstellen, damit Du den HTML-Code für die Formatierungen nicht manuell eintragen brauchst. Dies wird im Bereich Verwaltung » Konfiguration » Inhaltserstellung » BUEditor durchgeführt. Dort legst Du beispielsweise fest, ob für fetten Text <strong> </strong> oder nur <b> </b> verwendet werden soll.
Wann ein Text gut strukturiert ist
Dein Text ist gut strukturiert, wenn er folgende Elemente enthält:
- eine Überschrift
- einen kleinen Teaser
- Zwischenüberschriften
- Absätze
- Fette und kursive Wörter
- Listen und Aufzählungen
- zwei bis drei Bildelemente (abhängig von der Gesamtlänge)