So sahen früher viele Webseiten aus...

Sie wurden mit sogenannten "Frames" erstellt. Dabei enthielt jeder Frame (Bilderrahmen) auf der Seite eine eigene Unterseite. Es wurden also auf einer Seite mehrere Frames dargestellt.

Der eine Frame (links unten - #navigation) diente der Navigation, der oben (#header) enthielt ein "Banner" (Flagge) mit einem Bild (oder -wie hier- mehreren Bildern), das die Seite repräsentiert, und der letzte Frame (rechts unten - #main) diente der Darstellung der eigentlichen Inhalte.

Wenn man im Navigations-Frame auf einen link klickte, wurde in #main eine neue Seite geladen. Also waren #header und #navigation statisch (unveränderlich) und #main dynamisch (veränderlich).

Auf manchen Seiten wird auch der #navigation-frame nach einem Klick neugeladen, z.B. um Untermenüs aufzurufen.

Heute erstellt man webseiten für gewöhnlich mit css. Da geht das anders...


Aufgaben:

  1. Lasse Dir von mir die Funktionsweise von div-Boxen erklären oder lies selbst auf dieser Seite nach.
  2. Erstelle eine Seite nach dieser Vorlage. Die von Dir erstellte Seite soll also aussehen wie die Seite, die Du gerade betrachtest... Du kannst die Bilddateien nutzen. Die Vorgabedateien findest Du hier und den Text hier.
  3. Schließe alle Dateien und kopiere die index.html zweimal. Einmal gibst Du ihr den Namen zugspitze.html und einmal brocken.html.
  4. Verändere die neuen Seiten (zugspitze.html, brocken.html) so, dass sie Informationen (und Bilder?) zur Zugspitze bzw. zum Brocken enthalten und mittels Navigationsmenü aufgerufen werden können.