Thema: Zoo und seine Bewohner

1. Seite: Willkommensseite

  • Willkommensblabla mit Bild(ern) und einem YouTube/Vimeo Video (erinnere dich an Übung 3)
  • Erstelle eine Definitionsliste geordnet nach Säugetiere, Insekten, Fische, Vögel, (…) die in diesem Zoo beheimatet sind

2. Seite: Infoseite

Tabelle mit folgenden Spalten:

  1. Tier
  2. Vegetarier (ja/nein)
  3. Gattung
  4. Lebensraum
  5. Patenschaft (j/n)
  6. Name (in Zoos bekommen Tiere mit Patenschaften meist einen persönlichen Namen)
  7. falls dir noch etwas einfällt, erweitere die Tabelle
  • wenn es keine Patenschaft gibt dann verbinde die Zellen Patenschaft und Name miteinander
  • Ordne mehrere Tiere untereinander, bei denen du mittels senkrechter Zellenverbindung einen Eintrag für mehrere Tiere setzen kannst
  • Tip: mit der css Eigenschaft width: 100%; kannst du die Tabelle halbwegs responsive machen.

3. Seite: Kontaktseite

Auf dieser Seite soll es ein Formular geben.
Felder die Abgefragt werden (achte auf die Validierung):

  1. Name
  2. Mailadresse
  3. Besuchstag (date)
  4. Besuchszeit (time)
  5. Hat es gefallen (range)
  6. Weiterempfehlung (ja/nein)
  7. Welche Tierart hat am besten gefallen (datalist)
  8. Kommentar (textarea)
  9. Besucherinfo (Auswahlliste)
    • Familienausflug
    • Allein unterwegs
    • Gruppenausflug
    • Ausflug mit Freunden
    • was anderes
  10. Absendebutton und Resetbutton

Allgemein

  • Nutze die Stylinganweisungen aus Übung 1
  • Nutze die strukturellen Tags und Auszeichnungstags aus Übung 2
  • Nutze Bilder und Videos wie aus Übung 3