Erstellen von Web-Seiten für das Internet

Werkzeuge für Web-Seiten

Immer mehr Programme bieten die Möglichkeit, einen beliebigen Text als Web-Seite abzuspeichern. Am besten gelingt dies momentan nach meiner Meinung mit StarOffice 4.0, das der Hessische Kultusminister für alle Schulen angeschafft hat. Microsoft Word 95 liest und schreibt Web-Seiten erst nach Installation eines kostenlosen Zusatzprogrammes, Word 97 hat diese Funktionen bereits integriert, Netscape Gold liefert bei weniger Komfort die besten Resultate und ist für private Nutzung kostenlos. Mit diesen beispielhaft genannten Produkten ist jeder, der schon Textverarbeitung betreibt, ohne großes Einarbeiten in der Lage, Web-Seiten zu erstellen.

Leider schafft es nach unseren Erfahrungen noch keines dieser Programme, Web-Seiten zu erstellen, deren Verknüpfungen auch auf einem anderen Computer funktionieren. Für die Veröffentlichung oder für die Weitergabe der erstellten Seiten ist also immer noch Hintergrundwissen erforderlich, um am Ende korrigierend eingreifen zu können.
Dabei genügt es oft, in dem Chaos unbekannter Symbole das Bekannte zu suchen und zu korrigieren. - Also ganz ruhig bleiben...

Das Erstellen von Web-Seiten ist wirklich einfach - nur für das Veröffentlichen ist häufig etwas Nacharbeit und Hintergrundwissen notwendig. Hier muss nicht jedes Detail verstanden werden -- oft genügt es, in dem unverständlichen Chaos bekannte Elemente wiederzufinden. Schauen Sie sich doch in Ihrem Browser mal den HTML-Text dieser Seite an. In Netscape, das ich gerade verwende, wählt man dazu View-PageSource. Hauptziel: Finden Sie den Text - das genügt schon.

zurück zum Beginn der Seite

Grundstruktur einer Web-Seite

Eine Webseite besteht nur aus den Buchstaben, die alle Computersysteme kennen, und das sind leider nicht so viele. Vor allem aber werden aber in den Textverarbeitungs-Programmen völlig unterschiedliche Wege zur Beschreibung der Formatierung beschritten. Für ein anderes Programm ist dies dann reiner Zahlensalat, mit dem es nichts anfangen kann.

Eine Web-Seite muss aber auf völlig unterschiedlichen Computern und von völlig unterschiedlichen Programmen dargestellt werden. Dafür wurde eine "Seitenbeschreibungssprache" erfunden, die HTML oder HyperText Markup Language. Anweisungen zur Gestaltung wurden neu definiert; sie werden in den Text eingefügt. Zum Beispiel wird mit <B>der folgende Text fett dargestellt, und mit</B> die Fettschrift (bold) wieder ausgeschaltet. Es ist Aufgabe des Browsers, diese Anweisungen auf dem Bildschirm umzusetzen. Auf diese Weise kann man für jedes Computersystem einen Browser schreiben, der diese Anweisungen umsetzt und den Text auf den Bildschirm bringt.

Dies ist eine kleine HTML-Seite, die Sie mit einem beliebigen Programm erstellen und als "reiner Text" abspeichern können und die dann vom Browser dargestellt werden kann. Diese Arbeit können uns aber zum Glück die oben genannten Werkzeuge abnehmen! Hier soll nur die Grundstruktur erkennbar werden: Ein HTML-Befehl beginnt mit <...> und endet mit </...>, sie werden wie Klammern in der Mathematik verwendet. Sie nennen sich übrigens tags (sprich: tägs).

Das Dokument identifiziert sich also als Web-Seite und besteht im Wesentlichen aus zwei Teilen. Im Kopf (Head) des Dokumentes werden Angaben zum Titel (nicht Überschrift) und zum Autor gemacht, im "Körper" (Body) des Dokumentes steht dann der Inhalt, der auf dem Bildschirm erscheinen soll.

zurück zum Beginn der Seite

Typen von Links

Links, das sind diese Verknüpfungen, bei denen man in ein anderes Dokuemt springen - das heißt jetzt aber auf neudeutsch surfen - kann. Im Text wird ein Befehl, ein tag, wie folgt eingegeben:

Zwischen den Anführungszeichen muss das Ziel des Sprunges stehen, und zwischen den tags der Text, der auf dem Bildschirm unterstrichen erscheint (kann aber auch ein Bild sein...). Gleich mal Beispiele:

Lassen Sie sich nicht durch Unbekanntes verwirren oder gar ängstigen. Schon gar nicht müssen Sie so etwas lernen und eintippen. Suchen Sie Bekanntes: Erkennen Sie die Sprungstruktur? Lassen Sie sich im ersten Beispiel nicht irritieren von &uuml; der Umschreibung des "ü" - diese Arbeit nimmt uns das Werkzeug ab. Und im zweiten Beispiel wird statt des Textes ein Bild geladen, das angeklickt werden kann: das Region-online-Bild aus der Kopfzeile. All diesen Salat rupfen die "Werkzeuge", mit denen wir bequem die Seiten erstellen können. Wir konzentrieren uns auf das, was gegebenenfalls korrigiert werden muss.

Das Sprungziel besteht eigentlich immer aus "protokoll:rechner/verzeichnis/dokument". Im zweiten Beispiel also das Protokoll zur Übertragung von HTML-Seiten, das HyperText Transport Protokoll - und dann nur der Rechner www.region-online.de. Es fehlt Verzeichnis und Dokument, und deshalb wird das Dokument mit einem Standard-Namen geladen - die Startseite von Region-online.

würde direkt zu der GPW-Präsentation auf dem Limburger Server von Region-online führen und das Dokument aus dem Verzeichnis "Bildung" und dem Unterverzeichnis "GPW" laden.

funktioniert nur auf dem gleichen Rechner (file - als Protokollangabe lädt eine Datei von der eigenen Festplatte), also auf unserem Rechner im Raum 101, wo die Startseite gpw.htm im Verzeichnis gpw-internet auf dem eigenen Rechner auf Festplatte D: liegt. Die merkwürdige Schreibweise d|/gpw... statt d:\gpw... kommt nur uns merkwürdig vor, weil wir kein UNIX, sondern Dos und Windows verwenden.

würde von jedem beliebigen Internet-Rechner der Welt sofort zum Limburger Region-online-Server und unser GPW-Verzeichnis springen und diesen Text laden, und zwar genauer: die Überschrift dieses Abschnittes als erste Zeile auf den Bildschirm bringen. Voraussetzung ist natürlich, dass dort a) das Dokument existiert und b) im Dokument eine Textmarke, ein Anker mit dem Namen "typen" definiert ist.

zurück zum Beginn der Seite

Relative Links

Wenn Sie sich jetzt mal die aktuelle Verzeichnis-Struktur unserer Präsentation anschauen wollen. Vielleicht wird jetzt ein Problem deutlich. 

Die Dokumente, die in den Verzeichnissen liegen, sind alle untereinander verknüpft. Alle können mit einem oder mehreren Maus-Klicks von der Startseite aus geladen werden. Wenn in diesen Verknüpfungen nun die Festplatten-Bezeichnung und die Verzeichnis-Struktur enthalten ist, funktioniert die Verknüpfung nicht mehr, wenn das Komplett-Paket auf einem anderen Rechner landet.

Ein sogenanntes Container-Prinzip muss für das Veröffentlichen oder Weitergeben durchgehalten werden: In keinem Link darf der Name des Grundverzeichnisses, hier GPW_Internet, auftauchen, die in diesem "Container" enthaltenen Unterverzeichnisse dagegen sehr wohl. Das Grundverzeichnis GPW_Internet ist dann der Container, der umbenannt, kopiert und transportiert werden kann.

Möglich wird dies durch die Verwendung von relativen Links:
Im Verzeichnis GPW_Internet liegt das Startdokument "gpw.htm". Mit

  • <A HREF="schueler/schueler.htm">Schüler</A>

springe ich vom aktuellen Verzeichnis in ein Unterverzeichnis namens "schueler" und lade das Dokument "schueler.htm". - Um von "schueler.htm" zurück zu springen, rufe ich

  • <A HREF="../gpw.htm">GPW</A>

auf. Die Schreibung von "../" heißt soviel wie "ein Verzeichnis tiefer" - also von "schueler" in "GPW_Internet". - Als drittes, kompliziertestes Beispiel wollen wir mal von einem Text der Biologie-AG direkt in diesen Text und in diesen Abschnitt springen. Wir müssen von "bioag" in "ags" zurück, nochmal zurück in "GPW_Internet", nun öffnen wir das Verzeichnis "internet", laden den Text "html.htm" und springen zur Überschrift mit der Textmarke "relativ". - Alles klar? Hier ist der relative Link:

  • <A HREF="../../internet/html.htm#relativ">relative Links</A>

zurück zum Beginn der Seite

Tips zur Vermeidung von Pannen

Dass das bisher Gesagte insgesamt dazu dient, ihre Web-Seiten auch nach dem Kopieren funktionsfähig sein zu lassen, ist hoffentlich klar. Dennoch - Pannen lassen sich nicht vermeiden, und die angesprochenen Werkzeuge wollen alle fähig sein, relative Links zu schreiben; keinem gelingt dies vollständig!!!

  1. Verwenden Sie die Suchfunktionen zum Aufspüren von falschen Links: Bei Windows95 Start-Suchen-enthaltener Text: "GPW_Internet" listet Ihnen alle Dateien auf, die den verbotenen Namen des Containers enthalten.
  2. Benennen Sie Ihr Grundverzeichnis um: "GPW_Internet" in "GPW-WWW" oder so. Laden Sie die Startseite "gpw.htm" von Hand in den Browser und testen Sie nun alle Links auf ihre Funktion.
  3. Verwenden Sie von Anfang an ausschließlich Kleinbuchstaben in den Dateinamen und in den Links (oder ausschließlich Großbuchstaben) und verwenden Sie nur acht Buchstaben ohne Sonderzeichen für die Dateinamen und nur drei für die Endung. Viele Computersystem unterscheiden zwischen Groß- und Kleinschreibung ("Gpw.htm" wird durch den Aufruf "gpw.htm" nicht gefunden!!!) und etliche Computer können keine langen Dateinamen verarbeiten! Der Name ihres Grundverzeichnisses ist dabei egal - er darf ja nicht auftauchen in den Links.

zurück zum Beginn der Seite