B KO – WFH Webdesign Kerstin Fröhlig November 2014
Arbeitsauftrag
Deine Aufgabe ist es eine Webseite nach bestimmten Vorgaben zu entwickeln.
Die Seite soll aus diversen Bereichen bestehen:
Kopf: mit Firmenlogo und Firmenname; Schrift fett und zentriert
Horizontale Navigationsleiste: auf schwarzem Hintergrund mit den Menüpunkten „Home“,
„Kontakt“ (Später kommen weitere Punkte hinzu.)
Vertikale Navigationsleiste: Inhalt soll eine Syntaxbeschreibung, der hier verwendeten Befehle sein. (Also: Background-Gestaltung / Padding (Abstände), Textformatierung, etc.)
Inhaltsbereich: mit Bild im Hintergrund.
Fußbereich: mit einem Verweis auf eine Email-Adresse.
Lösungshinweise:
Kopiere den Ordner Webdesign2 im Verzeichnis „Dateien für Schüler“ auf den Desktop und öffne die Dateien „index.html“ und „style.css“.
Ändere den Autorenname im Header.
Binde die Datei style.css in die Datei index.html (Befehl: <link href=“ ….. .css“ rel=“stylesheet“ />) Überprüfe, ob dies funktioniert.
Speichere alle Bilder im Ordner Bilder, alle weiteren Html Seiten im Ordner Html.
Ergänze nun die fehlenden Befehle in der html- und in der CSS-Datei. Achte besonders darauf, wann ein TAG wieder geschlossen wird.
Hmtl:
Einfügen der Bereiche <div id=“ …..>
Einfügen der Links
etc.
CSS: Definition der fehlenden Bereiche; insbesondere Ausrichtung, Abstände, Farben, Weite, Höhe, Schriftgröße.
Befehle:
Background (http://www.w3schools.com/css/css3_backgrounds.asp)
Padding (http://www.w3schools.com/css/css_padding.asp)
Textformatierung (http://www.w3schools.com/css/css_text.asp)
Solltest Du Fragen haben, benutze folgende Quelle: http://www.w3schools.com/css/default.asp
