Skip to content

Startseite: Projekt

In der Aufgabe Grundgerüst haben wir gelernt, dass eine Website im Hintergrund einen unsichtbaren Aufbau hat. Dies ist auch bei unserem Projekt «Gemeinde XY» so.

Ziel(e)

  • Ich kann eine Aufgabe nach Aufgabenstellung lösen.

  • Ich komme selbständig zu den notwendigen Informationen.

Aufgabe

In einem ersten Schritt geht es darum, wie bei der Aufgabe – HTML-Tags zur Strukturierung der Webseite beim Design der Aufbau zu erkennen und die einzelnen Elemente in den Strukturierungs-Tag einzuteilen.

Drucke dir hierfür den finalen Screenshot der Seite «Home» aus oder arbeite digital und zeichne die zu erkennenden Bereiche ein.

Kleiner Tipp, folgende HTMl-Tags sind zu finden:
header, main, footer, 2x article, 5x div, nav

Danach öffne die index.html – Datei aus dem Projektordner «projekt_gemeinde_xy» und setze folgendes um:

  • Strukturiere die index.html Datei mit den notwendigen HTML-Tags.

  • Füge die bestehenden Elemente in die korrekten HTML-Strukturierungs-Tags ein.

  • Füge im Kopfbereich das Logo mit einer Breite von 100px ein. Bennen das Logo sinnvoll!

  • Verlinke das Logo, dass wenn man daraufklickt, die index.html – Datei neu geladen wird.

  • Füge im Navigations-Bereich eine Aufzählung (via HTML-Tag) mit folgenden Punkten ein: Home, Geschichte, Galerie, Kontakt.

  • Arbeite wo sinnvoll auch mit Kommentaren!

Am Schluss sieht deine Datei aus, wie der Screenshot im Anhang mit der Bezeichnung «nach dieser Aufgabe».

Achtung: abgesehen von den neuen Elementen verändert sich rein optisch nichts!

Halte neue oder wichtige Lerninhalte in deinem Projektjournal weiterhin fest. Verwende hierzu einen aussagekräftigen Titel im Bereich «freie Gliederung».