Little Boxes – der HTML-Crashkurs

Praktische Add-ons zur Browsererweiterung

Testen Sie unsere 1893 Kurse

10 Tage kostenlos!

Jetzt testen Alle Abonnements anzeigen
Machen Sie sich in diesem Video mit einer kleinen Sammlung nützlicher Browsererweiterungen vertraut, die Ihnen die Entwicklung von Webseiten wesentlich erleichtern: View Source Chart, Web Developer und ColorZilla.

Transkript

Es gibt unzählige Add-ons, Plug-ins und Erweiterungen, je nach Browser heißen die unterschiedlich für die verschiedenen Browser. Ich möchte Ihnen hier drei wichtige vorstellen, und zwar zum einen eher unbekannt View Source Chart von Jennifer Madden, gibt's für den Firefox. Und View Source Chart macht hier einen Chart, ein Diagram aus dem Quelltext. Normalerweise sieht Quelltext hier Seitenquelltext anzeigen eher unübersichtlich aus, immerhin ein bisschen bunt eingefärbt, aber es ist kein Vergleich mit dem, was View Source Chart macht. Ich werde das einmal hier kurz installieren. Sie sehen hier Jetzt installieren und einmal neu starten. Und gleich ist der Firefox wieder da. Da ist er schon. So, jetzt ist View Source Chart installiert und wenn ich jetzt mit der rechten Maustaste drauf klicke, dann gibt es hier einen neuen Befehl Seitenquelltext formatiert anzeigen. Wenn ich da jetzt drauf klicke, dann sehen Sie den Unterschied hier. Sie sehen, der Quelltext wird schön übersichtlich als little boxes dargestellt, als rechteckige Kästchen und in einer einfachen Testseite, ich schließe diesen Tab mal wieder so wie hier. Wenn Sie jetzt den Unterschied sehen, Seitenquelltext formatiert anzeigen, dann sehen Sie hier schon die Kästchen. Ein Kästchen in einem Kästchen und so weiter. So, das ist View Source Chart. WEB DEVELOPER ist ein Klassiker. Den habe ich bereits installiert. Ich klicke hier mit Rechts drauf und mache die Symbolleiste sichtbar. Hiermit kann man CSS bearbeiten. Das ist so vielfältig, das wird man mit der Zeit kennenlernen. Hier Kontur Blockelemente, das haben Sie eventuell schon gesehen. Es gibt so viele Befehle hier, die sehr, sehr nützlich sind. Da komme ich immer mal wieder drauf zurück auf die WEB DEVELOPER Symbolleiste. Das Ganze hier ist die Homepage chrispederick.com. Das ist der Programmierer. Man kann die entweder hier installieren, die WEB DEVELOPER Toolbar gibt's für Chrome, Firefox und Opera, oder hier dierekt bei mozilla.org. Bei den Add-ons, hier kann man auch spenden, wenn man das Ding häufig benutzt. Und last but not least hier ColorZilla-ein Farbtool für Firefox und Chrome erhältlich. Advanced Eyedropper, ColorPicker, Color Analyzer und so weiter. Also damit kann man Farben auswählen. Ich hab das hier für den Firefox, werde ich es einmal kurz schnell installieren. So, und da kommt er schon. Jetzt Firefox will immer noch neu gestartet werden. Bei Chrome ist das meistens nicht nötig nach einer Erweiterungsinstallation. So, und hier ist der Firefox wieder. Dann sehen Sie jetzt hier ein neues Symbol, das ColorZilla-Symbol. Und wenn man darauf klickt, kann man jetzt ColorPicker, Pipette, auswählen und kann jetzt auf der Seite eine beliebige Farbe hier zum Beispiel auswählen und dann sieht man hier gleich den Hexadezimalwert und kann man das selbst in seinen eigenen Webseiten verwenden.

Little Boxes – der HTML-Crashkurs

Sehen Sie, wie HTML und CSS funktionieren und lernen Sie die dabei die unabdingbaren Grundlagen der Webprogrammierung kennen.

3 Std. 5 min (41 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Software:
Exklusiv für Abo-Kunden
Ihr(e) Trainer:
Erscheinungsdatum:11.03.2015
Aktualisiert am:28.09.2016
Laufzeit:3 Std. 5 min (41 Videos)

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!