Tags ‘firebug’

CSS-Eigenschaften plattformübergreifend visualisieren

Browser, Webdesign | Samstag, 02.01.2010 | Noch kein Kommentar

Wer Informationen über den DOM-Zweig eines CSS-Elementes sucht, kann nicht immer auf Firebug zurückgreifen. Insbesondere auf betagteren Systemen bzw. mobilen Lösungen kann der zusätzliche Ressourcenverbrauch des Firefox-Plugins als störend empfunden werden. Mehr lesen … »

Neu laden des Browserfensters automatisieren

Browser, Webdesign | Samstag, 26.12.2009 | 1 Kommentar

Viele Webentwickler benutzen bei der Erstellung des Codes ihren Lieblingseditor, überprüfen aber dennoch die Änderungen permanent in ihrem Webbrowser. Das führt dazu, dass ein ständiges hin- und herspringen zwischen Code-Editor und Browser erfolgt. Dabei sind stets mehrere Schritte notwendig: Zunächst speichert man den Code im Editor, wechselt dann zum Webbrowser und aktualisiert schließlich den Inhalt der Seite. Zwar lässt sich die Prozedur durch die Verwendung von Tastenkürzeln erheblich beschleunigen, dennoch kostet jede Wiederholung Zeit und Nerven.

Mehr lesen … »

Firepicker: Ein Farbwähler für Firebug

Webdesign | Freitag, 20.11.2009 | Noch kein Kommentar

Das Durchprobieren neuer Farbkombination beim Webdesign ist dank Firebug auch direkt im Browser möglich. Leider bietet Firebug keine Hilfe bei der Auswahl der Farben an, sodass entweder nur auf die englischen Farbnamen zurückgegriffen wird, die man im Kopf hat, oder aber der Hexadezimal-Wert aus einer anderen Quelle wie Photoshop kopiert werden muss. In diese Lücke springt das Add-on Firepicker, welches Firebug um einen Farbwähler erweitert.

Mehr lesen … »

Firebug Code-Änderungen nachvollziehen

Webdesign | Sonntag, 13.09.2009 | Noch kein Kommentar

Änderungen, die man mit Hilfe von Firebug am Code vorgenommen hat, werden von Haus aus leider nicht protokolliert. In der Praxis passiert häufig folgendes: Man probiert zahlreiche Varianten durch und kann sich am Ende nicht mehr genau erinnern welche Eingriffe man zu welchem Zeitpunkt durchgeführt hat. Man weiß nur noch, dass eine der letzten Varianten eigentlich die beste Lösung darstellte.

Mehr lesen … »

Einen grafischen Entwurf pixelgenau umsetzen

Webdesign | Sonntag, 06.09.2009 | Noch kein Kommentar

Das Design einer Website bei einem kommerziellen Projekt wird häufig zunächst als grafischer Entwurf (z. B. in Photoshop) entwickelt. Ist der Auftraggeber mit dem Design zufrieden, wünscht er oftmals eine pixelgenaue Umsetzung in HTML und CSS. Um zu überprüfen, ob diese Vorgabe auch tatsächlich erfüllt wurde, gibt es ein Firebug-Plugin namens Pixel Perfect. Das geniale Tool ermöglicht es, den Entwurf direkt über die Website zu legen, wobei die Position und der Transparenzgrad angepasst werden kann.

Mehr lesen … »