Dateien

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
php, php4, php5	php-Skripte, serverbasiert
jpg, jpeg, png	Bilder und Fotos
gif	Grafiken im GIF-Format
inc	Include-Dateien
css	Cascaded Style Sheet Dateien
class, jar	Java-Applet Dateien
js, pl, vb	Skriptdateien
zip, rar, tar, gz	komprimierte Dateiarchive
asp	Micosoft Active Server Seiten

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).

Grafikdateien für HTML-Seiten sollten im GIF,JPG oder PNG Format vorliegen. Grafiken 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.

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 Formatierungsvorlagen für Ihre Dokumente um die Darstellung von Text und HTML-Elementen zentral zu beeinflussen (z.b. die Farbe von HTML-Links). Dies erlaubt auch ein einheitliches Layout für Ihre Webseiten. Sie können Style Sheets innerhalb eines Dokuments oder - um es in anderen Dokumenten wiederzuverwerten - in CSS-Dateien definieren. CSS-Dateien sind Textdateien, die Stildefinitionen enthalten.

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).