aktuelle.kurse/m152/auftraege/c
harald.mueller@tbz.ch e256f5211b reorg2
2021-07-20 16:00:23 +02:00
..
README.md reorg2 2021-07-20 16:00:23 +02:00

Aufgabe M152-c: Eigener Styleguide definieren/bestimmen und dokumentieren

Zeitbedarf: ca. 100-120 min

1.) Erstellen und verlinken Sie eine HTML-Seite namens "styleguide.html" (oder "styleguide.php") und definieren Sie Ihren eigenen Styleguide für Ihre Webseite. Das heisst, Sie bestimmen:

  • Schriftart und -grösse
  • Farben-Set
  • Logo und evtl. andere Erkennungsmerkmale
  • Icons & Schaltflächen (Form, Grösse, Verhalten (z.B. hover-Verhalten)
  • Abstände (bei Absätzen, bei Tabellen, um Grafiken herum, ... , ... )
  • Definieren Sie Header und Footer Ihrer Webseite.

2.) Erstellen und verlinken Sie eine Beispielseite "styleguide_examle.html", die alles was definiert wurde, "richtig" verwenden.

Bemerkung 1: Wenn Sie Bootstrap verwenden, machen Sie eine eigene CSS-Datei und überschreiben Sie dort die Defaultfarben der Schaltflächen (die Defaultfarben sind ja langweilig und benutzen alle)

Bemerkung 2: Wenn Sie ein vorgefertigtes Template benutzen, machen Sie entsprechend eine Nach-Analyse dieser oben beschriebenen Punkte samt Ihren Ergänzungen, Erweiterungen und Nach-Justierungen. Sie können auch die oftmals im Template angegebenen Styleguide-Seite benutzen und für Ihre Zwecke anwenden und/oder umbauen und nachdefinieren. Benützen Sie dafür das kaskadierende Konzept der CSS (überschreiben mit dem zuletzt Definiertem).

Bemerkung 3: Wenn Sie schlau sind, werden Sie dann immer die gleichen Header und Footer via PHP (inlude) immer in der gleichen Form einbinden.

Lassen Sie sich anleiten von diesen Dateien