KompoZer HTML-Editor

KompoZer ist eine Freeware zur Bearbeitung von HTML-Seiten. Es handelt sich um einen HTML-Editor nach dem WYSIWYG-Prinzip, der es erlaubt, Webseiten durch Schreiben des jeweiligen Inhalts und grafisches Zusammenklicken von Formatierungen zu erstellen, ohne den Quellcode von Hand bearbeiten zu müssen.

Meine Empfehlung:
1
WIX 5 Sterne
Große Gestaltungsfreiheit, alle Funktionen.
2
Squarespace 5 Sterne
Einfache Bedienung, schöne Ergebnisse.
3
1&1 IONOS 4 Sterne
Bester Anbieter aus Deutschland.

KompoZer ist aus der Entwicklung des Programms Nvu hervorgegangen. Wie bei Nvu (seit 2006) ist jedoch auch die Weiterentwicklung des Programms KompoZer (seit 2010) inzwischen zum Stillstand gekommen. Das Nachfolgeprogramm, initiiert vom Schöpfer der beiden Editoren Daniel Glazman, ist BlueGriffon, das wie letzterer ein WYSIWYG-HTML-Editor ist und auf Programmcodes aus der Umgebung der Mozilla Foundation aufbaut.

Neben dem sogenannten WYSIWYG-HTML-Editor enthält KompoZer ein eigenes FTP-Modul zum Übertragen der fertigen HTML-Seiten auf einen Internet-Server und einen speziellen Editor für die CSS-Formatierungsregeln. Der KompoZer ist durch zusätzliche Programmpakete und Themes erweiterbar. Er kann jedoch keine Framesets verarbeiten.

Für das Rendering der zu verarbeitenden Dateien sowie der eigentlichen Oberfläche wird die Rendering-Engine Gecko des Mozilla-Projekts verwendet.

Arbeiten mit dem HTML-Editor

Starten Sie den KompoZer. Es öffnet sich ein Hauptfenster. Im unteren Teil des Fensters sehen Sie die Symbolleiste. Der obere Teil des Fensters wird von der Menüleiste eingenommen. Hier gibt es eine Reihe von möglichen Befehlen (Datei, Bearbeiten,). Daran schließt sich die Leiste mit den Bearbeitungswerkzeugen an, die eine Auswahl an Schaltflächen wie Neu, Öffnen, etc. enthält.

Neue Seite erstellen::

Die Schaltfläche „Neu“ befindet sich ebenfalls in der Bearbeitungsleiste.

Vorhandenes Team öffnen („Open“).

Hier gehen Sie ähnlich vor wie in den meisten anderen Programmen. Wir gehen davon aus, dass Sie die Seite in Form von HTML auf der lokalen Festplatte gespeichert haben. Klicken Sie in einer Menüleiste auf „Datei“ und dann auf „Datei öffnen“. Blättern Sie durch die Ordner, bis Sie Ihre Datei haben, wählen Sie sie aus und tippen Sie auf die Schaltfläche „Öffnen“.

Bearbeiten der Webpage

Anleitung Kompozer Kompozer Version 2. Januar 2008 ab 3.6.2008 Seite 12 Sie sehen Ihre Webseite – egal ob sie noch ganz leer oder schon bearbeitet ist – in dem großen Fenster in der Mitte am unteren Rand des Fensters. Viele der Bearbeitungsmöglichkeiten sind den Funktionen einer Textverarbeitung sehr ähnlich. Mit den vier Schaltflächen am oberen Rand des Dialogfelds können Sie verschiedene Bearbeitungsfunktionen ausführen. Um zu wissen, was sie genau bedeuten, halten Sie den Cursor über das Symbol, um zu sehen, ob ein Tooltip angezeigt wird.

Speichern einer Seite

Um ein Dokument als HTML-Datei zu speichern, klicken Sie auf das Symbol „Speichern

“ in der Bearbeitungssymbolleiste. Wenn es sich um ein neues Dokument handelt, werden Sie aufgefordert, einen Titel für die betreffende Seite einzugeben

. Dieser wird in der Registerkarte am oberen Rand des Editorfensters aufgeführt. Denken Sie daran, dass dies NICHT ein Dateiname ist. Klicken Sie abschließend auf die Schaltfläche OK. Daraufhin öffnet sich ein Speicherdialog, in dem Sie einen geeigneten Namen für Ihre Datei und den Ordner vergeben oder auswählen können. Standardmäßig ist HTML der bevorzugte Dateityp. Anzeigen einzelner Seiten in ( Webbrowser ) Um zu prüfen, wie eine bestimmte Seite in einem Webbrowser aussieht, wählen Sie die Option „Seitenansicht“ in der Master-Symbolleiste.

Online-Hilfe

Die Hilfefunktion in Kompozer ist die erste Anlaufstelle, um nach spezifischen Informationen zu suchen. Sie bietet ein Glossar, ein Verzeichnis und eine Suche. Das deutsche NSU-Forum http://www.nvu-composer.de/forum/ wird empfohlen. Sie können es im Internet finden. Es beschäftigt sich auch eigenständig mit Kompozer. Auf http://wysifauthoring.informe.com/ gibt es ein deutsches Forum. – Ein deutsches Forum.

In allen Foren finden Sie Beiträge von Benutzern mit unterschiedlichem Erfahrungshintergrund, vom Einsteiger bis zum “Guru“.

Seiten erstellen

Es gibt einige Möglichkeiten, eigene Seiten zu erstellen oder bestehende Seiten zu öffnen. Eine neue Seite. Schritt 1. Wählen Sie Neu im Menü Datei. Das neue Fenster Neue Vorlage oder Seiteneinrichtung wird angezeigt. Aktivieren Sie in der Liste die Option eine leere Seite und dann das Feld Strict – DTD. 3. Deaktivieren Sie die Option eine XHTML-Seite erstellen auf ( ) (falls vorhanden). Oder klicken Sie alternativ in der Bearbeitungssymbolleiste auf Neu. Hinweis: Der Einblendpfeil auf einer Seite dieser Schaltfläche gibt Ihnen die Möglichkeit, die Seite in einer Karteikarte oder im Fenster Neu zu bearbeiten. Letzteres führt Sie zur zweiten Instanz von Kompozer. Außerdem wird mit dem Dropdown-Pfeil daneben die Option Erweitert… Variante. aufgerufen werden. Dadurch gelangen Sie zurück in den Dialog. Hier können Sie auch “Eine neue Unterseite aus einer Vorlage bilden“ wählen. Eine “Vorlage“ besteht aus einer Unterseite mit einer Reihe von vorgefertigten Details. Dies kann sehr nützlich sein, wenn Sie für mehrere Seiten das gleiche Aussehen und ähnliche Inhalte haben wollen. Vorlagen werden ab Kapitel 7 erklärt. Hinweis: Wenn Sie diese Einstellungen als Standard für Ihre anderen Seiten verwenden möchten, markieren Sie ein Kästchen für „HTML 8“ sowie „Streng“ im Menü „Erweiterte Eigenschaften“ auf dem Bildschirm „Extras – Optionen, Voreinstellungen“. Speichern einer Datei Klicken Sie auf Datei – Ziel speichern unter . Im Speicherdialog können Sie den gewünschten Ordner angeben. Im Eingabefeld Dateiname steht bereits ein Seitenname, ergänzt um die Endung html. Diesen können Sie bei Bedarf kürzen, oder auch alles klein schreiben (müssen Sie aber natürlich). Der Typ der Datendatei ist standardmäßig HTML, aber Sie könnten die Erweiterung auf htm ändern. Kompozer wird nach neuen Namen für jede Geschichte suchen. Wenn Sie eine Sprache speichern wollen, die noch keinen Namen hat, können Sie ihr einfach den Namen geben. Klicken Sie auf die Schaltfläche „Speichern“. Es öffnet sich nun ein Eingabefeld für den Seitentitel. Geben Sie einen Titel für die betreffende Seite ein („Seite“) und klicken Sie anschließend auf die Schaltfläche „OK“. Es erscheint das Dialogfenster „Speichern“. Wenn Sie Windows so eingestellt haben, dass registrierte Erweiterungen (z. B. doc, xls, httm …) nicht angezeigt werden, werden diese beim Speichern nicht angezeigt. Sie können die Sichtbarkeit dieser Dateierweiterungen in Windows auch über Systemsteuerung – Verzeichniseinstellungen steuern. Deaktivieren Sie hier auf der Registerkarte „Ansicht“ das Kontrollkästchen „Erweiterungen für bekannte Dateitypen ausblenden“. Nachdem Sie Ihre Daten bearbeitet / „verarbeitet“ haben, können Sie sie erneut aufnehmen und speichern lassen. Klicken Sie dazu auf das Kästchen „Speichern“. Da die betreffende Datei bereits mit einem Label versehen ist, werden Sie nun nicht mehr nach dem Dateinamen oder Titel gefragt.

Text positionieren

Im Allgemeinen wird die Positionierung von Text dadurch bestimmt, dass ein Absatz auf den vorhergehenden Absatz folgt. Der Abstand von Text zwischen Absätzen und über und unter einzelnen Überschriften wird von Ihrem Browser bestimmt. Mit Hilfe von Formatierungen (siehe Abschnitt vier.2.14) können Sie diese Vorgabe ändern. Absätze und Überschriften erstrecken sich über den gesamten Rand der Seite. Dies ist eine clevere Funktion. Experimentieren Sie mit der Änderung der Fenstergröße im KompoZer. Dadurch wird der Fließtext so formatiert, dass er in das vergrößerte Fenster passt, und natürlich wird er dadurch länger. Sie können dies bis zu dem Punkt treiben, an dem Sie nichts mehr hineinpassen. Um das Web zu verstehen, ist es grundlegend zu wissen, dass es in erster Linie für die Vermittlung von Wissen und nicht für die Darstellung von Inhalten konzipiert wurde. Web-Design-Tools bieten die Möglichkeit, die Darstellung zu verbessern. Aber wenn wir es zu genau nehmen, können wir auf Probleme stoßen. Wir müssen dem Web so viel Freiheit geben, wie es braucht.

Formulare

Formulare bieten eine Möglichkeit für den Betrachter, Daten zur Verarbeitung an den Host-Computer (Server) zu senden. Im einfachsten Fall kann dies eine E-Mail-Nachricht sein, es kann aber auch ein eCommerce-Bestellformular sein. Diese Formulare enthalten in der Regel Dropdown-Listen, Text- oder numerische Daten oder Ja/Nein-Antworten auf Fragen. Formulare benötigen eine entsprechende Software auf dem Webserver, um die richtigen Antworten auszuwerten. Formulare können in normalen Webseiten als Blockelemente platziert werden. In der normalen Ansicht umgibt Komponizer Formulare mit einem cyanfarbenen gepunkteten Rahmen. Formulare können neben normalen Blockelementen (Absätze, Überschriften…) auch spezielle Formularelemente zur Datenerfassung enthalten. Damit solche Elemente funktionieren, können sie nur in den Formularbereich eingefügt werden. Für alle Daten, die an den Server gesendet werden, enthält das gesendete Element Informationen darüber. Daher ist es notwendig, jedem dieser Elemente einen individuellen Namen zu geben, der vom Programmierer vergeben werden sollte. Die im Formular erfassten Daten werden an die Webseite weitergeleitet, die im Eingabefeld Aktions-URL in den Formulareinstellungen angegeben ist. In den meisten Fällen befindet sich die URL auf dem Server, auf dem sich die Webseite befindet, sie kann aber auch an einem ganz anderen Ort liegen. Für die eigentliche Übergabe der Daten gibt es die Methoden des GET und eines POST. Die gewünschte der beiden Methoden wird hier eingestellt. Welche Methode im Einzelfall die „richtige“ („korrekte“) ist, erfahren Sie beim Hersteller der entsprechenden Software.

Inhaltsverzeichnis

Liegt eine lange Dokumentation vor, deren Überschriften durch Rubriken der Qualitätsklassen 1 bis 6 unterteilt sind, kann der KompoZer automatisch ein Inhaltsverzeichnis (ToC) erstellen. Dieses Inhaltsverzeichnis spiegelt dann die Struktur der Seite wieder, entsprechend den Überschriften, aus denen sich das Inhaltsverzeichnis zusammensetzt. Standardmäßig sind die Telefonbucheinträge mit der Überschrift verknüpft; durch Anklicken eines Telefonbucheintrags können Sie zu der entsprechenden Seite springen. Auf Befehl kann das Inhaltsverzeichnis so nummeriert werden, dass die nachfolgenden Überschriften von der ersten Ebene an aufwärts nummeriert werden und die darunter liegenden zweiten Ebenen wieder mit der ersten Ebene aufwärts nummeriert erscheinen. Die Nummerierung von den unteren Ebenen untereinander beginnt wieder mit der Nummerierung von Ebene 1- aufwärts. Dies gilt auch für die nachfolgenden Verzeichnisebenen. Es ist nicht in jedem Fall notwendig, alle Überschriftenebenen in das Verzeichnis aufzunehmen: Sie können z. B. nur die erste Ebene aufnehmen und auch noch die zweite Ebene. Es ist auch nicht notwendig, alle Überschriftenebenen in die Seite aufzunehmen. Wenn auf der Seite nur die Überschriften 5 und -6 vorhanden sind, können diese auch die Basis für das Verzeichnis bilden. Wenn die Überschriften auf der Seite für eine zufriedenstellende Struktur des Verzeichnisses nicht ausreichen, ist es auch möglich, kurze Absätze speziell für diese Aufgabe einzufügen. Diese können auf allen Ebenen des Verzeichnisses eingefügt werden. Die Markierung der ausgewählten Unterabsätze erfolgt durch Anwendung einer speziell für diesen Zweck geschaffenen benannten Methode (Abschnitt . 4. )2.3). Falls erforderlich, kann ein über benannte Klasse erstelltes “<div>“ – ( Abschnitt 4. 5000 – kann zu diesem Zweck verwendet werden. Die Erstellung eines solchen Verzeichnisses und dessen Verwendung hat den Vorteil, dass Änderungen auf diesen Seiten automatisch berücksichtigt werden. Die Bedienung eines Verzeichnisses ist nur innerhalb der zugehörigen Partei möglich. Verweise auf übergeordnete Seiten müssen daher manuell erstellt und nachverfolgt werden.

Arbeiten mit Bildern

Das Einfügen von Grafiken in Seiten ist mit Kompozer einfach. Die meisten Browser erkennen Bilder mit den folgenden drei Aufnahmeformaten: GIF, JPG oder png. Sie können aber auch ein Grafikprogramm verwenden, das das Bild in ein brauchbares Format umwandelt. Natürlich können Sie auch das Bild eingeben, das sich bereits auf Ihrem Bildschirm befindet. Es empfiehlt sich jedoch (!), für jedes Bild, das Sie verwenden möchten, einen eigenen Ordner (Verzeichnis) anzulegen, in dem auch Ihre Seiten eingebettet sind, oder in einem Unterordner. Legen Sie dann das entsprechende neue Dokument dafür an. Gehen Sie dabei genauso vor, wie bei der Erstellung der Homepage. Sie sollten nun 2 Situationen haben, die am oberen Bildschirmrand über 2 Registerkarten angezeigt werden. Sie können also zwischen den Seiten wechseln, indem Sie auf die Registerkarten klicken. Geben Sie dieser neuen Seite einen aussagekräftigen Titel, z.B.: „Bilder“. Schreiben Sie (!) einen langen Absatz mit einigen Sätzen Text.

Fügen Sie das entsprechende Bild ein: Setzen Sie den Cursor in den Absatz, etwa an den Anfang des Satzes. Um eine Grafik einzufügen, klicken Sie in der Bearbeitungsleiste auf die Schaltfläche „Grafik“. Klicken Sie in den sich nun öffnenden Feldern auf „Durchsuchen“ und gehen Sie zu einem Ordner, in dem sich die gesuchte Datei befindet und wählen Sie diese aus. Klicken Sie auf die Schaltfläche „Öffnen“. Lassen Sie das Kontrollkästchen „URL relativ zur Seitenadresse“ aktiviert. Dadurch können sowohl die Seite als auch die Grafik später an anderer Stelle platziert werden – was beim Hochladen von Grafiken auf den Server notwendig ist. Dies ist notwendig, wenn die zugehörigen Dateien auf den Server übertragen werden. (Wenn Sie die Option deaktivieren) und die entsprechende Seite verschieben, wird versucht, die Grafik an der ursprünglichen Position wiederzufinden).

Tabellen

Mit Tabellen können Sie Daten – Texte, Bilder, Links, Formulare, Formularfelder und sogar andere Tabellen – in Zeilen und Spalten anordnen. Eine Tabelle ist im Allgemeinen ein rechteckiges Gitter, das Zellen und Spalten bildet, in denen Daten platziert werden. Das Gitter kann entweder sichtbar oder unsichtbar sein, und die Gitterreihen oder sogar die Ränder können eine beliebige Farbe haben. Darüber hinaus können z. B. auch die Zellen farbig sein. Die Gitterstruktur muss nicht regelmäßig sein; die erste Datenzeile kann eine einzige Zelle haben, für jede zweite können es 4 sein, für jede dritte  können es drei sein. Wenn jedoch ein Panel eingefügt werden muss, ist es regelmäßig. Das w3c empfiehlt, Tabellen nicht ausschließlich als Gestaltungsmittel für Dokumente zu verwenden, da dies laut w3c problematisch für die Interpretation durch Sprachprogramme sein kann. Darüber hinaus können Tabellen, wenn sie zusammen mit grafischen Elementen dargestellt werden, den Benutzer zum horizontalen Scrollen zwingen. Diese Probleme treten nicht auf, wenn eine Tabelle in einem Layout mit höherer Auflösung dargestellt wird. Um solche Probleme zu minimieren, ist es sinnvoll, bei der Gestaltung des Layouts anstelle von Tabellen sogenannte Style Sheets zu erstellen.

Meine Empfehlung:
1
WIX 5 Sterne
Große Gestaltungsfreiheit, alle Funktionen.
2
Squarespace 5 Sterne
Einfache Bedienung, schöne Ergebnisse.
3
1&1 IONOS 4 Sterne
Bester Anbieter aus Deutschland.
Categories
Website Editor

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert