INS-ecommerce

Visualisierung der Webseitenstruktur

Durch Zufall bin ich auf ein interessantes Tool zur Visualierung der Struktur einer Webseite gestossen mit dem man sich Graphen der DOM-Struktur erstellen lassen kann.

diagramm-blog-ins.de.gif

Das Bild zeigt die Visualisierung von blog.ins.de. (Hinweis: Applets müssen erlaubt sein, beim ersten mal kann das laden etwas dauern)

Links (A-Elemente) werden als blaue Punkte dargestellt, DIV-Elemente als grüne. Die Wurzel einer Webseite (HTML-Element) ist schwarz, im Bild rechts oben.

Mit etwas Übung erkennt man recht schnell die Struktur einer Website. Oben auf dem Bild z.B. die drei kreisförmigen Strukturen an deren Enden blaue Punkte sind - das sind drei Navigations-/Linkbereiche.

Der praktische Nutzen ist mir zwar noch nicht ganz klar, aber ich finde, eine interessante Visualisierung, die der Autor Sala da programmiert hat.

Ach ja, und als abschreckendes Beispiel folgt jetzt noch die Struktur der Startseite von spiegel.de

diagramm-spiegel-de.gif


Geschrieben von af in am: Montag, 3. März 2008
Permalink

Diesen Beitrag bei folgenden Diensten bookmarken:
del.icio.us - Digg it - Mister Wong - Technorati - Ruhr.com Suchmaschine

Kommentare
  • konstantin.tassidis Montag, 3. März 2008, 13:24 Uhr
    So sieht Westropolis aus Unübersichtliche Strukturen zu visualisieren und somit leichter zu erfassen liegt in der Natur des Menschen. (...) Allerdings haben diese Graphen etwas, was den meisten anderen Darstellungsformen fehlt: einen nahezu künstlerischen Aspekt. Das gilt umso mehr, da sich der Graph nicht als statisches Element präsentiert (...)

Nächster Artikel: Ruhrgebiet: Wir können alles ausser Marketing

Vorheriger Artikel: Dilemma am Valentinstag