lehrkraefte:blc:informatik:glf19:css

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
lehrkraefte:blc:informatik:glf19:css [2020/02/10 07:26] – [Vorgehen] Ivo Blöchligerlehrkraefte:blc:informatik:glf19:css [2020/02/10 09:47] (current) – [Vorgehen] Ivo Blöchliger
Line 1: Line 1:
 +
 +===== CSS: HTML mit Stil =====
 +  * {{ :lehrkraefte:blc:informatik:glf19:css-intro.pdf |Präsentation}}
 +
 +==== Vorgehen ====
 +  * Start-Dateien für den CSS-Kurs: {{ :lehrkraefte:blc:informatik:glf19:css.zip |css.zip}} herunterladen und
 +  * in Ihrem lokalen, geeigneten Ordner (wo Sie die Webseite entwickeln) entpacken.
 +  * Laden Sie die 4 Dateien (3x html, 1x css) auf unseren Web-Server ofi.tech-lab.ch
 +  * Betrachten Sie eine der html-Dateien online auf unserem Web-Server. Fügen Sie dazu hinten an der URL z.B. start.html an, z.B.
 +    * https://ofi.tech-lab.ch/2020/teach/d0571f1e/start.html
 +  * Befüllen Sie die Seiten mit ein bisschen Inhalt (max. 10 Minuten!). Es darf auch Fülltext sein: https://www.lipsum.com/feed/html
 +  * Wählen Sie die Farben für Ihre Seiten aus, z.B. mit dieser Hilfe: https://visme.co/blog/website-color-schemes/ (max. 10 Minuten)
 +    * Notieren Sie die Farb-Codes!
 +  * Bauen Sie diese in Ihre css-Datei ein.
 +  * Passen Sie Formatierungen der Elemente an
 +    * Fügen Sie eventuell weitere Formatierungsregeln für weitere Elemente oder Klassen von Elementen ein.
 +
 +==== Hilfen ====
 +  * http://de.html.net/tutorials/css/
 +  * https://www.w3schools.com/css/
 +
 +
 +==== Bewertungskriterien ====
 +  * Alle Ihre Dateien sind auf dem unserem Web-Server ofi.tech-lab.ch
 +  * Die CSS-Datei ist syntaktisch korrekt: https://jigsaw.w3.org/css-validator/#validate_by_input+with_options
 +  * Die HTML-Dateien sind syntaktisch korrekt: http://validator.w3.org/
 +  * Inhalt der Seite ist in sich stimmig (unabhängig davon, ob die Seite fiktiv oder real ist).
 +  * Präsentation der Seite ist ansprechend und dem Inhalt angepasst.