Tilt

Webseitenstrukturen in 3D zeigen

Die Firefox-Erweiterung Tilt macht den Aufbau einer Webseite sichtbar. In einem 3D-Modell kann der Nutzer die Struktur räumlich erkennen, ohne auch nur eine Zeile HTML-Code zu studieren.

Artikel veröffentlicht am ,
Tilt zeigt Webseitenaufbau in 3D an.
Tilt zeigt Webseitenaufbau in 3D an. (Bild: Golem.de)

Die 3D-Visualisierung der Firefox-Extension Tilt ist mit Hilfe von WebGL realisiert worden und nutzt das DOM-Modell zur Strukturierung der Ansicht. Die 3D-Seiten erinnern an Bauklötze, die in verschiedenen Ebenen angeordnet sind, je nachdem, zu welchem DIV-Block oder UL oder zu welcher anderen Dokumentenstruktur sie gehören. Der Body als unterster Layer bildet die Basis der 3D-Darstellung.

  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
  • Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
Firefox-Erweiterung Tilt zeigt Golem.de in 3D (Bild: Golem.de)
Stellenmarkt
  1. Fachassistent/in (m/w/d)
    KDN.sozial, Paderborn
  2. Anwendungsentwickler JavaScript (m/w/d)
    ivv GmbH, Hannover
Detailsuche

Tilt wurde von Victor Porof, Cedric Vivier und Rob Campbell entwickelt. Das Projekt startete im Rahmen des Google Summer of Code und wird nun nach Angaben des Teams weiterentwickelt. Die Firefox-Erweiterung soll kein reines Spaßprojekt sein, sondern vielmehr Webentwicklern die verschiedenen Beziehungen der Webseitenelemente zueinander grafisch verdeutlichen. So sollen Fehler schneller erkannt werden.

Gestartet wird Tilt über das Menü oder über die Tastenkombination Strg+Shift+L und mit Escape wird die Darstellung wieder beendet.

Künftig soll es mit Tilt auch möglich sein, den markierten Teil des HTML-Codes optisch hervorzuheben, die 3D-Darstellung bei Codeänderungen automatisch zu aktualisieren oder den Z-Index zu visualisieren. In einem Blog informieren die Entwickler über den aktuellen Stand.

Golem Akademie
  1. Blender Grundkurs: virtueller Drei-Tage-Workshop
    07.-09.06.2022, Virtuell
  2. Einführung in Unity: virtueller Ein-Tages-Workshop
    21.06.2022, Virtuell
Weitere IT-Trainings

Tilt kann über Github als XPI heruntergeladen und auch als Quellcode bezogen werden.

Bitte aktivieren Sie Javascript.
Oder nutzen Sie das Golem-pur-Angebot
und lesen Golem.de
  • ohne Werbung
  • mit ausgeschaltetem Javascript
  • mit RSS-Volltext-Feed


SoniX 04. Aug 2011

Wir sind auch nicht hier um Sie zu überzeugen. Ich persönlich kann es aus dem Text auch...

c3rl 02. Aug 2011

Auch mit guter räumlicher Auffassungsgabe, welche ich mir zuschreibe, und auch trotz...

Hans Schmucker 01. Aug 2011

Etwas mehr muss es dann doch schon sein (3D-nav, z-index beeachten...) , aber ja: es gibt...

Hans Schmucker 01. Aug 2011

Es liegt auf dem linken Mousebutton.



Aktuell auf der Startseite von Golem.de
Forschung
Blaualge versorgt Computer sechs Monate mit Strom

Ein Forschungsteam hat einen Mikroprozessor sechs Monate ununterbrochen mit Strom versorgt. Die Algen lieferten sogar bei Dunkelheit.

Forschung: Blaualge versorgt Computer sechs Monate mit Strom
Artikel
  1. EC-Karte: Trotz Kartensperre können Diebe stundenlang Geld abheben
    EC-Karte
    Trotz Kartensperre können Diebe stundenlang Geld abheben

    Eine Sperre der Girocard wird nicht immer sofort aktiv. Verbraucher können sich bereits im Vorfeld schützen.

  2. Swisscom-Chef: Vermasselt habe ich nichts
    Swisscom-Chef
    "Vermasselt habe ich nichts"

    Urs Schaeppi gibt den Chefposten bei Swisscom auf. Sein Rückblick auf neun Jahre Konzernführung fällt ungewöhnlich offen aus.

  3. EV Driver Survey: Elektroautos bei IT-Experten besonders beliebt
    EV Driver Survey
    Elektroautos bei IT-Experten besonders beliebt

    Fahrerlebnis und Technik sind für Fahrer von Elektroautos der größte Zusatznutzen dieser Mobilitätsform. Fast alle würden wieder ein E-Auto kaufen.

Du willst dich mit Golem.de beruflich verändern oder weiterbilden?
Zum Stellenmarkt
Zur Akademie
Zum Coaching
  • Schnäppchen, Rabatte und Top-Angebote
    Die besten Deals des Tages
    Daily Deals • LG OLED TV (2021) 77" günstig wie nie: 1.771,60€ statt 4.699€ • Grakas günstig wie nie (u. a. RTX 3080Ti 1.285€) • Samsung SSD 1TB (PS5-komp.) + Heatsink günstig wie nie: 143,99€ • Microsoft Surface günstig wie nie • Jubiläumsdeals MediaMarkt • Bosch Prof. bis 53% günstiger[Werbung]
    •  /