Firebug ist ein Firefox-Add-on mit coolen Tools, um Webseiten-Elemente zu untersuchen, zu debuggen und zu entwickeln. Es gibt jedoch keine Möglichkeit, diese Werkzeuge auf anderen Webbrowsern außer Firefox zu haben.
Die Entwicklung eines ähnlichen Werkzeugs für andere Browser mag harte Arbeit bedeuten, aber es wäre eine große Hilfe, wenn Sie Firebug auch auf anderen Browsern zum Laufen bringen könnten, wenn man bedenkt, dass jeder seine bevorzugten Browser hat.
Tja, hier kommt Firebug Lite ins Spiel, um Ihre Bedürfnisse zu lösen. Firebug Lite ist eine einfachere Version von Firebug, aber es kann auf IE, Opera, Chrome, Safari, iPad und iPhone verwendet werden, während es ähnliche Optionen und Funktionen beibehält.
10 Must-have iPad Apps für Designer (2018)
Webdesigner haben immer viel zu tun. Sie müssen Konzepte entwickeln, ihre…Weiterlesen
Installation von Firebug Lite auf Opera, Safari & Chrome
Mit Firebug Lite ist keine Installation nötig. In Java Script geschrieben, können Sie einen Firebug Lite-Link mit einem Lesezeichen versehen und schon steht er zur Überprüfung der Seite bereit. Was Sie also tun müssen, ist einfach den unten stehenden Link als Lesezeichen zu setzen (Sie können den Link auch in die Lesezeichenleiste Ihres Browsers ziehen).
Firebug Lite
Wenn Sie den Chrome-Browser verwenden, sollte das Lesezeichen wie unten dargestellt werden, wenn Ihre Lesezeichenleiste sichtbar ist.
Das war’s, Ihr Firebug Lite sollte jetzt funktionieren, wenn Sie es benutzen wollen.
Verwenden von Firebug Lite auf Opera, Safari & Chrome
Jetzt können Sie Firebug Lite verwenden, um praktisch jede Webseite zu untersuchen. Für dieses Beispiel verwenden wir Wikipedia.org.
Wenn die Webseite geladen ist, klicken Sie auf das Firebug Lite-Lesezeichen, das Sie zuvor gespeichert haben, und Sie werden sehen, dass eine Konsolenbox am unteren Rand der Webseite erscheint.
Wenn wir die Seite schließen, sehen Sie das unten links auf der Seite.
Nun sehen Sie das (+) und das (-) am Startpunkt vieler Zeilen. Das (+) bedeutet, dass unter dem Einzeiler von html weitere Zeilen geschlossen sind, und wenn Sie die Zeile markieren, sehen Sie, welchen Teil der Seite sie darstellt.
Wenn Sie jedoch die Zeilen, die durch einen Text, ein Foto, einen Link oder ein anderes Element auf der Webseite selbst repräsentiert werden, leichter erkennen möchten, klicken Sie auf die Schaltfläche „Inspizieren“.
Jetzt können Sie mit dem Mauszeiger über einen beliebigen Teil der auf der Webseite vorhandenen Elemente fahren, und Sie sehen die html-Zeile hervorgehoben. Das erleichtert Ihnen die Inspektion.
Installation von Firebug Lite auf iPad oder iPhone
Bookmarklets passen nicht wirklich gut zu iPad und iPhone. Um Firebug Lite auf iPad und iPhone zu installieren, gehen Sie folgendermaßen vor:
- Bookmarken Sie diese Seite auf Ihrem iPad oder iPhone.
- Benennen Sie das Lesezeichen in „Firebug“ um.
- Markieren und kopieren Sie das gesamte Skript unten
javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F&&F.documentElement.namespaceURI;E=E?F(E,'script'):F('script');E('id',b);E('src',I+g+T);E(b,u);(F('head')||F('body')).appendChild(E);E=new%20Image;E('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened'); - Gehen Sie zur Lesezeichenoption und drücken Sie „Bearbeiten“. Wählen Sie dann das Lesezeichen „Firebug“ aus.
- Entfernen Sie die ursprüngliche URL und fügen Sie das Bookmarklet ein.
- Wählen Sie „Done“ auf Ihrer Tastatur.
- Nun versuchen Sie, eine beliebige Website zu öffnen und wählen Sie das Lesezeichen „Firebug“ aus und Sie werden ein funktionierendes Firebug am unteren Rand Ihres iPad-Bildschirms sehen.
Fazit
Firebug Lite ist bei weitem gut genug, um eine schnelle Seiteninspektion durchzuführen. Sie können html, css und alle Skripte ansehen, die zum Aufbau der Webseite verwendet wurden. Obwohl Chrome seine eigene Web Developer-Erweiterung hat, enttäuscht Firebug Lite bei weitem nicht.