Firefox Addons für Webdesigner und Entwickler

Titel: Firefox Addons für Webdesigner und Entwickler
Schwierigkeitsgrad: Fortgeschrittene
Autor: admin
Eingetragen: 08.01.2008
Hits: 13385
Kommentare: 2
User Bewertung: / 8 User haben abgestimmt

1 2 3 4 5


Social-Bookmark:

Wichtige und unverzichtbare Addons für Firefox, die jeder Webdesigner oder Entwickler installiert haben sollte.

Inhalt

Web Developer

 Die Web Developer Erweiterung für den Firefox ist eine Toolbar, die viele verschiedene und nützliche Tools für Webentwickler bereitstellt. Die Toolbar stellt 12 Hauptmenüpunkte dar, die jeweils weitere Untermenüpunkte haben.

Der erste Menüpunkt Disable ermöglicht verschiedene Einstellungen (z.B. JavaScript, Cache, Referer) mit einem Klick zu deaktivieren.

Unter dem Menüpunkt Cookies können Cookies bearbeitet, gelöscht oder auch hinzugefügt werden. Äußerst nützlich, wenn man gerade an einem System programmiert, dass mit Cookies arbeitet und man für das Testen die Cookie permanent wieder löschen muss.

Der Menüpunkt CSS zeigt euch auf einer Seite sämtliche verlinkten CSS-Dateien an. Ebenfalls können hier auch die CSS-Anweisungen deaktiviert werden, um z.B. zu prüfen, wie die Webseite in einem Textbrowser aussehen könnte. Die CSS-Anweisungen können ebenfalls im Browser editiert werden, um z.B. sofort prüfen zu können, wie andere Farbkombinationen wirken, ohne die echte CSS-Datei zu ändern.

Bei Forms finden sich Funktionen für Webformulare. So kann hier z.B. das Formular automatisch ausgefüllt oder die Methode POST und GET vertauscht werden.

Sehr nützlich ist der Menüpunkt Images. Hier kann man sich eine Liste mit fehlerhaften Bildern anzeigen lassen oder einfach alle Bilder deaktivieren. Ebenfalls können Informationen wie Alternativtext neben den Bildern dargestellt werden.

Unter Information lassen sich eine vielzahl an Informationen über die Webseite anzeigen. Äußert nützlich die View Document Size Funktion. Hier kann man sich einfach und schnell anzeigen lassen, wie groß die Webseite ist.

Der Menüpunkt Miscellaneous stellt verschiedene Werkzeuge bereit, z.B. ein Lineal oder Hilfslinien zum einfachen überprüfen, ob alles in einer Reihe ist. Äußerst nützlich hier ist die Small Screen Rendering Funktion, mittels der man sich anzeigen lassen kann, wie eine Webseite auf einem PDA oder SmartPhone aussehen würde.

Bei Outline kann man sich verschiedene HTML-Element umranden lassen, z.B. Tabellen oder Überschriften. Sehr nützlich ist, dass man sich auch Elemente umranden lassen kann, die deprecated sind.

Unter Resize kann man ganz einfach die Fenstergröße ändern, um zu prüfen, wie eine Webseite unter einer anderen Auflösung aussieht.

Sehr nützlich ist auch der Menüpunkt Tools. Hier kann ganz einfach die Webseite validiert werden. Wer allerdings den Addon HTML Validator installiert hat, wird auf diesen Menüpunkt eher weniger zurückgreifen.

Unter View Source kann man sich den Quelltext einer Webseite anzeigen lassen. Nützlich hier ist, wenn die Webseite noch mit Frames arbeitet, denn unter View Frame Source werden dann alle Seiten des Framesets gelistet und man kann sich einfach die entsprechende Seite heraussuchen und sich den Quelltext anzeigen lassen.

Zur Homepage Zur Homepage

HTML Validator

 Die HTML Validator Erweiterung für den Firefox ermöglicht es Webdesignern zu prüfen, ob der HTML Code valide ist oder nicht und zeigt entsprechend die Anzahl an Fehler und Warnungen an.

Besonders nützlich ist, dass der HTML Validator nicht nur den Algorithmus des W3C (validator.w3.org) zum Parsen verwendet, sondern ebenfalls den HTML Tidy Algorithmus kennt. Es lässt sich sogar einstellen, dass beide nach einander angewandt werden, um zu prüfen, ob die Seite valide ist oder nicht.

Es kann außerdem die Zugänglichkeitsstufe (Barrierefreiheit) eingestellt werden, um zu ermitteln, in wie weit eine Webseite barrierefrei ist.

Zur Homepage Zur Homepage

ColorZilla

 Mit der Erweiterung ColorZilla kann ganz schnell der Farbwert aus jedem Browserbereich ausgelesen werden. Der Farbwert lässt sich automatisch in verschiedenen Formaten (z.B. HEX oder RGB Wert) in die Zwischenablage speichern. Außerdem verfügt ColorZilla über verschiedene Farbpaletten sowie einem ColorPicker.

Zur Homepage Zur Homepage


Screen grab!

 Mit Screen grab! lassen sich schnell und einfach Screenshots erstellen. Dabei kann gewählt werden, ob vom sichtbaren Bereich, dem ausgewählten Bereich oder der gesamten Seite ein Screenshot erstellt werden soll. Die Screenshots können auch in die Zwischenablage kopiert werden und müssen nicht als Datei gespeichert werden. Dateien lassen sich als .JPG und .PNG abspeichern.

Zur Homepage Zur Homepage

IE Tab

 Der IE Tab ermöglicht einfaches Umschalten von Firefox zu Internet Explorer. Dabei wird die aktuelle Webseite innerhalb des Firefoxes mittels der Browser-Engine des Internet Explorers angezeigt. Das Addon verfügt außerdem über verschiedene Einstellungsmöglichkeiten. So kann beispielsweise eingestellt werden, welche Webseiten grundsätzlich mit der Internet Explorer Engine dargestellt werden sollen.

Zur Homepage Zur Homepage

Live HTTP Headers

 Live HTTP Headers ist äußert nützlich für Entwickler die prüfen möchten, was im Hintergrund passiert. Dieses Addon ermöglicht das mitschneiden der Kommunikation zwischen Browser und Server. Es listet außerdem mit auf, wenn ein Firefox Addon beim Aufruf einer Webseite ebenfalls eine Anfrage ins Internet stellt, zu sehen auf dem Bild "Generator", wo das Page Rank Addon eine Anfrage an Google sendet, um den Page Rank zu ermitteln.

Zur Homepage Zur Homepage

Kommentare

FireBug?

Hey,

was hier eindeutig noch fehlt ist der FireBug!

Und ein anderes interessantes Addon: YSlow!
http://developer.yahoo.com/yslow/
Damit wird die Seite mit Noten von A bis F bezüglich ihrer Performance bewertet.
Ebenso wird die Größe und die Ladezeit angezeigt.

Sehr interessant ;)

#2 - Monday der 12 January, 2009 12:15 Uhr - lsgdcity (Gast)

Pearl Crescent Page Saver

Hi,

ich benutze den "Pearl Crescent Page Saver" um Screenshots von Seiten zu erstellen.
Ist glaub ich ein bissl umfangreicher als der "Screen grab!" und erfüllt all meine Wünsche ;-)

http://pearlcrescent.com/products/pagesaver/

Einziger Nachteil, den ich eh nicht nutze: in der kostenlosen Version kann das Bild nicht in die Zwischenablage geschrieben werden.

#1 - Monday der 12 January, 2009 12:13 Uhr - lsgdcity (Gast)
1

Kommentar hinzufügen

Benutzername*
E-Mail
Titel*
Dein Kommentar*
Captcha*