Was wollen wir mit diesem Rezept erreichen? Wir wollen eine hübsche, horizontale Navigation mit dem Sliding Doors Effekt; das mit möglichst wenig Markup und dazu noch so flexibel wie möglich. So soll es dann bei uns nachher aussehen:

Das Ergebnis

Und hier noch die Live-Ansicht der HTML-Seite.

Fangen wir mit dem Markup an. Der HTML-Teil für unsere Navigation ist nur eine Unordered List:

<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>News</a></li>
<li><a href=”#”>&Uuml;ber mich</a></li>
<li><a href=”#”>Bilder</a></li>
<li><a href=”#”>Kontakt</a></li>
<li><a href=”#”>Extra langer Link</a></li>
</ul>

Das war schon der gesamte HTML-Teil. Beginnen wir nun mit dem Styling per CSS. Fangen wir mit dem ul-Tag an:

ul {
list-style: none;
width: auto;
height: auto;
overflow: hidden;
}

Das overflow: hidden; dient dazu, den Float der Listenelement ohne zusätzliches Markup wieder aufzulösen. Denn die einzelnen Listenelemente werden wir mittels float: left nebeneinander setzen:

li {
float: left;
width: auto;
margin-right: 2px;
background: url(images/right.jpg) no-repeat right;
}

Der Hintergrund ist die rechte Tür unserer Sliding Door:

Nun brauchen wir noch die linke Kante unserer Sliding Door, dann sind wir auch schon fertig:

li a {
width: auto;
height: 27px;
line-height: 27px;
padding: 0px 20px;
background: url(images/left) no-repeat left;
color: # 333;
}

Das Bild für die linke Tür:

Wie es funktioniert:

Wir haben dem Listenelement ein Hintergrundbild mit ausreichender Breite und einem no-repeat Befehl gegeben. Außerdem soll das Bild rechts im Listenelement angeschlagen werden. Verbreitert sich das Listenfeld auf Grund eines längeren Link-Textes so wird einfach mehr vom Hintergrundbild sichtbar.

Der Hintergrund des eigentlichen Links ist das linke Bild der Sliding Door und links angeschlagen. Es liegt über dem Hintergrund des Listenelements und verdeckt diesen. Dadurch wandert dieses Ende immer mit der Größe des Feldes mit. Durch den Befehl des paddings kann man zusätzlich den Innenabstand verändern und den Linktext zentrieren.

Alle Zutaten zu diesem Rezept herunterladen

Grundlegend, wie bereits oben erwähnt, gibt es zwei Arten von Sitemaps:

• HTML-Sitemaps:

  Unter diesen Begriff fallen alle Sitemaps, die der Besucher der Webseite direkt anwählen und betrachten kann. Sozusagen die Straßenkarte der eigenen Webseite. Eine HTML-Sitemap ist also eine oder mehrere HTML-Seiten mit Links zu jeder Seite der Webseite. Meist findet man den Link zur Sitemap direkt oben im Head oder im Footer der Webseite. Auf großen Webseiten hat man sich sehr schnell “verlaufen” und findet über diese HTML-Sitemap immer wieder schnell dahin, wo man hin will.
  Eigentlich ein reines Service-Angebot für den Benutzer, hat sich die HTML-Sitemap schon auf vielen Webseiten etabliert. Dies hängt hauptsächlich damit zusammen, dass Sitemaps bei der Suchmaschinenoptimierung und vor allem bei der internen Verlinkung enorm helfen. Hat erstmal ein Suchmaschinen-Crawler die Sitemap der Webseite entdeckt, kann er von da jede weitere Unterseite finden und crawlen.
  Auf http://www.brigitte.de/service/sitemap/ bekommt man eine gute Idee davon, was eine HTML-Sitemap ist und wofür sie gut ist.

• XML-Sitemap:
  Wie bereits gesagt helfen HTML-Sitemaps sowohl dem menschlichen als auch den virtuellen Besuchern der Webseite sich auf dieser zurecht zu finden. Im Gegensatz dazu sind XML-Sitemaps ausschließlich für die Crawler der Suchmaschinen gedacht. Alle großen Suchmaschinen wie Google, Yahoo und Bing nutzen XML-Sitemaps als Teil der Indexierung von Webseiten. Sauber erstellte XML-Sitemaps teilen den Suchmaschinen mit welche Unterseiten die Webseite hat, wie oft diese verändert wird und wann sie zum letzten Mal aktualisiert wurde. Anhand dessen können Suchmaschinen einschätzen, welche Seite häufiger besucht werden müssen da sich deren Inhalt häufiger ändert und indexieren die Webseite eher so, wie es sich der Webmaster vorstellt. Dabei sieht der Aufbau einer XML-Sitemap wie folgt aus:

  <url>
  <loc>deinewebseite.de/index.html</loc>
  <lastmod>2009-03-05</lastmod>
  <changefreq>weekly</changefreq>
  <priority>1.0</priority>
  </url>

  Für die Startseite haben wir im obigen Beispiel angegeben, wann sie zum letzten Mal verändert wurde (<lastmod>), wie häufig dies im Durchschnitt passiert (<changefreq>) und die Gewichtung der Seite auf der Webseite (<priority>). Je exakter wir bei der Erstellung der Sitemap arbeiten, desto besser kann der Crawler die Webseite indexieren und den wichtigen Seiten auch die nötige Aufmerksamkeit schenken.

  Tipp: Sei ehrlich mit den Angaben über Deine Webseite, wenn Du eine Sitemap erstellst. Nicht jede Seite ist wirklich gleich wichtig und auch der Crawler wird ziemlich schnell merken, wenn die Webseite nicht so oft aktualisiert wird wie in der Sitemap angegeben.

Wie erstelle ich sowohl HTML- als auch XML-Sitemap?

Die Erstellung einer HTML-Sitemap ist nicht schwerer als die Erstellung irgendeiner Webseite. In wie fern man das Webdesign berücksichtigen muss, sollte jeder selbst festlegen, ob blanker Listen oder etwas mit Stil. Allerdings sollte man immer daran denken, dass man neue Unterseiten auch direkt in der Sitemap verewigen sollte.

Die Erstellung von XML-Sitemaps hingegen kann eine sehr zeitraubende Angelegenheit werden. Es gibt zu diesem Zweck viele kostenlose Sitemap-Generatoren, die helfen können. Die meisten versagen allerdings bei einer größeren Zahl an Seiten. Spätestens bei der 100-Seiten Grenze hört allerdings auch der Spass mit der HTMl-Sitemap auf.

Aber was kann getan werden, wenn die eigene Webseite mittlerweile 400 Seiten hat? Gibt es eine Möglichkeit, Sitemaps dennoch schnell zu erstellen? Ja, die gibt’s. Sogar sehr kostengünstig da kostenlos.

Ist man der stolze Besitzer einer Webseite, die mit Hilfe von WordPress erstellt wurde, lege ich die Installation des folgenden Plugins ans Herz:
Google XML-Sitemap: Download unter http://downloads.wordpress.org/plugin/google-sitemap-generator.3.2.zip. Mit Hilfe dieses netten Plugins wird automatisiert eine XML-Sitemap erstellt und bei Aktualisierung diese automatisch an die großen Suchmaschinen gesendet. Einfacher geht es wirklich nicht.

Hat man kein CMS oder nur eins, welches definitv die Erstellung einer XML-Sitemap nicht anbietet, hilft der Download des Gsite Crawlers weiter (zu finden unter http://gsitecrawler.com). Mit der Hilfe dieses netten Programmes kann man nicht nur eine XML-Sitemap für die Suchmaschinen erstellen sondern auch direkt die passende HTML-Version. Dabei bietet das Programm zahlreiche Einstellungen, die man anpassen kann. Sehr nützlich ist dieses Tool auch, um interne Links zu finden, die ins Leere laufen.

Wie häufig sollte ich die Sitemap aktualisieren?

Man sollte sich angewöhnen, die Sitemap mehrmals im Jahr zu aktualisieren und den Suchmaschinen zu senden. Auf alle Fälle sollte man so etwas bei größeren Änderungen an dem Inhalt der Webseite sofort tun.

Zusammenfassung

Beide Sitemaps, sowohl HTML als auch XML sind ein wichtiger Schritt in die richtige Richtung, wenn es darum geht, die eigene Webseite bekannt zu machen. Häufig kann man nach der Bereitstellung einer Sitemap schnell Erfolge in der Positionierung bei den einzelnen Suchmaschinen sehen. Allerdings sollte man sich immer vor Augen halten, dass dies nur ein kleiner, wenn auch wichtiger, Teil der Suchmaschinenoptimierung ist. Es gibt noch viel mehr, was in dem Bereich der Suchmaschinenoptimierung getan werden kann. All das wird hier bald erscheinen.

Um die mangelnde Transparenz-Unterstützung vieler und vor allem alter Browser zu umgehen, lege ich in CSS einfach eine Klasse an, die sämtliche CSS-Transparenz-Befehle übermittelt:

.transparenz {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}

Das Ganze im Überblick

filter:alpha
Dieser Wert wird vom Internetexplorer von Microsoft unterstützt und erwartet einen Wert von 0 bis 100.

-moz-opacity
Der Firefox interpretiert den Wert dieses Filters als Transparenz und erwartet einen Wert von 0.0 bis 1.0

-khtml-opacity
Damit arbeitet der Safari-Browser und alle anderen Browser, die khtml unterstützen,  richtig. Erwartet wie die -moz-opacity einen Wert von 0.0 bis 1.0

opacity
Damit macht man die Klasse zukunftssicher, denn diese Eigenschaft steht in CSS3 für die Transparenz. Wertangabe von 0.0 bis 1.0.

Ich wollte eine horizontale Navigation erstellen, die zentriert im Head der Seite dargestellt werden sollte. Semantisch korrekt natürlich als eine unordered list. Hier das reine HTML:

<div id=”navbar”>
<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>News</a></li>
<li><a href=”#”>Contact</a></li>
</ul>
</div>

Das wurde dann mit folgendem CSS gestylt:

#nav {
width: 100%;
height: 30px;
position: relative;
overflow: hidden;
}

Nun stylen wir die eigentliche Navigation:

#nav ul {
position: relative;
list-style: none;
left: 50%;
}

#nav ul li {
position: relative;
right: 50%;
float: left;
}

Das wars schon. Die einzelnen Navigationspunkte werden jetzt alle nebeneinander stehen und gleichzeitig im Container “nav” zentriert sein.

Über den Domain-Namen solltest Du Dir direkt am Anfang ernsthafte Gedanken machen, denn wenn Du einmal einen Domainnamen gewählt hast, der nicht richtig funktioniert, wird es im Nachhinein sehr schwierig, den Domainnamen zu ändern. Insbesondere, wenn Du schon Visitenkarten und Briefpapier mit der URL bedruckt hast.

Nun folgen die fünf größten Fehler, die gerne gemacht werden, wenn es darum geht einen Domainnamen zu wählen:

1. Der gewählte Name hat nur einen geringen Bezug zum Geschäft

Potentielle Kunden kommen mit einer gewissen Erwartung auf Deine Webseite.  Wenn Du sie enttäuschst und sie nicht mit den Informationen versorgst, nach denen sie suchen, werden sie sehr schnell Deine Seiten verlassen ohne in Kontakt mit Dir getreten zu sein. Und das Schlimmste daran: Es ist sehr sicher, dass diese Besucher auch nie wieder Deine Seite betreten werden. Dein Domainname sollte dem potentiellen Besucher also direkt klar machen, was sie oder ihn auf der Seite erwartet.

2. Du registrierst nicht Deinen eigenen Namen

Generell ist es eine hervorragende Idee, Deinen eigenen Namen als Domain zu registrieren. Vielleicht kannst Du diese Domain noch nicht direkt nutzen und andere Domains sind vielleicht viel besser, aber vielleicht wirst Du und Dein Business eines Tages enorm berühmt. Solltest Du dann nicht auch Deinen Namen als Domain haben? Früher konnte jemand versuchen und Dir Deinen Namen als Domain wegschnappen um an der Berühmtheit des Namens zu verdienen. Dies ist aber Gott sei Dank in Deutschland nicht mehr möglich, denn Du hast ein Anrecht auf die Domain Deines Namens. Um trotzdem eventuelle Probleme und Streitereien zu umgehen, solltest Du Dir Deinen Namen als Domain direkt am Anfang sichern.

3. Du registrierst eine Domain, die verwirrt

Deine Domain sollte einfach zu verstehen sein. Solltest Du einmal Deine Web Adresse jemanden über das Telefon mitteilen, sollte Dein Gegenüber die Domain direkt richtig verstehen. Nehmen wir als Beispiel den Domainnamen “www.webdesignforyou.de”. Einige Leute werden versuchen, “www.webdesign4you.de” einzugeben. Wenn dieser Domainname Dir nicht gehört, hattest Du Pech und Dein Kunde ist beim Konkurrenten. Vermeide also Domainnamen, die mögliche Zahlen beinhaltet. Besser wäre eine Adresse, wie “www.deinwebdesign.de”.

4. Die Top Suchbegriffe sind nicht im Domainnamen enthalten

Schrecklicher Fehler, wenn es nachher an die Suchmaschinenoptimierung geht. Denn Google bewertet das Vorkommen der Suchbegriffe im Domainnamen besonders hoch. Allerdings sind viele gute Domainnamen schon vergriffen. Du musst also nach einem Domainnamen suchen, der noch frei ist und Deine Suchbegriffe enthält. Und genau das ist der schwerste Punkt von allen. Manchmal hat man Glück und findet eine Domain, die noch frei oder wieder frei geworden ist. Denn Domains können auch wieder frei werden, wenn der bisherige Domaininhaber sie wieder freigibt. Unter www.zonespy.de findest Du eine gute Auswahl an wieder freigewordenen deutschen Domains.

5. Du registrierst eine Domain, die zu trendy ist

Den Namen, den Du wählst identifiziert und charakterisiert Dein Business. Soll Dein Business über längere Zeit bestehen bleiben, muss Du darauf acht geben, dass Dein Domainname nicht nur in einem engen zeitlichen Fenster interessant ist. So sind Domains, die auf die Fussballweltmeisterschaft 2010 abzielen im Moment enorm gefragt, aber spätestens zwei Minuten nach Abpfiff des Finales sind diese Domains keinen Pfifferling mehr wert. Denk daran: Trends kommen und gehen!

Wenn Du diese fünf Punkte in Deine Überlegungen einbeziehst, wirst Du einen Domainnamen finden, mit dem Du garantiert zufrieden bist und der Dein Geschäft richtig repräsentiert.

Denke immer daran: Dein Domainname ist wie ein Schnappschuss von Dir und Deinem Geschäft… stelle sicher, dass es sowohl Dein Geschäft als auch Dich im best möglichen Licht zeigt.

Auch wenn der zusätzliche, einfache Backlink nicht mehr zählt, bleibt ein Vorteil immer noch erhalten: Besucher. Der Effekt, dass viele Besucher über solche Social-Bookmarking Services auf der Seite landen ist nach wie vor noch aktuell. Und darum geht es letztendlich bei der Suchmaschinenoptimierung: Qualifizierte Besuche generieren. Wie man solche Social-Bookmarking Services zum Wohl der eignen Seite einsetzen kann, erklären wir heute.

Sichtbarer Name

Bevor man sich registriert, sollte man sich Gedanken über den Screen-Namen machen. Dieser sollte einen ersten Eindruck auf den Service geben, den man anbietet. Bietet man zum Beispiel Handyverträge an, sollte “Handyvertrag” im Benutzernamen stehen.

Wähle die richtigen Freunde

Die großen Bookmark Dienste haben so viele Mitglieder, dass es reine Zeitverschwendung wäre, sie alle als Freund einzuladen. Stattdessen sollte man sich auf Mitglieder konzentrieren, die in dem Bereich, in dem man sich befindet, bereits als Autorität gelten. Zudem sollte man schauen, ob diese Personen viel verlinken, damit erhöht sich die Chance, dass sie auch auf Deine Beiträge verlinken. Wähle Benutzer als Freund, die selbst viele Freunde haben. Dadurch erhöht sich die Anzahl an Benutzern, die potentiell Deine neuen Bookmarks/Artikel lesen.

Wie Du mir, so ich Dir

Wenn Du willst, dass man Deine Stories, News oder Bookmark verfolgt, bzw. selbst aufgreift, dann solltest Du das auch bei anderen machen. Dadurch klinkst Du Dich tiefer in das jeweilige Netzwerk ein und erscheinst nicht als “Schmarotzer”. Auch wenn die eigenen Einträge nicht die Qualität der anderen Einträge erreichen, so zieht man zumindest das Interesse der anderen Authoren auf sein Profil.

Finde schnell gute Artikel

Als erstes muss Du lernen, schnell gute Artikel zu finden und diese zu bookmarken. Interessiere Dich nicht für Artikel, die nur Aufmerksamkeit erhaschen wollen, sondern interessiere Dich für Artikel, die wirklich guten Inhalt bieten.

Frage nach Hilfe

Wenn Du wirklich dringend eine Bewertung benötigst, frage höflich andere Benutzer darum. Und wappne Dich gegen die ein oder andere unhöfliche Antwort.

Noch ein Tipp zum Schluss

Kommentiere neue Beträge so schnell wie möglich. Dadurch ist Dein Kommentar weit oben und zieht somit mehr Aufmerksamkeit auf sich. Einige Besucher werden sich garantiert für Dein Profil, bzw. Deine Webseite interessieren.

Letztlich hilft nur eines um Dich in der Social-Media Welt nach oben zu spülen: Du musst kreativ sein und Artikel/Beiträge schreiben, bei denen es sich lohnt, sie zu lesen. Wenn Du keinen guten Inhalt bieten kannst, dann biete Resourcen, wie zum Beispiel Link-Listen zu einem Thema.

Fehler 1: Zuviel Werbung

Es ist schlichtweg ein Fehler, zuviel Werbung auf einer Webseite zu schalten. Viele Webmaster versuchen, über Ihre Webseite Geld zu verdienen. Das ist auch absolut legitim, Pixel-Kingdom macht das auch. Wenn dadurch allerdings der Content der Webseite untergeht ist das eher schlecht. Denn Besucher kommen auf die Webseite, um Informationen zu finden und nicht um sich Werbung anzuschauen.

Fehler 2: Zuviel Animation/Media Player

Auch wenn Animationen schön sein können (die Betonung liegt auf “können”), sollten diese enorm sparsam eingesetzt werden. Nicht nur, dass sie die Seite unruhig wirken lassen, sie stören zudem den Besucher bei der Erfassung der Inhalte. Wer kennt nicht diese nervenden, rotierenden @-Zeichen in 3d Look? Ausserdem sollte der Einsatz von Media-Player absolut knapp gehalten werden. Wir sprechen hier von einem Maximum von 1 Player pro Seite. Auch sollte es nur ein Format geben und nicht zig verschiedene.

Fehler 3: Flash-Intros

Webdesign-Experten sprechen sich deutlich gegen den Einsatz eines Flash-Intros auf Webseiten aus. Während viele Menschen verstehen, wieso Flash-Intros eine schlechte Idee sind, ergehen sich Designer häufig in ellenlangen Intros, die dem Besucher zuerst den Zugang zu Informationen versperren. Flash Intros ohne “Skip Intro” Button sind sowieso eine Tod-Sünde, denn man zwingt den Besucher bei jedem Besucher der Seite das Intro komplett durchzusehen. Was bei den vielleicht ersten drei Besuchen noch ein tolles Erlebnis ist, wird danach sehr lästig und vergrault mit 100%tiger Wahrscheinlichkeit den Besucher nach dem 4ten Mal. Wieso der meistgeklickte Button im Internet die Beschriftung “Skip Intro” trägt, wundert dann niemanden mehr.

Fehler 4: Unstrukturiertes Layout

Wir reden hier von einem Layout, dass vielleicht den ästhetischen Ansprüchen des Webmasters entspricht, aber mit Sicherheit nur ihm den schnellen Zugriff zu Informationen gewährt. Wenn eine Webseite nur mit Hilfe von Erfahrung zu bedienen ist, werden Besucher sehr schnell das Weite suchen. Zum Beispiel sollte der Besucher nicht mit einer Icon-Navigation überfordern, mit denen er nichts anfangen kann. Wer raten muss, bleibt nicht lange. Designer müssen sich immer vor Augen führen, dass sie eine Webseite für den Benutzer erstellen, und nicht für den Besitzer.

Fehler 5: Links zu anderen Webseiten

Alle Links, die von der eigenen Webseite wegführen, sollten auch als solche gekennzeichnet sein. Zum Beispiel durch eine andere Farbe oder Schrift-Auszeichnung. Ausserdem empfiehlt es sich, solche Links immer in einem neuen Fenster zu öffnen, damit der Besucher die eigene Seite nicht ganz verlässt. Ausserdem sollten Links nicht versteckt sein, sondern gut sichtbar im Text auffallen. Zu empfehlen ist, Links unterstrichen zu lassen, denn dies ist nun mal ein Standard bei Links, und Standards sind unsere Freunde.

Fehler 6: Unklare E-Mail Links

Links, die das E-Mail Programm öffnen, sollten auch als solche gekennzeichnet sein. Entweder durch ein anderes Layout oder durch eine erklärende Bezeichnung. Dadurch kann der Besucher selbst entscheiden, ob sich sein E-Mail Programm öffnet (was im schlimmsten Fall den Computer verlangsamt, wenn er das Mail-Programm erst starten muss) oder nicht.

Fehler 7: Links, die nicht funktionieren

Links, die nicht funktionieren oder deren Ziel nicht mehr existiert sind eine wahre Pest. Es gibt viele kostenlose Link-Checker im Internet, mit deren Hilfe man seine Webseite nach sogenannten “Broken Links” checken kann. Zu empfehlen ist der w3c Linkchecker. Sollte es nicht möglich sein, solche “Broken Links” zu entfernen, dann sollte der Einsatz eigener 404-Seiten in Erwägung gezogen werden.

Fehler 8: Seltsame Schriftarten

Mal ganz davon abgesehen, dass es momentan nur eine Hand voll websicherer Schriftarten gibt und die Anwendung von Javascripts zur Anzeige nicht sicherer Schriftarten immer noch etwas tricky ist… benutzt die websicherern Schriftarten Times New Roman, Georgia, Arial, Tahoma, Verdana, Trebuchet MS, etc… Und um Himmels und Suchmaschinen Willen, stellt Text auf Webseiten als Text und nicht als Bild dar!

Fehler 9: Schlechte Lesbarkeit

Eine Zeit lang waren kleiner Fließtext auf Webseiten der letzte Schrei. Auch wenn dem Besucher der Webseite die Augen schmerzten beim Lesen der Texte, gerade Designer stellten Fließtexte auf Ihrer Webseite in Schriftgröße 10px dar, am Besten noch mit miserablen Kontrast. Da konnte man sich schon fragen, ob diese Designer während der Typografie-Stunden geschlafen haben.

Fehler 10: Erwartungen werden nicht erfüllt

Besucher kommen meist mit bestimmten Grund-Erwartungen auf eine Webseite. Wenn diese nicht erfüllt werden, kann das schnell dazu führen, dass der Besucher die Seite schneller verlässt, als er sie aufgerufen hat. Standards sind unsere Freunde und sollten eingehalten werden. Auch wenn sich Standards von Zeit zu Zeit ändern. Das heisst nun nicht, dass Standards sklavisch eingehalten werden müssen. Aber man sollte in gewissen Grenzen bleiben.

Dennoch verhindert die fehlende Unterstützung des Internet Explorers 6 den weitgehenden Einsatz von PNG-Grafiken. Solange der Internet Explorer 6 noch eine gewisse Verbreitung besitzt, wird sich daran auch nichts ändern.

Es kursieren viele Methoden, dem Internet Explorer 6 die Transparenz von PNGs beizubringen. Mein persönlicher Favorit ist die Methode mit dem Einsatz des “iepngfix.htc”. Diese Funktion basiert auf Javascript und wird entweder in das Hauptverzeichnis oder, falls vorhanden weil übersichtlicher, im Javascript-Ordner der Webseite abgelegt. Mittels einer CSS-Definition kann man nun PNG’s als Hintergrund eines DIV-Containers oder als “normales” Bild überall auf der Webseite einbinden.

Okay, fangen wir an. Wir haben die Webseite hochgeladen und sie ist im Browser ohne Probleme aufrufbar. Wir haben die Webseite auch schon direkt bei allen Suchmaschinen angemeldet, auch wenn nur Google wirklich wichtig ist. Damit Google die eigene Seite in den Suchergebnissen anzeigen kann, muss der Googlebot vorbei geschaut haben und die Webseite in den Google Index aufgenommen haben. Da sich aber sehr viele neue Webseiten bei Google anmelden, kann es einige Zeit dauern, bis die Webseite in den Index kommt, also indexiert wird.

Während man früher gerne mit Hilfe von Ping-Diensten (z.B. Pingomatic) die Indexierung einer Webseite enorm beschleunigen konnte, geht das heute leider nicht mehr so einfach. Aber obwohl Google nach dem Leitspruch “Do no Evil” agiert, kann man sich Google’ s Geldgier zu Nutzen machen.

Als Erstes benötigt man einen Google-Adsense Account. Google Adsense zaubert diese kleinen, mehr oder weniger schnuckeligen Werbeblöcke auf die Webseite. Keine Angst, diese Dinger braucht man nicht ewig. Nun erstellt man Werbung für seine zu indexierende Seite, fügt den Code in sein HTML ein und lädt die Sache hoch.

Rufe im Browser deine Seite auf. Dort sind jetzt die Werbblöcke von Google zu sehen. Am Anfang sind diese immer gleich. Das bedeutet, dass Google noch keine “echte” Werbung bereitstellt. Jetzt klicke 50mal hintereinander auf den “Refresh”-Button. Spätestens nach dem 50ten Klick verändert sich die Anzeige der Werbung und echte Werbung erscheint. Was ist geschehen?

Google hat ein vitales Interesse daran, über seine Werbung Geld zu machen. Das kann Google aber nicht, wenn die Seite auf der die Werbung zu sehen ist, nicht gefunden wird. Deshalb zählt Google die Anzahl der Seitenzugriffe auf die Seite (noch scheint es egal zu sein, wer die Seite wie aufruft). Haben die Seitenzahl einen gewissen Wert überschritten, schaltet Google die richtige Werbung frei und schickt den Googlebot hinterher, damit die Webseite in den Index kommt und gefunden werden kann. Und genau das ist es, was wir haben wollen. So schlagen wir Google mit dessen eigener Gier nach Geld ein Schnäppchen. Übrigens habe ich diese Methode bei pixel-kingdom.com angewendet und war binnen 48 Stunden mit allen Seiten im Google Index.

Nochmals kurze Anleitung:

1. Google Adsense Konto eröffnen (falls noch nicht geschehen)
2. Adsense generieren und auf Seite einfügen
3. Mindestens 50mal die Seite laden, bis sich die richtige Werbung freischaltet
4. Nach 48 Stunden ist die Seite im Google Index

1. Man benutzt die “Conditional Comments” und gibt dem Internet Explorer 6 sein eigenes, nur für ihn erstelltes Stylesheet. Das ist eine gängige Methode, ohne Frage. Allerdings muss dafür eine eigene CSS Datei ins Web geladen werden.
2. Man weiss, wieso es das Webdesign im Internet Explorer zerhaut. Diese Gründe werde ich jetzt im Einzelnen besprechen bevor ich mich dranbegebe, meine eigene Seite im IE6 zu betrachten (Gott sei mir gnädig!).

Problem:

Der Container des Inhaltes und der Container der Navigation passen nicht mehr nebeneinander

Der Internet Explorer 6 hat die dumme Angewohnheit, bei floatenden Boxen den angegebenen Margin Wert zu verdoppeln:

#content {
float: left;
margin-right: 10px;
}

Aus dem oben geschilderten Beispiel macht der IE6 einen Margin-right Wert von 20px, was zwangsläufig dazu führt, dass sich die Navigation statt an der Seite unter dem Content platziert.

Die Hilfe:

Einfach die CSS-Anweisungen für den Content-Container mit einem “display: inline;” ersetzen. Dadurch ergeben sich keinerlei Nachteile in anderen Browsern und der Internet Explorer 6 wird den Margin Wert so übernehmen, wie der Webdesigner es sich vorgestellt hat.

Wieso?

Sobald ein Element des Webdesigns über den Wert “float” verfügt, wird diesem vom Internet Explorer 6 automatisch der “Display”-Wert “Block” gegeben. Dadurch doppeln sich die Margin Werte und das Design wird zerhauen. Wird der Display Wert allerdings auf “inline” gestellt, entfällt diese Zuweisung. Tja, der Internet Explorer…