CSS einfach erklärt

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 … »

Ä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 … »

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 … »

Seit einiger Zeit ist es auf der Homepage von Mozilla möglich, Sammlungen seiner Firefox-Erweiterungen anzulegen und zu veröffentlichen. Im Kontext des CSS-Buches habe ich eine solche Zusammenfassung erstellt. Mehr lesen … »

Im Buch habe ich eine sehr ausführliche Anleitung zu Firebug verfasst, weil es nach meiner Meinung das momentan wichtigste Hilfsmittel für Webentwickler darstellt. Insbesondere in Verbindung mit dem Zusatzprogramm CodeBurner bietet es wirklich alle notwenigen Tools aus einem Guss.

Nun gibt es für Firebug ein weiteres Zusatzprogramm namens Firefinder, mit welchem man CSS-Selektoren auf einer Website suchen und mithilfe eines farbigen Rahmens sichtbar machen kann. Zusätzlich werden die gefunden Einträge gezählt und aufgelistet.

Mehr lesen … »