Webseiten mit Seamonkey Composer erstellen

Das könnte Sie auch interessieren

HTML-Farbtabelle mit Designvorschau

Websichere Farben übersichtlich sortiert

Wenn man Webseiten direkt in HTML erstellt, ist ein visueller HTML-Editor ein nützliches Hilfsmittel. Diese Editoren erlauben es, Webseiten ähnlich wie in einer Textverarbeitung, z.B. Microsoft Word, zu erstellen. Bislang habe ich den Amaya-Editor vom w3c benutzt, war aber nie so ganz zufrieden damit, da die Bedienung teilweise etwas merkwürdig und ungewohnt daherkommt. Nun bin ich wieder einmal auf den Seamonkey Composer gestoßen und habe festgestellt, dass man damit mittlerweile ganz vernünftig arbeiten kann.

Ich möchte hier daher einmal beschreiben, wie man mit dem Seamonkey Composer Webseiten komfortabel nach dem WYSIWYG-Prinzip (na gut... im Prinzip jedenfalls ;) erstellen kann. Diese Methode eignet sich für alle, die sich nicht mit HTML-Quelltext herumschlagen wollen oder können. Grundsätzlich sind gewisse HTML-Kenntnisse aber natürlich nicht verkehrt, deshalb kann ich dem Interessierten zu diesem Thema das mittlerweile legendäre Selfhtml-Tutorial nur ans Herz legen.

Allgemeine Tipps

Der Seamonkey Composer ist Teil der Seamonkey Application Suite, die aus der früheren Mozilla-Anwendung hervorgegangen ist und nun unter diesem neuen Namen weiterentwickelt wird. Das Programm enthält einen Webbrowser, einen E-Mail-Client, einen IRC-Chat und eben den Composer, alles integriert in einer Anwendung. Die Seamonkey Suite kann man sich kostenlos von der Webseite des Projekts herunterladen und installieren.

Nach dem Starten der Anwendung ist zunächst der Webbrowser zu sehen. Um den Composer zu öffnen, klickt man auf das Symbol für den Composer unten links in der Symbolleiste.


Die Benutzeroberfläche des Composers ist im Wesentlichen die einer Textverarbeitung. Man kann nun eine (HTML-)Datei öffnen oder neu anlegen und gleich mit dem Schreiben beginnen. Die Formatierungsfunktionen für den Text sind selbsterklärend. Der Composer enthält auch eine ausführliche Anleitung, die man über das Menü Hilfe erreicht.

Die integrierte Rechtschreibprüfung, die anscheinend nach dem Start immer aktiviert ist, wirkt teilweise etwas störend, wenn jedes zweite Wort rot unterstrichen ist, daher schalte ich sie immer gleich über Edit / Spellcheck as you type aus.

Unterhalb der Editorfläche befinden sich vier Reiter für die verschiedenen Bearbeitungsansichten.


Mit <HTML>Source kann man sich den Quelltext ansehen und bearbeiten, Preview zeigt die Seite so, wie sie aussehen wird. In der Ansicht HTML Tags werden zusätzlich die Tags als kleines Symbol angezeigt, wobei von links nach rechts die Baumstruktur der Tags sichtbar wird. Man kann hier auch ein Element durch Klicken selektieren und es dann z.B. kopieren.

Ausschnitt aus der Tag-Ansicht

Text im Composer bearbeiten

Bei der Bearbeitung von Text muss man vor allem auf die Funktion der Eingabetaste achten: befindet man sich in einem Absatz, fügt Eingabe (Enter) drücken einen Zeilenumbruch innerhalb des Absatzes ein. Nochmaliges Eingabe drücken erzeugt dann einen neuen Absatz. Am Ende eines Absatzes muss man also generell zweimal Eingabe drücken.

Innerhalb einer Liste erzeugt Eingabe einen neuen Listenpunkt, einen Zeilenumbruch innerhalb des aktuellen Listenpunktes erhält man mit Umschalt+Eingabe.

In der Leiste unterhalb des Editorbereichs sieht man, wo bzw. in welchem Element sich der Cursor im Dokument gerade befindet.

Man kann hier die hierarchische Struktur des Dokuments erkennen: links befinden sich die äußeren Elemente, rechts die inneren. Ganz links befindet sich das <body>-Element, welches alle anderen umschließt. Man kann auf ein Element klicken und es damit auswählen, um es z.B. zu kopieren. Im Beispiel befindet sich der Cursor in einem Listenpunkt (<li>) innerhalb einer Aufzählungsliste (<ul>).

Links, Bilder und Tabellen kann man natürlich auch einfügen. Diese Funktionen sind ebenfalls selbsterklärend, ergänzend möchte ich auf die integrierte Hilfe verweisen, in der alles beschrieben ist.

Letzte Änderung: 01/04/13, 11:22:06 Uhr