Check: Internet Explorer 8 Developer Tools: Nützlich für SEO und gegen Spam

Ganz gleich, ob die persönliche Browser-Vorliebe eher in Richtung Firefox, Safari & Co geht - am Test einer Website im Internet Explorer führt kein Weg vorbei. Da ist es umso besser, dass der neue Internet Explorer 8 endlich Developer Tools mitbringt, die sich auf Augenhöhe mit der Firebug-Erweiterung für Firefox und Safaris Web Inspector bewegen. Wir zeigen Ihnen, wie Sie die neue Testumgebung nutzen. Die Entwicklung einer Website beginnt fast immer mit einem HTML-Dokument, das die für das Layout notwendigen Gestaltungselemente enthält und per CSS formatiert wird. Am besten nimmt man auch einige Beispiele für Überschriften, Absätze, Listen, Tabellen, Formulare et cetera in diese HTML-Vorlage auf und formatiert sie gleich mit. Dann kann man später in Ruhe die einzelnen Seiten entwickeln oder das Template in ein CMS integrieren, ohne dass man das CSS ständig um Formatierungen für während der Entwicklung einfließende Inhalte ergänzen muss.

Developer Tools

Die Developer Tools (DT), seit Internet Explorer 8 fester Bestandteil des Microsoft-Browsers, erleichtern Ihnen alle mit HTML, CSS und Javascript verbundenen Entwicklungsschritte. Sie lassen sich über das Extras-Menü per Mausklick öffnen, sind aber auch über F12 erreichbar. Zunächst öffnen sich die DT in einem eigenen Fenster. Mit STRG + P integrieren Sie es - analog zur Firebug-Erweiterung für Firefox - in das Hauptfenster des Browsers.

Das DT-Fenster zeigt links den Inhalts- und rechts den Eigenschaftenbereich. Darüber finden Sie zwei Gruppen von Tabs, über die Sie zwischen den verschiedenen Inhalts-Typen beziehungsweise unterschiedlichen Darstellungsformen für die Eigenschaften wählen können. Ganz oben findet sich das obligatorische Hauptmenü.

HTML debuggen

Das HTML-Template können Sie mithilfe der DT an den Validator des W3C schicken, um den Code auf Übereinstimmung mit den (X)HTML-Standards zu überprüfen. Damit diese Überprüfung tatsächlich funktioniert, muss die Seite im Netz liegen, was bei neuen Projekten selten der Fall ist. Ansonsten bleibt Ihnen nur der Klick auf Lokaler HTML-Code, bei dem es sich schlicht um einen Link zur entsprechenden Upload-Möglichkeit beim W3C handelt.

HTML-Editor

Der Validator bezieht seine Fehlermeldungen auf konkrete Zeilennummern. Unter Ansicht/Quelle/Ursprüngliche bringt auch der IE eine mit Zeilennummern versehene Ansicht des Quellcodes auf den Bildschirm. Allerdings scheint er seine Probleme mit Zeilenumbrüchen aus der Unix-Welt zu haben, denn nicht immer stimmen die Nummern mit denen des Validators überein. Deshalb binden Sie lieber Ihren eigenen Editor ein, indem Sie in den DT unter Datei/Quelle der Internet Explorer-Ansicht anpassen auf Andere klicken. Der so konfigurierte Editor erscheint aber nur, wenn man im Ansicht-Menü des Browsers auf Quelle klickt.

SEO und Blog-Pflege

Viele DT-Funktionen entpuppen sich erst auf den zweiten Blick als für das HTML-Design nützlich. Aktivieren Sie etwa unter Ansicht den Eintrag Tabindizes, zeigt Ihnen der Browser an, in welcher Reihenfolge die Seitenelemente beim Drücken der Tab-Taste durchlaufen werden - ein Ansatz für eine anschließende Optimierung.

Einen Hauch von Suchmaschinen-Optimierung umgibt die Funktion Alternativtext anzeigen, die Sie im Menü Bilder finden. Damit kommen Sie fehlenden Alt-Texten auf die Schliche und nutzen das Optimierungspotenzial Ihrer Seiten voll aus. Ähnlich nützlich ist auch der Linkbericht, den Sie im Ansicht-Menü finden. Er enthält eine Liste aller in einer Seite enthaltenen Links. Seit Internet Explorer 8 sind die Einträge durchnummeriert. So lassen sich Seiten mit größeren Verweis-Sammlungen sehr bequem auf Einhaltung von Googles 100-Links-Regel () überprüfen.

Wo wir gerade bei den Links sind: Die DT können Sie auch verwenden, um die Kommentare in einem Blog von Spam-Links zu befreien. Dazu rufen Sie das Blog auf, starten die DT und klicken unter Ansicht auf Link-Pfade. Dann zeigt der Internet Explorer alle Link-Ziele direkt neben den Links in der Website an, was das Sichten und Aussortieren merklich erleichtert.

HTML-Inspektion

Hat man einen Fehler in der Website festgestellt, schiebt man die Website mit den DT sozusagen unter das Röntgen-Gerät. Dazu aktivieren Sie im Inhaltsbereich den Reiter HTML, klicken auf das Pfeil-Symbol und wählen dann das fehlerhafte Seitenelement durch Anklicken aus.

zm_timkaufmann