HTML EDITOR PHASE 5²
Dokumentation
1 Einleitung
1.1 Was ist der HTML-Editor?
1.2 Autor
1.3 Lizenz
1.4 Spenden
1.5 Homepage
1.6 Zur Anleitung
2 Einstieg für Anfänger
2.1 HTML-Änfänger
2.2 Die Benutzeroberfläche des HTML-Editor
2.3 Die ersten Schritte im HTML-Editor
2.3.1 Die erste Datei erstellen
2.3.2 Speichern der Datei
2.3.3 Einfügen der ersten Befehle
2.3.4 Ansicht des Dokuments
2.4 Wie geht's weiter?
2.4.1 Experimentieren
2.4.2 Weiterbilden
2.4.3 Ein Projekt entwerfen
3 Projektbezogenes Arbeiten
3.1 Das erste Projekt
3.2 Projekteinstellungen
3.2.1 Verzeichisse
3.2.2 Vorgaben
3.2.3 Optionen
3.2.4 Tags anpassen
3.2.5 Benutzermenü
3.2.6 Schriften
3.2.7 Datum
3.3 Projektverwaltung
3.4 Projektmanagment für Fortgeschrittene
4 Der Editor
4.1 Features
4.2 Der Cursor
4.3 Markierungen
4.4 Zwischenablage
4.5 Einrückung
4.6 Eingabemodi
4.7 Lesezeichen
4.8 Suchen
4.9 Ersetzen
4.10 HTML-Befehle einfügen
5 Dateien
5.1 HTML-Dateien
5.1.1 Vorschau von HTML-Dokumenten
5.2 HTML-Sonderformate
5.3 Graphikdateien
5.3.1 Bildbetrachter
5.4 Cascaded Style Sheets
5.4.1 Was sind Style Sheets
5.4.2 Mit Style-Sheets arbeiten
5.5 Dateiarchive
5.6 Skripte & Applets
6 Dateimanager
6.1 Verzeichnisknöpfe
6.2 Popupmenüs
6.3 Mausbefehle
6.4 Dateifilter
7 Werkzeuge
7.1 Dateiübergreifendes Ersetzen
7.2 Dateiübergreifendes Suchen
7.3 Debugger
7.4 Fussnotenassistent
7.4.1 Fussnote einfügen
7.4.2 Verweise einfügen
7.4.3 Fussnotenformatierung anpassen
7.5 HTML Konstruktor
7.6 Schlüsselwörter Tagging
7.7 Tabellenassistent
7.8 Zeilenweise Ergänzung
8 Plugins
8.1 Installation von Plugins
8.2 Pluginmenü
8.3 Programmieren von Plugins
8.4 Verknüpfungen und Batchdateien im Pluginmenü
9 Includetechnik
9.1 Was sind Includes ?
9.2 Includekonfiguration
9.3 Includes einfügen
10 Programmeinstellungen
10.1 Anbindungen
10.2 Dateiendungen
10.2.1 Dateiendungen für Filter
10.2.2 Parser und Dateiendungen
10.3 Optionen
10.4 Verknüpfungen
10.4.1 Verknüpfungen erstellen
10.4.2 Verknüpfung im Windowsdateimanager Popupmenü
11 Tips, Tricks und Kleinigkeiten
11.1 Benutzerdefinierte Farbpalette
11.2 Schnelles Schliessen einer geöffneten Datei
11.3 Dateien öffnen per Drag&Drop
11.4 Weitere Quellen
Der HTML Editor Phase 5 ist ein Freewareprogramm zum Erstellen von
Hypertextdokumenten (HTML) für Internet und Intranetprojekte unter
Windows 9X/NT. Das Projekt wurde von mir 1996 gestartet und wird seitdem
ständig weiterentwickelt.
Das Programm ist allen Internet-Nutzern weltweit gewidmet, die das
Netz mit Inhalt füllen wollen. Freies Publizieren im Internet ist
heute und noch viel mehr in der Zukunft eine gesellschaftliche und
politische Notwendigkeit. Das Programm ist in der Hoffnung geschrieben,
dass es vielen Menschen dabei hilfreich ist.
Die Entwicklung wird von freiwilligen Spenden der Benutzer finanziert.
Das Programm ist trotzdem kostenlos, es besteht kein Zwang zu bezahlen.
Dennoch werden speziell auch die gewerblichen Benutzer gebeten, das
Projekt mit Geldspenden zu unterstützen.
Der Autor des Programms studiert zur Zeit Informatik mit Schwerpunkt
Multimedia an der FH-Giessen.
Ulli Meybohm
Giessener Str. 24
35410 Hungen
Germany/Europe
Homepage: www.meybohm.de
E-Mail : ulli@meybohm.de
Tel: 06402-505777
Deweiteren haben folgende Leute zu der Entwicklung des Projektes beigetragen:
H.D.Berretz, Christian Stolz (Berater und Programmierer), Thorsten
Hassiepen (Internetserver), Jens Kreutschmann und Haarlequin (Spiegelserver),
Markus Freitag (Backups), S.Münz (SelfHTML), Prof. T.Letschert (Rechnernetze-Vorlesung),
Andrew S. Tanenbaum (Autor von Computernetze), Günter Born (Berater,
Motivator, HTML-Kompendium 4) und unzählige andere, die das Programm
finanziell unterstützten, Logos erstellten, Betas testeten, Dokumente
korregierten, Anregungen und Ratgaben, Fehler meldeten oder mich einfach
nur motiviert haben.
Das Programm ist Freeware! Das Programm wird verteilt in der Hoffnung,
dass es für viele Anwender nützlich sein wird, aber OHNE IRGENDEINE
GARANTIE, nicht einmal die Garantie auf Funktionsfähigkeit. Für mögliche
durch das Programm verursachte Fehler und Schäden an Soft- und Hardware
übernimmt der Autor keine Haftung! Das Copyright am Programm bleibt
bei Ulli Meybohm, Hungen. Die Verteilung, der Verkauf oder sonstige
kommerzielle Nutzung des Programms ist nur mit Zustimmung des Autors
(ulli@meybohm.de) erlaubt. Eine Verlinkung der Internetseite www.meybohm.de
bzw. www.meybohm.de/htmledit ist erlaubt und ausdrücklich erwünscht.
Der Name des Programms ist Ulli Meybohms HTML EDITOR. Die Entwicklung
der Programms wird in Phasen ausgedrückt. Die aktuelle Phase ist 5.
Die aktuelle Version der Phase wird mit dem Releasedatum gekennzeichnet.
Die Phasennummer erhöht sich, wenn grössere Änderungen am Programm
vorgenommen wurden.
Das Programm ist kostenlos, Sie können die Entwicklung des Programmes
dennoch mit einer freiwilligen Spende fördern. Speziell gewerbliche
Nutzer werden gebeten, das Programm zu unterstützen. Spenden können
auf dem Postweg an den Autor geschickt werden oder auf folgendes Konto
überwiesen werden:
Ulli Meybohm, Sparkasse Laubach/Hungen
Bankleitzahl: 51352227
Kontonummer: 1229111
Falls Sie es wünschen, können Sie einen Eintrag in der Supporterliste
des HTML-Editors bekommen, bei höheren Spenden eventuell auch mit
Werbebanner.
Die Homepage des HTML-Editors ist www.meybohm.de. Im Internet ist immer
die aktuellste Version des Programmes erhältlich. Falls Sie das Programm
von irgendeiner Freeware-CD bekommen haben, schauen Sie erstmal im
Internet nach, ob es nicht eine neuere Version gibt. Die Update erfolgen
ca. in Monatsabständen. Diese Anleitung wird auch ständig ausgebaut,
und ist auch im Internet erhältlich. Des Weiteren gibt es im Internet
ein Forum, in dem Sie mit anderen Benutzern diskutieren können, und
Fehlermeldungen und Anregungen aufschreiben können. Im Internet gibt
es auch Plugins, die die Funktionen des HTML-Editors erweitern. Falls
Sie noch nicht auf der Seite waren, sollten Sie mal vorbeischauen!
Die Anleitung wurde mit Lyx unter Linux erstellt. Es gibt einmal die
Version zum Ausdrucken in den Formaten Postscript und PDF, die auf
meiner Homepage erhältlich sind. Mit dem Programm wird die Hilfe nochmal
als HTML-Datei ausgeliefert, die aus Lyx exportiert wird. Das HTML-Format
ist zwar zum lesen am Bildschirm besser geeignet, allerdings geht
einiges an Layoutqualität durch das exportieren verloren. Es wird
empfohlen, sich die Hilfe im Postscript oder PDF-Format zu besorgen
und auszudrucken, wenn Sie intensiv damit arbeiten wollen.
Falls Sie schon Kenntnisse über HTML haben und Sie die grundlegenden
Funktionen von Texteditoren beherrschen, können Sie dieses Kapitel
überspringen.
Falls Sie kompletter HTML-Anfänger sind, sollten Sie zuerst einmal
einige Grundlagen über HTML lernen. Gute Seiten dazu finden Sie im
Internet in Hülle und Fülle. Die beste Einstiegsseite ist wohl SELFHTML
(www.teamone.de/selfhtml). Die grundlegenden Dinge zu HTML kann man
sich in ca. 1-2 Stunden anlesen. Auf meiner Homepage unter dem Punkt
"Anleitungen" habe ich noch einige zusätzliche hilfreiche Quellen
aufgeführt, die Ihnen beim Erlernen des Webdesigns behilflich sein
könnten.
Sie brauchen sich erstmal um Dinge wie Projekteinstellungen oder Programmeinstellungen
nicht zu kümmern. Erstellen Sie zuerst einmal ein paar einfache HTML-Dateien,
damit Sie ein Gefühl für die Struktur von HTML bekommen. HTML ist
wirklich nicht schwer. Lassen Sie sich von Java-Script, CSS , Applets
und anderen Ausdrücken nicht verrückt machen. Das ist alles Schnickschnack.
Lernen Sie erst einmal die Grundstruktur, wie man Überschriften setzt,
und die Schrift formatiert, was für Textarten es vordefiniert gibt
und wie man Grafiken, Links und Tabellen einfügt.
Wenn Sie dies in HTML verstanden haben, wird Ihnen die Benutzung der
Befehle im Editor nicht schwerfallen. Allerdings sollten Sie sich
wirklich vorher die Zeit nehmen, und ein wenig über HTML lesen. Lernen
macht nun mal keinen Spass und ist anstrengend. Wer etwas anderes
verspricht lügt. Allerdings werden Sie so viel schneller erste Erfolge
erzielen und mehr Sicherheit bekommen, als wenn Sie einfach blind
drauflos programmieren. Ich habe meine ersten Seiten auch gemacht,
ohne viel nachzudenken. Das Ergebnis war miserabel.
Bevor wir anfangen, beschaffen wir uns mal einen Überblick über die
Programmoberfläche und klären einige Begrifflichkeiten.
Das Hauptmenü ist die obere Leiste (Datei, Bearbeiten....). Hier können
alle Befehle des Editors aufgerufen werden. Eins weiter unten ist
die obere Symbolleiste, auch Shortcutleiste genannt. Hier werden häufig
benutzte Befehle des Hauptmenüs als Symbole abgebildet, um die Befehle
schneller aufrufen zu können. Die untere Symbolleiste ist ähnlich,
bis auf den Unterschied, dass die Befehle nochmal in Gruppen unterteilt
sind (Text, Tabelle...). Der untere Teil des Fensters ist vertikal
aufgeteilt. Rechts befindet sich das Editorfenster, wo Sie Ihre HTML-Dateien
bearbeiten. Hier sehen Sie den Quelltext der HTML-Dateien, die Sie
geöffnet haben. Wenn Sie mehrere Dateien gleichzeitig geöffnet haben,
dann können Sie mit der Lasche (Karteireiter) über dem Editorfenster
zwischen den Dateien wechseln. Auf der linken Seite sehen Sie den
Dateimanager. Hier können Sie durch die Verzeichnisse wechseln, Dateien
öffnen, Grafiken einfügen, Dateien verlinken und noch vieles mehr.
Detailliertere Informationen dazu finden Sie in späteren Kapiteln.
Ich gehe jetzt davon aus, das Sie wenigstens ein paar fundamentale
Dinge über HTML wissen. Seien Sie mir nicht böse, aber ich kann hier
leider nicht nochmal die komplette HTML-Sprache erklären.
Lassen Sie uns nun eine erste Testdatei erstellen. Wählen Sie im Hauptmenü
Datei->Neu. Es erscheint nun ein Fenster, in dem Sie einige Angaben
zu der Datei machen können, die Sie erstellen wollen. Lassen Sie sich
nicht irritieren, Sie müssen jetzt noch nicht alles verstehen. Geben
Sie einfach einen Titel ein, z.B. Testseite, und drücken Sie den Knopf
Neue Datei erstellen.
Nun müsste die folgende Datei im Editor erscheinen:
<html>
<head>
<meta name="author" content="Ulli Meybohm">
<title>Testseite</title>
</head>
<body bgcolor="#FFFFFF" text="#000000"link="#D00000"
vlink="#D00000" alink="#D00000">
Hier fügen Sie die HTML-Befehle ein
</body>
</html>
Die Dokumente sind hierarchisch strukturiert. Sie sehen nun, dass der
komplette Text sozusagen von <html>...</html> eingerahmt wird. Die
nächste Unterteilung ist der <head>-Teil und der <body>-Teil. Im Head-Teil
(deut.: Kopf) werden angaben zum Dokument gemacht, wie Autor, Titel
und sonstige Beschreibungen, auf die wir später eingehen werden. Der
Kopfteil ist erstmal nicht so wichtig.
Der wichtigste Teil ist der Body-Teil (deut.: Körper). Hier wird Ihr
eigentlicher Inhalt eingetragen. Die etwas kryptischen Angaben in
dem <Body ...> Befehl brauchen Sie erstmal nicht zu interessieren.
Das sind lediglich Farbangaben für Schrift, Hintergrund und Verknüpfungen
(engl.: Links).
Wir haben nun die Datei erfolgreich angelegt. Jetzt müssen wir sie
noch auf Platte speichern, ihr also einen Dateinamen zuweisen. Wählen
Sie dazu im Hauptmenü Datei->Speichern. Es erscheint nun der Standard-Dialog
zum Speichern, den Sie auch aus anderen Programmen kennen dürften.
Wählen Sie hier ein Verzeichnis Ihrer Wahl aus, und geben Sie als
Dateinamen test.html ein.
Nun sehen Sie auch, wie Ihre Datei farbig eingefärbt wird. Zur besseren
Übersicht werden die HTML-Befehle mit einer anderen Farbe vom normalen
Text abgehoben.
Gehen Sie mit dem Cursor (der blinkende vertikale Balken) im Editorfeld
zwischen die Body Tags
<body ....>
|
</body>
Wir wollen nun eine Überschrift einfügen. Überschriften gibt es in
6 Grössen. 1 ist dabei die grösste und 6 die kleinste. Wir wollen
eine Überschrift 1. Ordnung einfügen. Drücken Sie dazu STRG+F1, oder
im Hauptmenü auf Format->Überschrift->1. Ordnung.
Nun müsste Ihr Dokument folgendermassen aussehen:
<body ....>
<h1>|</h1>
</body>
Geben Sie nun zwischen <h1> und </h1> eine Überschrift ein, z.B. Testüberschrift
1. <h1> leitet die Überschrift 1, und </h1> beendet sie. Wenn bei
einem Befehl ein Querstrich (engl.: Backslash [/]) vorangestellt ist,
dann bedeutet das, dass der zuvor eingeleitete Befehl beendet wird,
in diesem Fall, dass die Überschrift zuende ist.
Nun müsste Ihr Dokument folgendermassen aussehen:
<body ....>
<h1>Testüberschrift 1|</h1>
</body>
Gehen Sie nun mit dem Cursor an das Ende der Zeile, und drücken Sie
Enter, um eine neue Zeile einzufügen. Wir wollen nun unseren ersten
Paragraphen einfügen. Drücken Sie dazu STRG+Enter oder im Hauptmenü
Format->Paragraph.
Jetzt müsste der Paragraphbefehl <p> </p> eingefügt werden. Schreiben
Sie nun dazwischen einen beliebigen Text, z.B. "Dies ist mein erstes
HTML-Dokument."
Nun müsste Ihr Dokument folgendermassen aussehen:
<body ....>
<h1>Testüberschrift 1|</h1>
<p>Dies ist mein erstes HTML-Dokument.</p>
</body>
Jetzt wollen wir den Text "HTML-Dokument" noch fett erscheinen lassen.
Markieren Sie dazu den Text "HTML-Dokument" und wählen Sie im Hauptmenü
Schrift->Fett.
Der Text den Sie markiert haben müsste nun von dem <b>...</b> Befehl
eingeschlossen sein. Ihr Dokument müsste also so aussehen:
<body ....>
<h1>Testüberschrift 1|</h1>
<p>Dies ist mein erstes <b>HTML-Dokument<b>.</p>
</body>
So, jetzt haben wir schon ein Dokument, das wir uns betrachten können.
Drücken Sie nun auf den Knopf in der oberen Symbolleiste ganz rechts,
der mit dem weissen Papier und der Lupe. Falls Sie den Microsoft Internet
Explorer 4.0 oder höher installiert haben (empfohlen!), kann der HTML-Editor
die Datei im HTML-Editor Fenster anzeigen. Es müsste nun die HTML-Vorschau
erscheinen. Wenn Sie den Explorer nicht installiert haben, wird die
Windows-Standardanwendung für HTML-Dateien gestartet (Netscape o.a.).
Falls gar nichts passiert, haben Sie keinen Internet-Browser auf Ihrem
System installiert. Es wird auf jeden Fall empfohlen den Microsoft
Internet Explorer zu installieren, auch wenn Sie sonst mit Netscape
arbeiten. Nur mit ihm haben Sie die Möglichkeit einer HTML-Editor
internen Vorschau. Das ist erheblich komfortabler als immer externe
Programme zu starten. Der Microsoft Explorer ist kostenlos und auf
vielen Computerzeitschrift-CDs enthalten. Die Browserkonfiguration
wird später genauer beschieben.
Nun haben Sie die grundlegenden Kenntnisse über das Erstellen und Bearbeiten
von HTML-Dateien.
Sie können nun etwas mit den HTML-Befehlen experimentieren. Probieren
Sie ein paar Befehle aus den Hauptmenüpunkten Format und Schrift aus.
Spielen Sie ein bisschen mit dem Programm. Schauen Sie sich die verfügbaren
Hauptmenübefehle an. Sie müssen nicht alles auf Anhieb verstehen.
Testen Sie einfach einige Befehle aus, und schauen Sie was passiert.
Falls Sie noch über geringe HTML-Kenntnisse verfügen, lesen Sie Dokumentationen
zum Thema HTML und machen Sie sich mit der Sprache besser vertraut.
Es ist wirklich nicht so schwer. Schauen Sie sich auch die Quelltexte
von anderen Internetseiten an. Wählen Sie in Ihrem Browser die Funktion
Quelltext anzeigen. Einige Seiten sind sehr kompliziert, lassen Sie
sich davon nicht entmutigen oder verwirren. Mir geht es genauso, obwohl
ich mich schon seit Jahren damit beschäftige. Viele professionelle
Seiten benutzten Tabellen zur Seitenformatierung. Der Quellcode wird
meist durch Scripte erzeugt und ist nahezu unlesbar.
Setzen Sie sich ein Ziel, wählen Sie ein Projekt, das Sie verwirklichen
wollen. Dies kann eine private Homepage sein, wo Sie sich und Ihre
Familie beschreiben oder eine Fanpage oder eine Seite für einen Verein
oder Ihr Gewerbe. Planen Sie erst auf dem Papier, sammeln Sie Ideen,
Text und Grafiken, bilden Sie Strukturen heraus.
Lesen Sie dann in dieser Anleitung, wie man ein Projekt anlegt und
nach seinen Wünschen konfiguriert. Nutzen Sie Ihre HTML-Kenntnisse
um Ihre Ideen zu verwirklichen. Wenn Sie nicht weiterwissen, dann
suchen Sie im Netz Seiten, die Ihren Vorstellungen entsprechen, und
schauen Sie sich den Quelltext an, um zu sehen, wie es andere Leute
hinbekommen haben. Wenn Sie bestimmte HTML-Befehle nicht verstehen,
schlagen Sie in SelfHTML nach und lesen was der Befehl bedeutet.
Der HTML-Editor bietet eine komfortable Projektverwaltung für Sie an.
Sie können für jedes Ihrer Projekte eigene Einstellungen definieren.
Angenommen Sie haben zwei Homepages, eine private, und eine für Ihren
Fussballclub. Die beiden Projekte unterscheiden sich in vielen Dingen,
zum Beispiel ist die Farbauswahl oft unterschiedlich. Die Projektdateien
liegen natürlich auch in anderen Verzeichnissen. Vielleicht werden
die Projekte auch von verschiedenen Autoren bearbeitet, die alle Ihre
eigenen Einstellungen wollen, aber an einem Computer arbeiten. Der
HTML-Editor ermöglicht Ihnen zu jedem Projekt, das Sie machen, eigene
individuelle Einstellungen anzulegen. Die Befehle, die mit der Projektverwaltung
zu tun haben, stehen im Hauptmenü unter dem Punkt Projekt.
Auch falls Sie nur ein Projekt bearbeiten, z.B. Ihre private Homepage,
sollten Sie sich mit den grundlegenden Dingen der Projektverwaltung
vertraut machen. Es hört sich zwar kompliziert an, ist aber nicht
schwierig und erleichtert Ihnen Arbeit.
Wenn Sie den HTML-Editor starten, wird automatisch ein Projekt angelegt,
Sie brauchen sich darum also gar nicht zu kümmern. Das Projekt heisst
standardmässig Projekt1. Da der Name wenig aussagekräftig ist, geben
Sie dem Projekt erst einmal einen gescheiten Namen. Wie, lesen Sie
im später Abschnitt.
Das Fenster mit den Projekteinstellungen wird aufgerufen unter dem
Hauptmenüpunkt Projekt->Projekteinstellungen. Hier erscheint ein Fenster
mit allen möglichen Konfigurationsmöglichkeiten. Hier gilt wieder:
lassen Sie sich nicht durch die Fülle der Optionen abschrecken oder
verwirren. Anfangs werden Sie wahrscheinlich nur einen Bruchteil der
Optionen benötigen. Allerdings soll das Programm auch für Profis sein,
deswegen ist es schwer auf die Optionen zu verzichten. Zuerst sollten
Sie im Eingabefeld Projektname dem Projekt einen Namen geben. Im folgenden
werde ich nun alle Abschnitte der Projekteinstellungen genauer erläutern.
Bevor Sie ein Projekt anfangen sollten Sie sich vorher Gedanken über
die Verzeichnisstruktur machen. Alle Projektdateien sollten in einem
Unterverzeichnis stehen, das eventuell noch in untergeordnete Verzeichnisse
aufgeteilt ist. Auf gar keinen Fall dürfen Sie Ihre Dateien über verschiedene
Laufwerke verteilen! Am besten Sie überlegen sich ein Stammverzeichnis,
wo Sie die Homepage ablegen möchten, z.B. in c:\.
Das Verzeichnis, das wir erstellen wollen, um dort die Homepagedateien
zu speichern, nennen wir z.B. homepage. Sie müssen nun mit dem Windows-Dateimanager
das Verzeichnis homepage in Ordner c:\ erstellen. Wir haben also nun
das Verzeichnis c:\homepage erstellt. Für einfache Homepages mit wenigen
Dateien (etwa 1-20) reicht das vollkommen aus. Wenn Sie umfangreichere
Seiten erstellen wollen, sollten Sie das Verzeichnis nochmal untergliedern,
z.B. könnten Sie Verzeichnisse anlegen für Grafiken, für Style Sheets,
für Include-Dateien und andere Dateitypen. Jeder Dateityp bekommt
dann ein eigenes Verzeichnis, etwa so:
c:\homepage Für Ihre HTML-Dateien
c:\homepage\grafiken Für Ihre Grafikdateien
c:\homepage\include Für Ihre Include-Dateien
c:\homepage\css Für Ihre Style Sheets
c:\homepage\skripte Für Ihre Skripte
Wie gesagt, die Unterteilung brauchen Sie nur bei umfangreicheren Projekten.
Wenn Sie nur ein paar Seiten haben können Sie alle Dateien in ein
Verzeichnis speichern. Aber bedenken sie: Ihre Seite könnte wachsen!
Die Verzeichnisstruktur später abzuändern ist mit vielen Mühen verbunden,
also überlegen Sie sich es vorher gut, wie Sie Ihre Verzeichnisse
strukturieren.
Zurück zur Konfiguration. Im Abschnitt Verzeichnisse können Sie eben
diese Verzeichnisse auswählen, damit der Editor weiss, wo sich Ihre
Dateien befinden. Der HTML-Editor wird automatisch beim Starten in
Ihr ausgewähltes Projektverzeichnis wechseln. Des Weiteren stehen
Ihnen im Hauptfenster im Dateimanagerteil Knöpfe zur Verfügung, mit
denen Sie zwischen den Dateien wechseln können.
Im Abschnitt Verzeichnisse werden Sie auch das Eingabefeld Homepage
Startseite finden. Hier können Sie die Index-Seite der Homepage angeben.
Im internen HTML-Betrachter wird dann ein Knopf zur Verfügung stehen,
mit dem Sie auf diese oft benötigte Seite wechseln können.
In diesem Abschnitt können Sie bestimmte Standardwerte vorgeben, z.B.
Ihren Namen als Namen des Autors und Ihr Farbschema für neu zu erstellende
Seiten. Des Weiteren können Sie benutzerdefinierte Angaben für den
Head-Bereich der neu zu erstellenden Dateien einfügen.
Hier gibt es eine Menge nützliche Optionen, mit denen Sie das Verhalten
des HTML-Editors anpassen können. Die Optionen dürften selbst erklärend
sein.
Tags bedeutet soviel wie HTML-Befehl. Hier können einige Standardbefehle
den eigenen Wünschen angepasst werden. Den Anfänger dürfte das wenig
interessieren, aber Profis werden dies zu schätzen wissen.
Der HTML-Editor bietet Ihnen die Möglichkeit, 20 HTML-Befehle oder
Textvorlagen selbst zu definieren. Die Befehle erscheinen dann im
Hauptmenü unter dem Punkt Benutzermenü. Im Hauptfenster können Sie
dann die einzelnen definierten Befehle in den Editor einfügen. Dies
können Sie auch über die Shortcuts UMSCH+F1-F10 und UMSCH+STRG+F1-F10
tun.
Hier können Sie Schriftarten auswählen, die Sie in ihrem Projekt benutzen
möchten. Diese Schriftarten erscheinen dann im Hauptmenü unter Schrift->Schriftart.
Wenn Sie Kenntnisse über Style-Sheets besitzen, verwenden Sie lieber
StyleSheets, um die Schriftart in Ihren Dokumenten anzupassen.
Hier können Sie 5 benutzerdefinierte Datumsformate angeben. Des Weitern
können Sie ein Format zum aktualisierten Datum angeben. Dieses wird
im Hauptmenü unter Einfügen->Datum->Automatisch aktualisiertes Datum
eingefügt, und bei jedem Speichern der Datei, in die es eingefügt
ist, aktualisiert.
Sie können mit dem Hauptmenübefehl Projekt->Projekt auswählen->....
zwischen den angelegten Projekten wechseln, und neue Projekte erstellen.
Wenn Sie zwischen den Projekten wechseln, werden automatisch die Einstellungen
angepasst, und im Dateimanager in das Verzeichnis des ausgewählten
Projektes gewechselt. Welches Projekt gerade aktiv ist, sehen Sie
in der Titelleiste oben im Hauptfenster und in der Statusleiste unten
rechts. Mit dem Befehl Projekt->Projekt löschen können Sie Projekte
entfernen.
Die Projekteinstellungen werden, bis auf das Benutzermenü, in der Windows-Registry
gesichert. Der Schlüssel lautet HKEY_CURRENT_USER\software\meybohm\htmledit\.
Sie können mit dem Windows-Registry-Editor (regedit.exe) bearbeitet,
gesichert und auf andere Computer übertragen werden. Die Einstellungen
können Sie in Registry-Dateien (*.reg) sichern.
Sie können auch die Funktion Projekt->Projekt exportieren benutzen,
um einzelne Projekte direkt mit dem HTML-Editor zu exportieren.
Im folgenden werde ich die Benutzung des Editors beschreiben, also
des Eingabefeldes im Hauptfenster rechts, wo das HTML-Dokument editiert
wird.
Die Kapazität des Editors, also die maximale Grösse des zu editierenden
Dokuments ist nur durch Ihren Hauptspeicher und die vorhandenen Systemressourcen
beschränkt. Der Editor besitzt verschiedene Syntaxparser, die die
Darstellung der Quelltexte verschiedener Sprachen (html,sql,perl...)
durch Syntaxhighlighting erheblich verbessert. HTML-Befehle, Parameter
und Text werden durch unterschiedliche Darstellungsfarben voneinander
abgehoben. Reservierte Wörter werden fett dargestellt. Der Editor
erlaubt weiterhin die Darstellung von Zeilennummern, was erheblich
bei der Fehlersuche in Skripten und Quelltexten hilft. In der unteren
Statuszeile werden Statusinformationen des Editors angezeigt, zum
Beispiel Position des Cursors. Sie haben auch die Möglichkeit, bei
grösseren Dokumenten Lesezeichen zu setzen.
Sie können den Eingabecursor mit den Pfeiltasten bewegen, oder mit
der Maus an eine bestimmte Position setzten. Die eingegebenen Zeichen
werden hinter dem Cursor eingefügt. Mit der POS1 Taste springt der
Cursor an den Zeilenanfang, mit ENDE an das Zeilenende. Mit den Bild-Tasten
können Sie seitenweise hoch und runter scrollen. STRG+POS1 springt
an den Dokumentanfang, STRG+ENDE an das Dokumentende.
Markierungen kennen Sie sicher aus anderen Anwendungen. Auf Markierungen
beziehen sich die meisten Befehle (Ausschneiden, Löschen, HTML-Formatierungen...).
Sie können Texte ganz einfach mit der Maus machen, indem Sie mit gedrückter
linker Maustaste einen Bereich auswählen. Alternativ können Sie auch
mit gedrückter Shift (Umschalt) Taste und den in dem letzten Teil
beschriebenen Bewegungstasten einen Bereich markieren. Mit gedrückter
ALT-Taste können Sie auch Bereiche innerhalb des Editors markieren,
die über mehrere Zeilen gehen, aber nicht unbedingt komplette Zeilen
beinhalten sollen. Ich weiss nicht, wie ich das genauer beschreiben
soll, einfach ausprobieren. Wenn Sie einen Textteil markiert haben,
können Sie ihn auch mit der Maus (gedrückte linke Maustaste) per Drag&Drop
in dem Dokument umbewegen.
Es kommt oft vor, dass man Textausschnitte innerhalb eines Dokumentes
oder zwischen zwei verschiedenen Dokumenten umbewegen muss. Hierzu
können Sie die Zwischenablage benutzen. Sie können einen zuvor markierten
Text auschneiden oder kopieren. Der Text liegt dann in der Zwischenablage.
Nun können Sie den Cursor an die Stelle bewegen, an der Sie den Text
in der Ablage einfügen wollen. Sie können auch erst ein anderes Dokument
öffnen und den Text in der Ablage dort einfügen. Über die Zwischenablage
kann auch Text zwischen verschiedenen Programmen ausgetauscht werden.
+-----------------------------+-------------------+-----------------+
|Funktion im Menü Bearbeiten | Tastenkombination | Alternative Tk. |
+-----------------------------+-------------------+-----------------+
+-----------------------------+-------------------+-----------------+
| Ausschneiden | STRG+X | Umsch+Entf |
+-----------------------------+-------------------+-----------------+
| Kopieren | STRG+C | STRG+Einfg |
+-----------------------------+-------------------+-----------------+
| Einfügen | STRG+V | Umsch+Einfg |
+-----------------------------+-------------------+-----------------+
| Löschen | - | Entf |
+-----------------------------+-------------------+-----------------+
Mit der Tabulatortaste (TAB, ganz links mit den 2 Pfeilen in beide
Richtungen) können Sie eine Einrückungsebene weiter springen. Eine
Einrückungsebene entspricht in der Regel 8 Leerzeichen. Es ist gängige
Technik verschachtelte HTML-Konstrukte wie Tabellen und Listen mit
Einrückungen zu strukturieren.
Beispiel:
<table>
<tr>
<td>...</td>
<td>...</td>
</tr>
<tr>
<td>...</td>
<td>...</td>
</tr>
<tr>
.
.
.
</tr>
</table>
Mit TAB wechseln Sie eine Einrückungsebene nach rechts, mit SHIFT+TAB
wechseln Sie eine Ebene nach links zurück. Falls Sie zuvor einen Block
markiert haben, wird der ganze Block ein- bzw. ausgerückt. Sie können
auch mit der Einrückhilfe (Tools) individuelle Einrückungen machen
(z.B. mit Spaces oder dem HTML-Befehl &nspc;).
Es gibt 2 verschiedene Eingabemöglichkeiten, einfügen und überschreiben.
Im Einfügen-Modus (Standardeinstellung) werden beim Tippen die Zeichen
links vom Cursor (Eingabe-Prompt) weiter nach rechts verschoben. Beim
Überschreiben wird das Zeichen rechts vom Cursor mit dem eingegebenen
Zeichen überschrieben. Den Modus können Sie mit der Einfg-Taste auf
der Tastatur wechseln. Der aktuelle Modus wird in der Statuszeile
unten angezeigt.
Um in grösseren Dokumenten die Übersicht zu behalten und die Navigation
zu erleichtern, können Sie Lesezeichen setzen. Es stehen Ihnen 10
Lesezeichen pro geöffnete Dokumente zur Verfügung. Mit STRG+UMSCH+Zahlentaste
können Sie die Lesezeichen setzen. Das Lesezeichen wird in die Zeile
gesetzt, in der sich der Cursor befindet. Mit STRG+Zahlentaste können
Sie mit dem Cursor zu den gesetzten Lesezeichen springen.
Das Suchen nach Textteilen ist eine oft benötigte Funktion. Mit STRG+F
(oder im Hauptmenü Bearbeiten->Suchen) rufen Sie den Suchen Dialog
auf. Geben Sie hier eine Zeichenfolge ein die Sie suchen wollen und
drücken Sie Enter. Mit der F3-Taste springen Sie zum nächsten Suchergebnis,
falls die gesuchte Zeichenfolge mehrfach vorkommt. Mit Alt-F3 können
Sie zum rückwärts suchen.
Es kommt oft vor, dass man Textteile ersetzen will, zum Beispiel Ihre
E-Mailadresse, wenn sie sich geändert hat. Dies können Sie komfortabel
ersetzen, auch wenn sie öfters im Dokument vorkommt. Rufen Sie dazu
den Ersetzen-Dialog mit STRG+R oder über das Hauptmenü (Bearbeiten->Ersetzen)
auf. Sie können entweder interaktiv eins nach dem anderen ersetzen,
oder alles auf einmal.
Der HTML-Editor hilft Ihnen beim Einfügen nahezu aller HTML-Befehle
und Formatierungen. Ich gehe jetzt davon aus, dass Sie sich schon
etwas mit den Grundlagen von HTML vertraut gemacht haben. HTML-Befehle
können Sie entweder über die Hauptmenüpunkte Einfügen, Format und
Schrift oder über die Knöpfe in der unteren Symbolleiste einfügen.
Im Menüteil Einfügen befinden sich Befehle wie Links oder Graphiken
einbinden. Im Bereich Format sind Befehle, die für das Formatieren
und Strukturieren des Textes zuständig sind. Sie können hier Strukturen
wie Überschriften, Paragraphen, Listen und Texttypauszeichnungen erstellen.
Im Menüpunkt Schrift sind Befehle, mit der Sie das Schriftbild verändern
können. Sie können unter anderem Schriftart, Grösse, Farbe und Stil
verändern.
Bei der Arbeit mit Internetseiten werden Sie es mit diversen Dateitypen
zu tun haben. Dateitypen werden anhand der Dateiendung identifiziert,
meistens ein Punkt gefolgt von 3 Zeichen, z.B "index.htm". Hier
nun eine kurze Übersicht über gängige Dateitypen im Bereich HTML:
+-----------------+------------------------------------------------+
| Typ | Beschreibung |
+-----------------+------------------------------------------------+
+-----------------+------------------------------------------------+
| html, htm | Normale HTML-Dokumente |
+-----------------+------------------------------------------------+
| gif | Graphiken im Grafic Interchange Format |
+-----------------+------------------------------------------------+
| jpeg, jpg | Graphiken im Joint Picture Expert Group Format |
+-----------------+------------------------------------------------+
| png | Graphiken im Portable Network Graphics Format |
+-----------------+------------------------------------------------+
| css | Cascaded Style Sheet Dateien |
+-----------------+------------------------------------------------+
| class, jar | Java-Applet Dateien |
+-----------------+------------------------------------------------+
| js, pl, vb | Skriptdateien |
+-----------------+------------------------------------------------+
| shtml,sht | HTML-Dateien mit Server-Side Includes |
+-----------------+------------------------------------------------+
| asp | MS Active Server Seiten |
+-----------------+------------------------------------------------+
|zip, tar.gz, rar | Dateiarchive für Downloads |
+-----------------+------------------------------------------------+
| inc | HTML-Editor Includedateien |
+-----------------+------------------------------------------------+
Wenn Sie nur ein kleines privates HTML-Projekt machen wollen, werden
Sie es wahrscheinlich nur mit wenigen der oben genannten Dateitypen
zu tun haben. Wichtig sind die html-Dateien, die die eigentlichen
HTML-Daten enthalten. Weiterhin wichtig sind die beiden Graphikformate
gif, png und jpeg, mit denen Sie Grafiken in HTML realisieren können.
Eventuell benötigen Sie noch Zip-Dateien, wenn Sie Dateien zum Download
anbieten wollen.
HTML-Dateien enthalten die eigentlichen Seiteninformationen, also die
HTML-Auszeichnungen und den Text Ihrer Seiten. Wie man HTML-Seiten
erstellt und speichert habe ich schon im Abschnit "Erste Schritte"
kurz beschrieben. HTML-Dateien können zusätzlich auch mit einem Linksklick
auf die entsprechende Datei aus dem Dateimanager links im Hauptfenster
des Programmes geöffnet werden. Sie können gleichzeitig mehrere Dateien
öffnen und bearbeiten. Dateien können Sie wieder schliessen, indem
Sie mit der rechten Maustaste auf den Dateinamen in der Liste über
dem Editorfenster drücken oder im Hauptmenü unter Datei->Schliessen.
Die ganzen anderen Dateioperationen finden Sie ebenfalls im Hauptmenü
unter Datei.
Der HTML-Editor besitzt auch einen eingebauten Dateimanager, der sich
im Hauptfenster des Programms auf der linken Seite befindet. Die Benutzung
des Dateimanagers wird hier für die einzelnen Dateitypen einzeln beschrieben.
HTML-Dateien werden im HTML-Editor im Quelltext bearbeitet, das heisst,
Sie sehen beim Bearbeiten nicht die fertige HTML-Seite, wie Sie im
Browser aussieht, sondern Sie sehen die Seite direkt als Textdatei,
mit allen HTML-Befehlen in Quelltextform. Nun will man natürlich nicht
die ganze Zeit "blind" drauf los programmieren, sondern zwischendurch
schon mal einen Blick auf das Ergebnis werfen. Falls Sie den Microsoft
Internet Explorer 4.0 oder höher installiert haben (dringend empfohlen!),
dann bietet der HTML-Editor Ihnen die Möglichkeit, die Vorschau direkt
im HTML-Editor-internen Browser (für Experten: MS-Explorer als Active-X
Control eingebettet) das Dokument anzusehen. Drücken Sie dazu einfach
F9 und das Programm wechselt in den Browsermodus. Sie können auch
über den Knopf in der oberen Symbolleiste ganz rechts die Vorschau
starten. Der HTML-Editor-interne Browser ist einem normalen Browser
sehr ähnlich. Es gibt vor- und zurück-Buttons, und ein Button für
die Startseite, die Sie in den Projekteinstellungen definieren können.
Falls Sie noch nicht den MS Internet-Explorer installiert haben, rate
ich Ihnen das zu tun, wenn Sie mit dem HTML-Editor arbeiten möchten.
Die interne Vorschau ist sehr komfortabel und steigert die Produktivität
ungemein, indem sie Arbeitsabläufe abkürzt. Ich habe mit vielen Nutzern
gesprochen, nachdem sie einmal mit der internen Vorschau gearbeitet
haben, wollten sie darauf nicht mehr verzichten. Sie können den MS
Explorer auch installieren, wenn Sie auch sonst mit Netscape arbeiten.
Ich benutze zum surfen im Internet und zum Mail- und Newsschreiben
den Netscape Communicator. Trotzdem habe ich den MS Explorer nebenbei
installiert. Er ist kostenlos und auf vielen Free- und Shareware-CDs
erhältlich. Er ist leider im Moment der einzige Browser der eine Einbettung
in andere Programme (wie den HTML-Editor) erlaubt. Deswegen gibt es
keine Alternative im Moment. Wer interne Vorschau haben will, muss
den Microsoft Explorer installieren.
Wer aus welchen Gründen auch immer den Microsoft-Explorer nicht installieren
will, muss seine Seiten mit der Windows-Standardanwendung oder mit
2 benutzerdefinierten Browsern seiner Wahl betrachten. Die benutzerdefinierten
Browser kann man in den Programmeinstellungen angeben. Gestartet wird
die Vorschau in diesem Fall über den Knopf in der oberen Symbolleiste
ganz rechts und dem dazugehörigen Pop-Up-menü. Das ist dann halt etwas
umständlicher, weil immer ein neues Fenster geöffnet werden muss.
Noch ein paar Worte zu Microsoft-Gegnern, die aus irgendwelchen rationalen
oder irrationalen Gründen keine Microsoft-Software installieren wollen
(aber trotzdem irrationalerweise noch mit Microsoft (!) Windows arbeiten).
Warum arbeitet Sie noch auf einem Microsoft-Betriebssystem? Wenn Sie
Microsoft und seine Methoden ablehnen, was durchaus nachvollziehbar
ist, sollten Sie überlegen, ob Sie nicht auf ein anderes Betriebssystem
umsteigen sollten! Entweder oder. Wer Microsoft ablehnt, sollte auch
kein Windows benutzten. Auf jeden Fall will ich keine Meckereien hören,
dass die interne Vorschau nur mit Microsoft-Software funktioniert.
Meiner Meinung ist Microsoft nicht schlechter als andere Grosskonzerne
auch. Wer diese Konzerne ablehnt, sollte das freie Betriebssystem
Linux verwenden und mir nicht mit Anti-Microsoft Gejammer auf die
Nerven gehen. Tut mir leid, wenn ich das hier etwas hart sage, aber
ich habe die ständigen Kommentare zu dem Thema satt.
Es gibt eine Reihe von HTML-Sonderformaten, die meistens mit speziellen
Internet-Servern eingesetzt werden. SHTML Dateien werden z.B. für
sogenanntes Serverside Including eingesetzt. ASP Dateien werden auf
einem speziellen Microsoft Active Server ausgeführt, und erhalten
in den HTML-Dokumenten eingebetteten Programmcode. Diese Formate werden
in der Regel nur von Profis verwendet, weswegen ich hier auch nicht
näher darauf eingehen werde. Wenn Sie das Thema interessiert besorgen
Sie sich dazu Informationen aus dem Internet (Stichwort ASP, SHTML,
Server Side Include, Microsoft Active Server Pages , PH3).
Graphikdateien für HTML-Seiten sollten im GIF,JPG oder PNG Format vorliegen.
Graphiken können Sie mit allen gängigen Bildbearbeitungsprogrammen
(Paint Shop Pro, Photoshop, Photo Paint, Gimp...) erstellen und dann
in Ihre Internetseiten einbinden. Graphiken werden mit dem HTML-Befehl
<img src="dateiname.xxx"> eingefügt, wobei zwischen den Anführungszeichen
der Dateiname steht. Der HTML-Editor bietet Ihnen auch die Möglichkeit,
die Bilder über einen Linksklick auf die Graphikdatei im Dateimanager
links in Ihr Dokument einzufügen.
Wenn Sie mehr über Graphikdateien lernen möchten, können Sie genauere
Informationen in SelfHTML oder in anderen Internetquellen nachlesen.
Der HTML-Editor besitzt weiterhin einen Bildbetrachter, mit dem Sie
Dateien im GIF und JPG betrachten können. Klicken Sie dazu auf Ansicht->Bildbetrachter
im Hauptmenü (Tast.: F8) oder über dem Dateimanager links oben, wenn
Sie auf "Bildbetr." klicken. Sie können mit der Maus oder mit den
Pfeiltasten auf der Tastatur zwischen den Bildern wechseln. Sie können
mit F7 wieder zum Editor zurückwechseln.
Die Style-Sheet Technik ist eine relativ neue Technik. Sie vereinfacht
das Erstellen von HTML-Seiten erheblich. Das Thema ist umfangreich,
und ich kann hier nur kurz darauf eingehen. Falls Sie sich noch nicht
mit Style-Sheets befasst haben, sollten Sie vorher einige Dinge darüber
lernen. Dazu bietet sich z.B. auch wieder die Online-Dokumentation
SelfHTML an. Sie sollten auf jeden Fall die theoretischen Grundlagen
verstanden haben, bevor Sie versuchen CSS einzusetzen.
Style Sheets sind grob gesagt Stilvorlagen, in denen Sie Formatierungsvorlagen
definieren können. Diese können Sie dann mit Ihren Dokumenten verlinken,
so dass diese Formatvorlagen zur Darstellung verwenden. Das verschafft
Ihnen ein einheitliches Layout und die Wartung und Änderung der Dokumente
was das Layout angeht wird deutlich vereinfacht. CSS-Dateien sind
Textdateien, die Stildefinitionen enthalten. Die Dateiendung ist css.
Zuerst müssen Sie Stylesheets definieren. Legen Sie dazu eine Textdatei
mit der Dateiendung css an. Darin schreiben Sie die Stilinformationen.
Die Dateien sollten Sie in ihr zuvor in den Projekteinstellungen angegebenes
Style-Sheet-Verzeichnis kopieren. Wenn Sie nun eine neue Datei erstellen
wollen (Hauptmenü: Datei->Neu), dann erscheinen die vorhandenen Style-Sheets
in der unteren Style-Sheet-Liste. Wenn Sie nun einen Style auswählen,
dann wird dieser mit der neuen Datei verknüpft. Im HTML-Code sieht
das konkret so aus, das dort ein <link ...>-Befehl mit dem Style-Dateinamen
eingefügt wird. Diesen Link können Sie auch manuell einfügen, indem
Sie im Dateimanager links im Hauptfenster auf eine CSS-Datei linksklicken.
Wenn Sie eine oder mehrere Dateien zum Download anbieten wollen, haben
sich dazu bestimmt Dateiarchivformate durchgesetzt, die mehrer Dateien
in eine Archivdatei packen, und die Dateigrösse durch Kompression
verringern. Es haben sich dabei zwei Formate durchgesetzt: ZIP (Windows,Unix)
und TAR.GZ (Unix).
Es gibt eine Reihe Freeware-Programme, die Ihnen beim Erstellen dieser
Archive behilflich sind. Unter Windows gibt es die Freewareprogramme
Easy Zip 2000 und EnZip. Unter Unix steht Ihnen gzip und tar zur Verfügung,
sowie Programme wie KZip und der Midnightcommander. Wie Sie Archivdateien
erstellen, packen und entpacken lesen Sie am besten in den Dokumentationen
der Archivprogramme nach.
Im HTML-Editor können Sie Verknüpfungen mit den Archiven erstellen,
indem Sie im Dateimanager auf das entsprechende Archiv klicken.
Skripte und Applets sind eine Sache für Leute, die sich mit dem Thema
HTML und Programmieren gut auskennen. Denen brauche ich hier nicht
zu erklären, wie die Sachen funktionieren, denn sie wissen das besser
als ich. Anfängern rate ich dringend ab, Skripte und Applets zu verwenden,
wenn Sie nicht dem INHALT dienen. Viele unprofessionell eingesetzte
Skripte und Applets gehen mir persönlich jedenfalls nur auf die Nerven,
ohne dass sie irgendeinen Nutzen hätten. Nähere Informationen zu dem
umfangreichen Thema finden Sie bei Sun (Stichwort Java) und bei SelfHTML
(Stichwort Javascript, Perl, CGI).
Der programminterne Dateimanager befindet sich links im Hauptfenster
des Programms. Er ähnelt dem Dateimanager von Windows. In der oberen
Hälfte sieht man die Laufwerke und Pfade, und unten die Dateien des
ausgewählten Pfads. Der Dateimanager ist eines der wichtigsten Hilfsmittel
im HTML-Editor. Mit ihm können sie z.B. Dateien öffnen, löschen oder
Links erstellen.
Über dem Dateimanger befinden sich Knöpfe, mit denen sie zwischen den
Standardverzeichnissen für Homepagedaten, Grafiken, Style-Sheets,
Include-Dateien und Vorlagen wechseln können. Die Standard-Verzeichnisse
können sie wie oben beschrieben in den Projekteinstellungen definieren.
Sie können die Standard-Verzeichnisse aber auch im Dateimanager direkt
angeben. Wählen sie dazu ein Verzeichnis, dass sie zu einem Standard-Verzeichnis
machen wollen und klicken sie mit gedrückter STRG-Taste den entsprechenden
Button.
Neben den Verzeichnisknöpfen befindet sich noch ein Knopf zum suchen
von Dateien und zum öffnen des aktuellen Verzeichnisses im Windowsdateimanager.
Wenn sie mit der rechten Maustaste im Dateimanager auf eine Datei oder
einen Pfad drücken, dann erscheint ein Menü mit allen Befehlen, die
Ihnen für die Datei bzw. das Verzeichnis zur Verfügung stehen. Die
Befehle dürften selbsterklärend sein.
Wenn sie in der Dateiliste des Dateimanagers mit der linken Maustaste
auf eine Datei klicken, wird je nach Dateityp eine bestimmte Aktion
ausgeführt.
+--------------+--------------------------------------------------------+
| Dateityp | Aktion |
+--------------+--------------------------------------------------------+
+--------------+--------------------------------------------------------+
| HTML | Öffnen der Datei in den Editor |
+--------------+--------------------------------------------------------+
| Grafik | Einfügen des <img...> Befehls mit dem Grafikdateinamen |
+--------------+--------------------------------------------------------+
| TXT/Vorlage | Einfügen des Vorlagetextes in die aktuelle Datei |
+--------------+--------------------------------------------------------+
| CSS | Einfügen des <link...> Befehls in den Editor |
+--------------+--------------------------------------------------------+
| Archiv | Downloadlink zum Dateiarchiv (zip,rar,arj...) |
+--------------+--------------------------------------------------------+
| Include | Einfügen der Includedatei in die geöffnete HTML-Datei |
+--------------+--------------------------------------------------------+
|Favoriten/URL | Einfügen des Links |
+--------------+--------------------------------------------------------+
| Andere | Öffnen der Datei in den Editor |
+--------------+--------------------------------------------------------+
Sie können alternativ zum Linksklick die Datei auch per Drag&Drop in
das Editorfenster ziehen. Einziger unterschied zum Linksklick ist,
das HTML-Dateien dann nicht geöffnet werden, sondern dass an der Stelle
wo die Datei fallengelassen wird, ein Link zu der Datei eingefügt
wird. Sie können auch Verzeichnisse per Drag&Drop in das Editorfeld
ziehen, wobei ebenfalls ein Link eingefügt wird.
Sie können einen Dateifilter wählen, um in der Dateiliste nur Dateien
eines bestimmten Typs anzeigen zu lassen. Klicken sie dazu mit der
rechten Maustaste in die Dateiliste und wählen Sie unter Filter einen
Filtertyp ihrer Wahl. Es gibt die Filter Webdatei, HTML-Dateien, Grafiken
und Benutzerdefiniert. Die Filter können Sie in den Programmeinstellungen
beliebig Ihren bedürfnissen Anpassen.
Der HTML-Editor bietet Ihnen eine Reihe von nützlichen Werkzeugen und
Assistenten an, die Ihnen beim Aufbau Ihrer Seiten behilflich sind.
Die Assistenten können Sie über das Menü Tools im Hauptmenü aufrufen.
Die dort vorhandenen Tools (deut.: Werkzeuge) werden nun kurz beschrieben.
Hatten Sie auch schon das Problem, dass sich zum Beispiel Ihre E-Mailadresse
geändert hat, und Sie in allen Ihren Dateien per Hand die Adresse
ändern mussten. Dies kann bei umfangreichen Projekten schnell zum
Problem werden. Dafür gibt es aber jetzt Abhilfe. Wählen Sie einfach
die Dateien aus, in denen Sie ersetzen wollen, geben Sie den zu ersetzenden
Text an und fertig. So einfach kann das gehen.
Sie können nach Suchbegriffen (auch mehrzeiligen) in einer benutzerdefinieten
Dateiliste suchen. Geben sie dazu den Suchtext ein, und drücken sie
auf Dateien wählen. Wählen sie im nun folgenden Dialog die Dateien,
in denen sie nach dem Suchbegriff suchen wollen. Anschliessend können
sie die Suche starten. Es wird eine neue Liste aufgeführt, mit den
Dateien, die den Suchbegriff enthalten. Mit einem Doppelklick auf
einen Dateinamen können sie die entsprechende Datei öffnen. Der Cursor
im Editor befindet sich automatisch beim Suchbegriff. Wenn sie im
Editor F3 drücken, können sie zu dem nächsten Vorkommen des Suchbegriffs
wechseln.
Der Debugger (deut.: Fehlersucher) sucht nach Fehlern in Ihrem HTML-Quelltext.
Er berichtet über Links, die ins Leere gehen, über nicht abgeschlossene
Befehle, und über fehlerhafte Befehlsnamen.
Der Fussnotenassistent ermöglicht Ihnen das einfache Einfügen von Fussnoten
und Verweisen. Fussnoten werden meist in wissenschaftlichen Aufsätzen
verwendet. In ihnen kann man Sachen näher erläutern, die man nicht
unbedingt direkt in seinem Aufsatz erwähnen will, weil das entweder
den Lesefluss stören würde oder weil etwa die Information nicht so
relevant ist oder nur weiterführen soll. Oft werden Fussnoten auch
zu Quellenangaben oder Verweisen auf andere Texte benutzt. Häufig
werden dort auch Fremdwörter übersetzt und erläutert. Die Anwendung
von Fussnoten ist also vielfältig. Fussnoten werden durchnummeriert.
Die Verweise im Text auf Fussnoten sind Kästchen mit einer Nummer
drin ( [1] ). Fussnoten stehen am Ende des Textes und beginnen ebenfalls
mit dem Kästchen, gefolgt von der Erläuterung, also der eigentlichen
Fussnote ( [1] Fussnotentext hier ... ).
Geben Sie einen Fussnotentext ein und gehen Sie mit dem Cursor im Editorfenster
an die Stelle, wo die Fussnote eingefügt werden soll. Normalerweise
ist das am Ende des Dokumentes. Drücken Sie dann auf Fussnote einfügen.
Nachdem Sie die Fussnote eingegeben haben, gehen Sie mit dem Cursor
an die Position, wo Sie den Verweis auf die Fussnote einfügen wollen.
Das ist meist direkt die Stelle hinter dem zu erläuterndem Wort oder
Satz. Klicken Sie dann auf Verweis einfügen.
Sie können in den Projekteinstellungen die Fussnotenformatierung ihren
eigenen Bedürfnissen anpassen, wenn Sie das wollen. Die Standardformatierung
ist [ 1 ]. Sie können zum Beispiel auch die Leerzeichen weglassen,
wie das oft gefordert wird ([1]) oder die Zahl als hochgestellte kleine
Zahl angeben (²). Die Formatierungen können Sie in den Projekteinstellungen
anpassen, in dem sie das Aussehen der Zahl mit HTML-Befehlen verändern.
Der HTML-Konstruktor ist ein Hilfsmittel, um diverse HTML-Konstrukte
zu erstellen. Er hilft Ihnen beim Erstellen von Frames (<frame>),
Listen (<ol>,<ul>), Definitionslisten (<dl>) Dateilisten und horizontalen
Leisten. Lesen Sie eventuell in einer HTML-Dokumentation z.B. unter
SelfHTML genauer nach, was Frames, Listen und Definitionslisten sind.
Ich werde hier nicht genauer darauf eingehen. Dateilisten ist eine
Liste von Dateienamen aus einem bestimmten Verzeichnis, eventuell
mit relativem Pfad und/oder mit Link.
Mit dem Schlüsselwörter-Tagging können Sie in ihrem Dokument Listen
von Schlüsselwörtern mit einem Tag (HTML-Befehl) versehen. Sie können
Schlüsselwörterlisten auch aus Dateien laden und in Dateien speichern.
Mögliches Anwendungsgebiet ist z.B. das Formatieren von Quelltexten.
Angenommen Sie wollen einen Pascal-Quelltext hübsch formatieren, ähnlich
wie es Entwicklungsumgebungen tun. Es sollen alle reservierten Wörter
der Programmiersprache fett dargestellt werden. Angenommen Sie haben
eine Pascalprozedur in einem <PRE>-Bereich:
<pre>
Program Hello;
uses crt;
begin
writeln('Hello World!');
end.
</pre>
Wenn Sie nun die Schlüsselwortliste von Pascal laden, und als Tag <b>,</b>
für fett angeben, dann sieht Ihr Quelltext danach so aus:
<pre>
<b>Program<b> Hello;
<b>uses</b> crt;
<b>begin</b>
writeln('Hello World!');
<b>end</b>.
</pre>
Damit sieht der Quelltext in HTML so ähnlich aus, wie in der Entwicklungsumgebung
in der Sie arbeiten. Dies ist natürlich nur ein Beispiel für die Anwendung.
Ihren Phantasien sind natürlich keine Grenzen gesetzt.
Der Tabellenassistent hilft Ihnen beim Erstellen von Tabellen. Das
Werkzeug dürfte selbst erklärend sein.
Die Zeilenweise Ergänzung hilft Ihnen bei einem Arbeitsschritt, der
normalerweise viel Zeit und Mühe beansprucht: Das zeilenweise Ergänzen
von Textpassagen mit ein und dem selben Ergänzungstext. Sie markieren
einfach einen Textteil im HTML-Editor, in dem Sie zeilenweise ein
bestimmtes Textstück ergänzen wollen. Tragen Sie nun den Ergänzungstext
ein.
Eine Beispiel: Sie tippen 10 Listenpunkte ein, und wollen daraus eine
HTML-Liste machen. Wenn diese Funktion nicht schon im HTML-Editor
implementiert wäre, könnten Sie zum Beispiel wie folgt vorgehen. Sie
tippen die 10 Listenpunkte ein, und geben als Ergänzung <li> und </li>
an, dann erhalten Sie folgendes Ergebnis:
Vorher: Nachher:
Kaffee <li>Kaffee</li>
Tee <li>Tee</li>
Cola <li>Cola</li>
Bier <li>Bier</li>
Apfelwein <li>Apfelwein</li>
Wasser <li>Wasser</li>
Fanta <li>Fanta</li>
Saft <li>Saft</li>
Schnaps <li>Schnaps</li>
Sekt <li>Sekt</li>
Es gibt natürlich noch viele andere Anwendungsbeispiele. Hier ist auch
wieder, wie beim Schlüsselwörter-Tagging, Ihre Phantasie gefragt.
Der HTML-Editor bietet Ihnen und allen Benutzern, das Programm mit
eigenen Erweiterungen (ähnlich der eingebauten Werkzeuge) zu versehen.
Sie können, wenn Sie eine Programmiersprache beherrschen, selbst Plugins
schreiben, die Ihnen häufig benötigte Arbeitsabläufe abnehmen. Sie
können auch Funktionen schreiben, die noch nicht im HTML-Editor eingebaut
sind, und diese dann z.B. verkaufen oder als Freeware bereitstellen
. Auch wenn Sie nicht programmieren können, sollten Sie trotzdem weiterlesen.
Es gibt mittlerweile eine Reihe guter kostenloser Freewareplugins,
die von verschiedenen Leuten aus ganz Deutschland geschrieben wurden,
und kostenlos zur Verfügung gestellt werden. Die Plugins können im
Internet auf meiner Homepage runtergeladen werden.
Plugins sind dynamische ladbare Programmbibliotheken. Hört sich erstmal
kompliziert an, ist es aber nicht. Das HTML-Editor Programm heisst
htmledit.exe. In ihr ist das Grundprogramm des HTML-Editors enthalten.
Zusätzliche Funktionen können in das Programm eingebunden werden,
wenn die Funktionen in DLL-Dateien (*.dll) enthalten sind. Diese müssen
Sie lediglich in das Pluginverzeichnis Ihrer HTML-Editor Installation
(c:\programme\htmledit\plugins o.ä.) kopieren. Die Dateienendung der
Plugins ist dll. Das Pluginverzeichnis können Sie auch in den Programmeinstellungen
wechseln, wenn Sie das wünschen.
Es sind im Internet schon einige Plugins erhältlich, darunter Assistenten
zum Erstellen von Laufschriften, Farbschemen und zum Formatieren und
Überprüfen des HTML-Codes und noch viele mehr.
Wenn sie Plugins installiert haben, werden diese nach dem nächsten
Neustart des Programms im Hauptmenü unter Tools angezeigt.
Das Programmieren von Plugins ist nicht ganz einfach, eine genaue Beschreibung
würde den Rahmen dieses Handbuchs sprengen. Eine genauere Anleitung
inklusive Schnittstellenbeschreibung finden Sie auf der HTML-Editor
Homepage unter Plugins. Falls Sie Borland Delphi oder C++ beherrschen,
können Sie sich Ihre eigenen Funktionen einbauen.
Neben Plugins in Form von DLLs können sie auch in Ihrem Pluginverzeichnis
Verknüpfungen mit Windowsprogrammen oder Batchdateien erstellen. Diese
werden beim nächsten Start des Editors automatisch in das Pluginmenü
eingebunden. Die Verknüpfungen und Batchdateien werden mit dem Dateinamen
der aktuell geöffneten Datei gestartet.
Sie können so zum Beispiel die aktuell geöffnete Datei in verschiedenen
Browsern betrachten, wenn sie in Ihrem Pluginmenü eine Verknüpfung
zu der Programmdatei der Browser erstellen. Es gibt hunderte von anderen
Anwendungsmöglichkeiten, es liegt an Ihnen und an Ihrer Phantasie,
ob und wie sie diese Möglichkeit nutzen wollen
Die Offline-Includetechnik ist im Bereich HTML eine sehr neue Technik,
die meines Wissens bis jetzt nur im HTML-Editor Phase 5 implementiert
ist (Stand: August 1999). Falls Sie schon Programmierkenntnisse besitzen,
wird Ihnen die Sache sicher gleich vertraut vorkommen, aber auch wenn
Ihnen das jetzt noch gar nichts sagt, sollten Sie sich mit der Includetechnik
beschäftigen, denn sie erleichtert Ihnen, speziell bei grossen Projekten
die Arbeit ungemein. Ich spreche aus Erfahrung. Bei meiner eigenen
Seite benutze ich diese Technik schon eine ganze Zeit, und es spart
wirklich eine Menge Arbeit.
"Include" ist wieder so ein Englisches Modewort denken Sie jetzt
sicher. Kann sein, aber mir fällt ausser "Einschliessungen" oder
"Einbeziehungen" keine sinnvolle Übersetzung ein. Ich werde es Ihnen
an einem Beispiel erklären. Schauen Sie sich z.B. meine Homepage an,
auf jeder Seite ist eine Titelzeile mit dem Text "Ulli Meybohms Site"
und einer horizontalen Leiste. Diese Titelleiste wäre jetzt in über
50 Seiten fest verankert. Stellen Sie sich nun vor, ich wollte das
Design des Titels umstellen, dann müsste ich ja in allen 50 Dateien
die Änderungen vornehmen. Das wäre eine Menge Arbeit. Ich hab das
so gelöst: Ich habe den Titel in einer separaten Include-Datei gespeichert.
Eine Includedatei ist einfach eine Textdatei mit HTML-Quelltext drin.
Die Dateiendung muss .inc sein. Ich habe nun eine Verknüpfung mit
der Include-Datei in alle meine Dokumente eingefügt (Einfügen->Includedatei).
Das sieht dann dateitechnisch wie folgt aus:
Includedatei titel.inc im Includeverzeichnis:
<b>Ulli Meybohms <font color='#FF0000'>Site</font></b>
<hr noshade size=1>
In meinen HTML-Dateien sieht das dann wie folgt aus:
<html>
<head>
...
</head>
<body....>
<!--include:titel.inc-->
<b>Ulli Meybohms <font color='#FF0000'>Site</font></b>
<hr noshade size=1>
<!--/include:titel.inc-->
...
</body>
</html>
Wenn ich jetzt in allen meinen Dateien den Titel ändern wollte, dann
müsste ich lediglich in der Include-Datei titel.inc die Änderungen
vornehmen, und die Includebereiche in allen Dateien mit dem Hauptmenü-Befehl
Projekt->Includes aktualisieren auf den neuesten Stand bringen. Das
ist natürlich zugegebenermassen ein triviales Beispiel, aber Ihrer
Phantasie sind keine Grenzen gesetzt. Es empfiehlt sich alle grösseren
Dokumentteile, die mehr als einmal vorkommen, als Includes zu realisieren.
Das spart eine Menge Arbeit. Schauen Sie sich einfach mal meine Homepage
im Quelltext an, ich habe starken Gebrauch von Includes gemacht.
Das Includeverzeichnis müssen Sie unbedingt einstellen, um die Includetechnik
zu nutzen. Wählen Sie dazu in den Projekteinstellungen ein Verzeichnis
Ihrer Wahl. Die Includedateien müssen die Dateiendung .inc besitzen,
und im Includeverzeichnis abgelegt werden.
Alternativ können Sie das Includeverzeichnis auch folgendermassen auswählen:
Gehen Sie im Dateimanager links im Hauptfenster in ihr Includeverzeichnis
und drücken Sie mit gehaltener STRG-Taste den Includeknopf über dem
Dateimanager.
Wenn Sie erstmal eine Includedatei erstellt haben, können Sie diese
auf zwei Arten einfügen, entweder über das Hauptmenü mit Einfügen->Includedatei
oder über den Dateimanager links mit einem Klick auf die entsprechende
Includedatei.
Die Programmeinstellungen sind etwas für fortgeschrittene Benutzer.
Falls Sie nicht alles auf Anhieb verstehen, machen Sie sich keine
Gedanken. Das Programm ist für die meisten Fälle gut vorkonfiguriert.
Die Programmeinstellungen können Sie unter Ansicht->Programmeinstellungen
aufrufen. Hier können Sie globale, projektübergreifende Einstellungen
vornehmen. Es erscheint ein Dialogfenster, das in folgende Abschnitte
unterteilt ist:
Hier können Sie Zusatzbrowser für die Vorschau angeben, und eine HTML-Dokumentation
auswählen, die an den HTML-Editor angebunden werden kann. Professionelle
Webdesigner überprüfen ihre Seiten gerne mit verschiedenen Browsern,
bevor sie ihre Seiten ins Netz stellen. Man sollte mindestens seine
Seiten mit den aktuellen Browsern von Microsoft und Netscape testen.
Vorzugsweise auch mit Opera oder älteren Netscape-Varianten.
Die Dateiliste im Hauptfenster rechts kann mit diversen Dateitypenfiltern
arbeiten. Unterschieden wird dabei zwischen WWW, HTML und benutzerdefiniertem
Filter, die Sie hier einstellen können. Diese Dateitypen werden angezeigt,
wenn Sie im Dateimanager links im Hauptfenster die entsprechenden
Filter aktivieren.
Der HTML-Editor hat Parser für das Syntaxhighlighting (Einfärben des
Quelltextes im Editor) für mehrere Sprachen zur Verfügung, darunter
HTML, Perl, C ,Pascal, Sql und viele mehr. Der HTML-Editor erkennt
an den Dateiendungen, um welchen Dateityp es sich handelt. Die gängigen
Dateiendungen sind voreingestellt. Falls Sie aussergewöhnliche Dateiendungen
für Ihre Dateien verwenden, können Sie die Endungen hier manuell eintragen.
Hier können Sie einige Standardeinstellungen ändern. Das Plugin- und
das Keyword-Verzeichnis kann gewechselt werden, und es kann die Programmhilfedatei
gewählt werden.
Windows bietet die Möglichkeit, zu beliebigen Dateien Verknüpfungen
zu erstellen. Sie haben die Möglichkeit, Verknüpfungen zu dem HTML-Editor
auf ihrem Windows-Desktop oder im Startmenü zu erstellen. Eine weitere
sehr empfehlenswerte Sache ist die Verknüpfung im Senden an Verzeichnis.
Damit können Sie aus dem Windows-Dateimanager beliebige Textdateien
über das Senden an Menü mit dem HTML-Editor öffnen.
Sie kennen sicher das Popupmenü im Windowsdateimanager. Das Menü, das
erscheint, wenn Sie im Windowsdateimanager mit der rechten Maustaste
auf eine Datei drücken. Dort erscheinen normalerweise solche Einträge:
Öffnen
Drucken
Bearbeiten
-
Ausschneiden
Einfügen
(...)
Sie haben nun die Möglichkeit, hier einen Eintrag Bearbeiten mit HTML-Editor
einzufügen. Sie können damit dann bequem beliebige Dateien aus dem
Windowsdateimanager in den Editor öffnen. Die Dateiendungen, bei denen
der Eintrag gemacht werden soll, können Sie frei auswählen.
In der Symbolleiste des Hauptprogrammes befindet sich unter "COLORS"
die Farbpalette. Es sind 3 Farbpaletten vordefiniert, einmal die HTML-Editor-Standardfarbpalette,
dann eine Farbpalette bei der die Farben nicht als Hexadezimalwerte
sondern als Farbnamen angegeben sind. Sie können auch eigene Farbpaletten
erstellen, wenn sie das wollen. Diese müssen als Bitmapdateien der
Grösse 450x30 im Verzeichnis "htmledit\config\pal\" liegen. Als Beispiel
habe ich dort die Datei userpal.bmp abgelegt, die die 216 Standardfarben
der 8-bit Farbpalette beinhaltet. Sie können in diesem Verzeichnis
beliebig viele eigene Farbpaletten definieren, in dem sie dort die
Bitmapdateien mit der Farbpalette hineinkopieren. Sie können die Paletten-Bilder
mit jedem beliebigen Bildbearbeitungsprogramm erstellen. Die Paletten
werden dannnach dem nächsten Start des HTML-Editors verfügbar. Desweiteren
können Sie auch noch zu jedem Projekt 16 benutzerdefinerte Farben
erstellen, indem Sie neben der Farbpalette auf den Farbauswahlknopf
drücken, und benutzerdefinierte Farben hinzufügen.
Sie können mit einem Rechtsklick mit der Maus auf den Karteireiter
mit dem Dateinamen der zu schliessenden Datei klicken, um diese zu
schliessen. Die Karteireiter der geöffneten Dateien befinden sich
über dem Editorfeld.
Man kann Dateien in den Editor laden, indem man die entsprechende Datei
aus dem Windowsdateimanager per Drag&Drop in das HTML-Editor Hauptfenster
zieht.
Wenn sie mehr über HTML, Webdesign und das Internet lernen wollen habe
ich auf meiner HTML-Editor Homepage unter "Anleitung" eine Linksammlung
zu nützlichen Quellen erstellt.