HTML und CSS - Websites erstellen
Editor
HTML-Seiten können mit jedem beliebigen Text-Editor geschrieben werden. Empfohlen wird Notepad++
HTML
Gehe auf W3Schools und arbeite die Kapitel "Introduction" bis "Links" durch. Erstelle dabei auch einige eigene HTML-Dateien mit einem Editor und betrachte sie in einem oder mehreren Browsern.
Gehe auf W3Schools und arbeite die Kapitel "Links" bis "Entities" durch (IFrames und Javascript können vorerst ausgelassen werden, probier dafür bei den Entities auch ü , ä etc. aus).
CSS
Gehe auf W3Schools und arbeite das CSS-Tutorial von "Introduction" bis "Dropdowns" (letzteres wie auch "Navigation Bar" und "Box Model" besonders wichtig, daher unbedingt auch in eigenen Dateien probieren!!!) durch. Fleißaufgabe: "Image Gallery"
MTA HTML und CSS
Das neue ITS-301 Zertifikat ist ähnlich wie das alte MTA-Zertifikat. Wenn du das machen möchtest besuchst du am besten den Kurs von Prof. Wüschner unter https://moodle.vobs.at/brgdo/course/view.php?id=13#section-4. Anmelden kannst du dich dort mit demselben Benutzernamen und Passwort wie an den Schulcomputern. Der Einschreibeschlüssel für den Kurs ist "mta".Schau dir am besten die Demofragen an. Den Lehrplan des ITS-301-Zertifikats findest du unter ITS-301-HTML-CSS.pdf.
Einige Demofragen mit Antworten sind unter https://moodle.vobs.at/brgdo/mod/folder/view.php?id=2124 zu finden.
Die Inhalte des Zertifikats decken sich etwa mit den Übungen im Dokument mta-uebungen.docx. Achtung: das Dokument wird regelmäßig erweitert!
Praktische Aufgabenstellung
Gestalte einen Webauftritt, der mindestens folgende Bedingungen erfüllt:
- mindestens 6 Seiten, also 6 HTML-Dateien (Namensgebung: Datei- und Ordnernamen dürfen keine Leerzeichen, Umlaute und Sonderzeichen enthalten).
- Seiten über Menü erreichbar
- Menüleiste als unordered list mit Verlinkungen, aber waagrecht
- Gliederung der Seiten in mindestens 4 Blöcken (zB: Kopfzeile, Menü, Hauptteil, Fußzeile - man kann zum Beispiel die moderne HTML5-Version mit header, nav, article, footer, etc. verwenden). Mindestens eine Seite mit zwei Spalten (zB. mit aside). Konsultiere für das Layout das entsprechende Kapitel im HTML-Kurs von w3schools.
- Bilder, mind. eine Tabelle, mind eine Liste (zusätzlich zum Menü), externe Verlinkung
- Head mit Doctype und Metatags (title,link,...)
- CSS-Formatierungen in externem Stylesheet
- Umlaute als Entities oder zumindest ein korrektes charset in den Metatags im head.
Plane vor Beginn der eigentlichen Arbeit entweder in einer Software oder mit Entwurfsskizzen auf Papier. Siehe dazu: Bootstrap_02_Wireframes.pdf
Stelle den Webauftritt ins ILIAS: Kurs Informatik itm6, Passwort leibniz, Ordner Webauftritt, Mach eine HTML-Lerneinheit. Lade den Webauftritt hinein (am besten als zip-Datei, die dann entzippt wird). Gib einen sinnvollen Titel, schreib in die Beschreibung deinen Namen
Termin für die Abgabe: 12.1.2023