HTML gezaubert

Zum Erstellen von Web-Seiten greifen Hartgesottene und erfahrene Linux-User selbstverständlich zu Vi oder Emacs. Doch wer sich seiner HTML-Kenntnisse noch nicht sicher ist, schaut sich erst einmal nach einem HTML-Editor um, dessen grafische Oberfläche die ersten Schritte zur eigenen Homepage erleichtert. Eines dieser Programme ist Quanta+ (http://quanta.sourceforge.net/).

Quanta fügt sich nahtlos in die Desktop-Umgebung KDE ein und gleicht vom Look&Feel und vom Verhalten her anderen KDE-Programmen. Jemand, der bereits mit KDE-Applikationen gearbeitet hat, wird sich sofort zurecht finden. Selbstverständlich läuft das Programm auch unter anderen Desktop-Umgebungen und Window-Managern.

Da die Entwicklungsschritte zwischen den einzelnen Beta-Versionen meist deutliche Verbesserungen aufweisen, empfiehlt es sich, die jeweils neueste Version zu installieren. Dieser Artikel bezieht sich auf die Version 2.0.pr2-60. Das Beta-Stadium sollte Sie nicht beunruhigen, denn das Programm arbeitet stabil.

Wie unter Linux allgemein üblich, wird es entweder auf einem X-Terminal mit quanta & oder – so vorhanden – über eines der Auswahlmenüs Ihres Desktop-Environments gestartet.

Der Arbeitsplatz

Abbildung 1: Die Quanta-Gesamtansicht

Auch wenn es auf den ersten Blick nicht so wirkt, ist Quanta+ inzwischen eine richtige kleine IDE. Dementsprechend komplex sind die Hilfsangebote und die Konfigurationsmöglichkeiten des Programms.

Nach dem Aufruf präsentiert es sich in einer dreigeteilten Ansicht (Abbildung 1). Ganz links finden Sie Ihren Verzeichnisbaum, rechts daneben das Editor-Fenster und darunter das Message Window, das die verschiedensten Meldungen ausgeben kann.

Sowohl die Dateibaumansicht als auch das Editor-Fenster bieten verschiedene Reiter an, durch die Sie sich von links nach rechts durchklicken können. Die Baumdarstellung verdeckt eine Übersicht über das spätere HTML-Dokument, die Projektansicht und den Zugriff auf die verschiedensten Manuals (HTML, Javascript, PHP4und CSS), die teils von der lokalen Festplatte, teils aus dem Internet hinzugelinkt werden.

HTML besteht aus einer Vielzahl von Formatanweisungen, die sich unterschiedlichen Funktionsgruppen zuordnen lassen. Entsprechend fassen die Quanta-Autoren ähnliche oder zusammenhängende Auszeichnungsmöglichkeiten auf Reitern oberhalb des Editorbereichs zusammen. Ein Klick darauf bringt eine entsprechende Werkzeugleiste zum Vorschein.

Der erste Reiter mit der Aufschrift Normal enthält Formatierungsanweisungen, wie Sie sie von einem Textverarbeitungsprogramm her kennen. Wenn Sie den Mauszeiger über einem Tool-Icon ruhen lassen, verrät Ihnen der Tooltipp die Funktion des entsprechenden Buttons.

Die übrigen Karteikarten bieten Buttons zur Schriftauswahl, Tabellen- und Listenerstellung, zur Gestaltung von Formularen und eine Gruppe Funktionen, die sich keiner der Kategorien eindeutig zuordnen lassen. Darunter fällt zum Beispiel ein Farbauswahldialog.

Erste Schritte

Auf der Normal-Karteikarte (Abbildung 1) fällt ganz links ein Icon auf, das nicht so recht mit den übrigen Tools zur Absatz- und Zeichenformatierung harmoniert. Ein Klick auf dieses leere Blatt mit Zauberstab sorgt für einen Quick-Start, bei dem Sie ein Assistent durch die wichtigsten Voreinstellungen Ihres HTML-Dokument führt: Titel, Hintergrundbild oder -farbe, Schrift- und Linkfarbe legen Sie so auf einfache Weise fest (Abbildung 2).

Mit einem Klick auf den OK-Button wird nun das Grundgerüst des HTML-Dokuments ins Editor-Fenster geladen und der Cursor zwischen die Body-Tags gesetzt, damit Sie sofort loslegen können.

Diese Grundeinstellung reicht freilich nicht aus, um einer Web-Seite ein ansprechendes Äußeres zu verleihen, sodass der Wunsch nach weiteren Formatierungsmöglichkeiten entsteht. Hier haben Sie nun zwei Möglichkeiten, eine HTML-Datei zu bearbeiten.

Entweder Sie wissen bereits, welches Element Sie als nächstes benötigen. Dann klicken Sie das entsprechende Icon an. Quanta erzeugt daraufhin sowohl das Anfangs-, als auch das Endtag und platziert den Cursor dazwischen, sodass Sie den zugehörigen Text sofort an der richtigen Stelle eingeben können. Oder Sie schreiben zunächst Ihren Text und überlegen sich im Nachhinein, wie er formatiert werden soll. In diesem Falle markieren Sie die entsprechende Stelle und klicken dann auf das Icon mit der gewünschten Formatanweisung. Quanta umschließt den markierten Text mit dem passenden Tag-Paar.

Einzelne Teile des Dokuments färbt der Editor ein. Dieses "Programmiererbunt" (in der Fachsprache Syntax-Highlightinggenannt) hilft bei der Orientierung im Quelltext und der Fehlerkorrektur. Sollten sich Syntaxelemente während der Eingabe farblich nicht passend verändern, hat sich eine Ungenauigkeit eingeschlichen. Hier gilt es, genauer hinzuschauen oder die Online-Hilfe zu konsultieren.

Wann immer Sie sich das Ergebnis Ihrer Bemühungen in der Browser-Ansicht ansehen wollen, klicken Sie in der Quanta-Werkzeugleiste auf das Icon mit dem Auge oder drücken [F6]. Damit schaltet das Programm auf die interne Vorschau um (Abbildung 4). Mit einem nochmaligen Druck auf [F6] kommen Sie zur Code-Ansicht zurück.

Die Vorschau genügt, um die entstehende Seite schnell zu überprüfen, garantiert aber nicht das gewünschte Aussehen in den verschiedenen Browsern. Hierzu müssen Sie die Datei abspeichern und in den jeweiligen externen Web-Browser laden.