FRIEDRICH-SPEE-GYMNASIUM RÜTHEN Zurück zum Inhaltsverzeichnis
Inhaltsverzeichnis

HTML - Beispielseiten und Empfehlungen zur Gestaltung

Hier finden sich einige HTML-Seiten, die mit einfachsten Mitteln gestaltet sind. Die wichtigsten Elemente sind so dargestellt, daß sie leicht nachvollzogen und dann zur Erstellung eigener Seiten eingesetzt werden können. Öffne die Seite mit dem Thema, das Dich interessiert, mit dem Browser, (Das hast Du ja bereits getan.) und schau Dir den Quelltext, der die Seite erzeugt, an. Das kannst Du innerhalb des Browsers tun, falls er die Option Ansicht ==> Seitenquelltext anbietet. Ansonsten geht das mit jeder Textverarbeitung, am besten mit dem Editor. Dann ist es leicht, die Aufgaben zu lösen und die Konstruktion der Seite zu verstehen. Zu Risiken und Nebenwirkungen frage Deinen Lehrer oder besuche den im Ausgangsbereich angegebenen vollständigen HTML-Kurs.

Nachdem Du die Konstruktion der Seiten in diesem Kurs verstanden hast, solltest Du mit Hilfe der Seiten-Vorlage eigene Seiten für das FSG erstellen können. Versuche dabei, dich für den Anfang auf einfache Mittel zur Gestaltung zu beschränken. Unten auf dieser Seite findest Du einige Empfehlungen zur Gestaltung. Ansonsten kannst Du ja mal bei David Siegel, einem der führenden Web-Designer, vorbeischauen. Die Adresse findest Du ebenfalls im Ausgangsbereich.

Den Ablauf unseres Projekts zur Gestaltung einer Hompage für das Friedrich-Spee-Gymnasium kannst Du stichwortartig unten auf dieser Seite nachlesen. Links zur benötigten Software findest Du im Ausgangsbereich.


Themen

  1. Kopf und Körper einer leeren HTML-Seite - Diese Seite kann als Grundlage für eigene Seiten verwendet werden.
  2. Erste Versuche in HTML - Suche nach Tags und Entities.
  3. Überschriften, Linien, Absätze und Listen - Übungen zur Textgestaltung
  4. Darstellung von Sonderzeichen - Wie wird in HTML ä,ö,ü und ß geschrieben?
  5. Einbinden von Grafiken in HTML-Seiten - Bilder und Symbole machen eine HTML-Seite farbig.
  6. Hypertext durch Links - Durch einen Mausklick an einen anderen Ort gelangen.
  7. Tabellen - Vielseitige Gestaltungshilfen, die ihre Tücken haben.
  8. Zusammenfassung - Die wichtigsten Tags im Überblick
  9. Vorlage - Vorlage für die Erstellung eigener Seiten.
Diese acht Beispielseiten wurden als Vorbereitung auf das Projekt "Homepage" vom Kurs bearbeitet. Danach wurden Sie durch dieses Inhaltverzeichnis zu einem Kurs für Einsteiger verbunden.

Empfehlungen zur Gestaltung von Internet-Seiten

Ablauf des Projekts "Homepage für das Friedrich-Spee-Gymnasiums"

Trotz der nach heutigen Maßstäben (Stand: Februar 1998) bescheidenen Rechnerleistung im Informatikraum (13 386er mit Windows 3.1, ein Pentium 125 mit Windows 95, ISDN-Karte (der von SaN), ein File-Server, Ganzseiten-Scanner, Laser-Drucker, OH-Display, alles vernetzt unter Novell 3.11) klappte die Erstellung der Seiten recht reibungslos.

Arbeitsschritte:

  1. Ideen-Sammlung anhand von Seiten anderer Schulen (Aus dem Internet heruntergeladen mit WebWhacker)
  2. Planung der Seiteninhalte und Aufteilung der Bereiche
  3. Planung der Verzeichnisstruktur und Festlegung der Dateinamen der einzelnen HTML-Dokumente
  4. Erfassung der Texte (MS-Works) am Arbeitsplatz
  5. Konvertierung ins HTML-Format am Multimedia-Arbeitsplatz (Star-Writer, haben wir im Rahmen von SaN von Star-Division erhalten)
  6. Erfassung der benötigten Fotos und Grafiken (Scanner im Informatikraum)
  7. Vorbereitung der Bilder durch Schüler und den Kursleiter zu Hause
  8. Erstellen der HTML-Seiten durch die Schüler mit Web-It (Ausgezeichneter HTML-Editor unter Windows 3.1: Im oberen Fenster wird der HTML-Code geschrieben, wobei Elemente wie Listen, Tabellen, Links, etc. durch Buttons automatisch erzeigt werden. Im unteren Fenster erscheint ein Eindruck der Seite im Browser.)
  9. Speichern der Seiten auf dem Novell-Server und Kontrolle in Netscape am Multimedia-Arbeitsplatz. Danach evtl. Nachbearbeitung am eigenen Arbeitsplatz.
  10. Hochladen der fertigen Seiten auf den Server des Anbieters mit WS-FTP95 vom Multimedia-Arbeitsplatz aus.
  11. Kontrolle der Seite im Internet
Felix Pradel, Kursleiter
Zurück zum Inhaltsverzeichnis
Inhaltsverzeichnis