SEO-Grundlagen: HTML Coding

Der folgende Artikel stammt aus dem Jahre 2003.

Aktuelle Information wie Google mit JavaScript umgeht finden Sie in unserem Blog: JavaScript & SEO

Lassen Sie uns einfach kurz wiederholen, was wir bereits im ersten Abschnitt „Grundlagen“ behandelt haben.

Wir erforschten unsere Schlüsselbegriffe und erstellten unsere Metatags. Der <title>-Tag besteht aus 5 bis 7 Wörtern, die unsere Schlüsselbegriffe beinhalten. Wir haben unsere Überschrift <h1> bis <h2>, in der sich unsere Schlüsselbegriffe befinden.

Nun sollten wir etwas in der Richtung haben …

<html>
<head>
<title>Immobilien Hamburg - Doppelhaus Miete - XYZ GmbH</title>
<meta name="keywords" content="immobilien, hamburg,
  immobilienmakler, doppelhaus, miete, ...">
<meta name="description" content="Immobilien Hamburg
  - Doppelhaus Miete ...">
</head>
<body>
<h1>Immobilien Hamburg - Doppelhaus Mieten</h1>
<strong>Doppelhaus Miete Angebote</strong>
.
.
.
</body>
</html>

Wir haben jetzt den Grundstein für eine in hohem Maße optimierte Webseite der XYZ Immobilien Hamburg GmbH. Wenden wir uns nun den Inhalten Ihrer Seite zu.

Javascript und CSS

CSS und JavaScript sind weit verbreitet (kommen aber im obigen Beispiel-Quellcode nicht vor). Wenn Sie sich jedoch den Quellcode dieser Seite hier ansehen, so wird Ihnen die folgende Zeile zwischen dem <head>-Tag auffallen:

<link href="../suchmaschinenoptimierung.css"
  rel="stylesheet" type= "text/css">

Diese Zeile Quellcode lässt meine CSS-Definitionen von einer externen CSS-Datei namens suchmaschinenoptimierung.css auslesen, welche sich im Hauptverzeichnis meines Webservers befindet. Der Inhalt dieser Datei ist der folgende:

.leftnav { font-family: Geneva, Arial, Helvetica,
  san-serif; text-decoration: none; font-size: x-small}
a:hover { color: #CC0033; text-decoration: underline}
.leftnavklein { font-family: Geneva, Arial, Helvetica,
  san-serif; font-size: x-small;
  text-decoration: none; font-weight: bold}

Der Inhalt wurde mit Notepad erstellt und unter der Endung .css anstatt .txt gespeichert. Die Datei wurde nach einem Schlüsselbegriff benannt.

Wie sich dies und dessen JavaScript-Äquivalent …

<SCRIPT LANGUAGE="JavaScript"
  SRC="MeinScript.js">
</SCRIPT>

… auf die Suchmaschinenoptimierung auswirkt, wird im Folgenden erklärt.

Der Spider einer Suchmaschine fängt am Anfang Ihres Quellcodes an und arbeitet sich nach unten durch. Er achtet mit besonderem Interesse auf den oberen, ersten Teil Ihres Quellcodes. Ist nun dieser obere Teil Ihres Quellcodes voll mit CSS-Definitionen und JavaScript-Befehlen (diese typischen „mouse roll over“-Effekte und JavaScript-Menüs), muss der Spider sich nun umso weiter nach unten arbeiten, um zu dem „Keyword-reichen“ Body-Text zu gelangen. Wie bereits erwähnt kommt es nicht nur auf die Häufigkeit Ihrer Schlüsselbegriffe an, sondern auch darauf WO diese Schlüsselbegriffe bzw. Schlüsselbegriff-Phrasen erscheinen. Aus diesem Grund sollten Sie die ersten 20 Zeilen des Quellcodes nicht mit JavaScript-Funktionen und CSS-Definitionen füllen. Lagern Sie stattdessen beide, JavaScript und CSS, aus in externe Dateien – so wird der Code zum einen viel sauberer erscheinen und es somit einem Spider sehr erleichtern, Ihren „Keyword-reichen“ Text schneller zu finden.

Bedeutung von Schlüsselbegriffen (Keyword-Phrasen)

Wie bereits erwähnt kann die Stelle, an der Sie Ihre Schlüsselbegriffe platzieren, einen Unterschied im Ranking zur Folge haben. Grundsätzlich sollten Ihre Schlüsselbegriffe am Anfang bzw. innerhalb der ersten 1 bis 2 Wörter eines jeden HTML-Elementes stehen. Beachten Sie im obigen Beispiel-Quellcode, dass die beiden Haupt-Schlüsselbegriffe „Immobilien“ und „Hamburg“ die beiden ersten 2 Wörter im <title>-Tag sind. Im <strong>-Tag befinden sich die Schlüsselbegriffe „Doppelhaus“ und „Miete“ ebenfalls an erster Stelle.

Kommen wir nun zum <body> Text

Wir haben unsere Überschrift mit Unter-Überschrift, was auf einer Webseite in etwa so aussehen wird …

Immobilien Hamburg – Doppelhaus Miete

 Doppelhaus Miete Angebote

Nun müssen wir unseren eigentlichen, hauptsächlichen Inhalt der Seite hinzufügen.

Auch hier sollten wir wieder CSS benutzen (welches wir in unserer externen Datei definieren). So ist der Quellcode viel kompakter als wenn wir das <font>-Tag benutzen mit seinen vielen und häufig gebrauchten Attributen.

Keyworddichte

Wir haben nun festgestellt, dass unsere Keywords bzw. Keyword-Phrasen früh erscheinen sollten, wie oft, hängt allerdings von der Suchmaschine ab. Wir von Abakus haben nachgeforscht, wie oft ein Keyword in den meisten HTML-Elementen erscheinen sollte und auch wo sie erscheinen sollen, um eine hohe Platzierung zu erreichen. Das Folgende, als grobe Richlinie gedacht, sollte sehr gut funktionieren, um die wichtigsten Suchmaschinen abzudecken.

Setzen Sie Ihre Keywords früh in Ihren <body>-Text hinein. Der erste Abschnitt nach der Unter-Überschrift sollte Ihre wichtigsten Keywords/Keyword-Phrasen mindestens zweimal beinhalten, vorzugsweise als erstes Wort des Abschnitts. Machen Sie aber NICHT den Fehler vieler, einen Schlüsselbegriff dauernd zu wiederholen, so wie jedes anderes Wort. Das wird von den Suchmaschinen als Spam angesehen und sie könnten einen Bestrafung in Ihrer Platzierung erleiden.

Sobald der erste Abschnitt fertig erstellt ist und voller Schlüsselbegriffe, wenden Sie sich Ihrem restlichen <body>-Text zu. z.B. “ Immobilien Hamburg von ABAKUS Internet Marketing… „. Wenn Sie eine Grafik verwenden – in unserem Beispiel wäre ein Bild eines Doppelhauses wohl zutreffend – vergewissern Sie sich, dass sie das „alt“-Attribut für die Grafik benutzen wie es im Design-Abschnitt beschrieben wird. Natürlich sollte auch der eigentliche Text immer noch Keywords beinhalten – allerdings ist der Mittelteil Ihres <body>-Textes nicht ganz so wichtig wie der erste Abschnitt bzw. die ersten 300 bis 400 Buchstaben des <body>-Textes.

Am Ende Ihrer Webseite ist eine hohe Dichte an Schlüsselbegriffen wiederum wichtig. Normalerweise sind das Textlinks oder eine Zusammenfassung eines Produktes oder einer Dienstleistung. Schreiben Sie Ihre Keyword-Phrasen ruhig ein- oder zweimal fett und kursiv – solange Ihre Seite dadurch nicht seltsam aussieht. Eine gute Idee ist, ganz unten auf Ihrer Seite Keywords beinhaltende Textlinks zu setzen sowie eine Zusammenfassung, die ebenfalls Ihre Schlüsselbegriffe beinhaltet.

Sie sollten darauf achten, dass die Anzahl Ihrer Schlüsselbegriffe annähernd 5% bis 7% beträgt. Anders ausgedrückt: 5% bis 7% Ihrer Wörter aus dem <body>-Text sollten Keyword-Phrasen sein. Mit den beiden Hauptbereichen besonders hoher Dichte von Schlüsselgbegriffen am Anfang sowie Ende Ihrer Seiten. Einige Suchmaschinen achten bei der Ermittlung Ihrer Keyword-Dichte auf den gesamten Quelltext – dies schließt dann die Inhalte Ihres -Bereiches sowie soche Dinge wie das <alt>-Attribut mit ein. Ermitteln Sie Ihre Keyword-Dichte ganz einfach online unter http://www.keyworddensity.com/. Die Seite ist zwar in Englisch, jedoch selbsterklärend. Wir empfehlen Ihnen, „raw data comparison“ zu benutzen, um eine hervorragende Aufschlüsselung Ihrer Keyword-Dichte sowie deren Position zu erhalten. Es lässt sich sogar eine zweite URL-Adresse zu Vergleichszwecken hinzufügen. ‚Doppelhaus miete‘ in Google 😉

Immobilien Hamburg

Mögliche Erschwernisse

In den meisten Fällen treten Erschwernisse auf, deren Sie sich bewusst sein müssen. Wir haben einige dieser in den „Aufbau“- und „Design“-Abschnitten aufgedeckt – so lassen Sie uns nun etwas tiefer in deren Lösung gehen …

Tabellen

Das, was Ihnen und mir als Benutzer beim Betrachten einer Webseite an deren Anfang zu stehen scheint, ist nicht dasselbe was der Spider einer Suchmaschine als den Anfang der Seite sieht. Dies wird durch die Tatsache veranschaulicht, dass – dies betrifft nun den Spider – z.B. der „Kontakt“-Link auf der linken Seite vor steht. Sehen Sie den Newsletter-Kasten auf der rechten Seite? Dieser erscheint nach der Navigation durch die Textlinks ganz unten auf dieser Seite! Der Grund hierfür liegt darin, wie Tabellen gebaut sind. Hier eine typische 2-Spaltentabelle …

Seitlicher
Abschnitt
Hier steht der Haupttext.

Der Quellcode dieser Tabelle lautet…

<table width=300 border=1 cellspacing=0 cellpadding=7
 align="center">
<tr>
<td>
Seitlicher<br> Abschnitt
</td>
<td valign=top>
Hier steht der Haupttext.
</td>
</tr>
</table>

Wenn Sie sich daran erinnern, wie ein Spider einer Suchmaschine arbeitet (nämlich von oben nach unten im Quelltext), so werden Sie sehen, dass der erste Inhalt, den der Spider erreicht, die linke Spalte (Seitlicher Abschnitt, blau gekennzeichnet) ist. Dies bedeutet, dass Sie nun am Anfang Ihrer linken Spalte Text mit vielen Schlüsselbegriffen beinhaltend einfügen sollten. Wenn Sie meine Homepage erneut aufrufen, werden Sie bemerken, dass sich vor den Navigations-Links ein Absatz befindet. Dieser steht nicht zufällig da. Es gibt nämlich einen HTML-Trick, mit dem die Hauptspalte (Hier steht der Haupttext) im Quellcode vor Ihrer linken Spalte (Seitlicher Abschnitt) steht. Wie dies genau funktioniert, wird in dem Abakus-Newsletter beschrieben – abonnieren Sie ihn jetzt und Sie werden erfahren, wie dieser HTML-Trick funktioniert, und auch noch weitere HTML-Lösungen zu häufigen Suchmaschinenoptimierungs-Problemen.

Frames

Wie bereits schon versprochen, werde ich nun kurz auf das Thema Frame-Seiten eingehen. 85% der Webmaster dürfte es nicht bekannt sein, dass der Inhalt des <noframe>-Tags von der großen Mehrzahl der Suchmaschinen indexiert wird. Dies bedeutet, Sie können den <noframe>-Bereich benutzen, um Ihre Frameset-Seite zu optimieren, ohne sich über das Design zu viele Gedanken zu machen. Wenn Sie den Anleitungen in diesem Tutorial folgen und einfach Ihren optimierten <body>-Text in den <noframe>-Tag hinein platzieren, werden sie bereits eine bedeutenden Fortschritt gemacht haben im Vergleich zu dieser Standardfloskel „Ihr Browser unterstützt keine Frames …“. Vergessen Sie nicht, Links zu Ihren einzelnen Frame-Seiten zu platzieren. Sonst finden sie einige Suchmaschinen nicht, obwohl heutzutage immer mehr Suchmaschinen Frameset-Seiten folgen können. Es gibt da noch das Problem, wenn Unterseiten in Suchmaschinen gefunden werden – wird diese dann vom Suchenden angeklickt, so lädt die Seite ohne das Frameset, was oft bedeutet, dass es keine seitliche Navigationsleiste gibt oder schlimmer. Dies ist ein weiterer guter Grund, Textlinks unten auf jeder Seite hinzuzufügen und natürlich auch in Ihrem <noframe>-Bereich. Es gibt JavaScript-Code, um das ursprüngliche Frameset aufzurufen und die Seite korrekt in diesem anzuzeigen. Wie das mit diesem JavaScript-Code gelöst wird, erfahren Sie in einer separaten Beschreibung, sobald Sie den Abakus-Newsletter abonniert haben.