8.581
Bearbeitungen
Projekt:2018/HTML Diff 8.1: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Projekt:2018/HTML Diff 8.1 (Quelltext anzeigen)
Version vom 24. November 2018, 11:53 Uhr
, 11:53, 24. Nov. 2018→Anforderungen
Jneug (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Jneug (Diskussion | Beiträge) |
||
| (24 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
== Projektziel == | == Projektziel == | ||
Erstellt einen HTML-Steckbrief | Erstellt alleine oder zu zweit einen Steckbrief von euch als HTML-Seite. Wenn ihr zu zweit arbeitet, dann könnt ihr entweder zwei einzelne Steckbriefe erstellen (zwei HTML-Dateien) oder euch gemeinsam auf einer HTML-Seite vorstellen. | ||
Die Ergebnisse des letzten Schuljahres könnt ihr unter [https://diff.ngb.schule/ diff.ngb.schule] ansehen. | |||
== Ablauf == | |||
Im Laufe des Unterrichts lernt ihr immer neue Elemente zur Gestaltung von HTML-Seiten kennen. Ihr werdet jedesmal Gelegenheit haben, das Gelernte in euren Steckbrief einzubauen. Am Ende sollte eure Seite möglichst viele der Elemente enthalten. Darunter werden unter anderem Tabellen, Bilder und Multimedia-Objekte sein. | |||
{{Kasten|'''Abgabe der Steckbriefe''' | |||
Abgabe der Steckbriefe ist am '''Do., 29.11.2018''' im Tauschordner. Wer Probleme mit der Abgabe im Tauschordner hat, der kann die Dateien bis '''Fr., 30.11.2018 um 23:59 Uhr''' per Mail an [mailto:schule@neugebauer.cc schule@neugebauer.cc] schicken. | |||
''Abzugeben ist der komplette HTML-Ordner, inklusive der Unterordner "bilder" und "css" mit ihren Inhalten.'' (Am besten in Form einer [[wikipedia:ZIP-Dateiformat|ZIP-Datei]].) | |||
[[Datei:Icon Warning.png|24px|class=alert-icon|link=]] Achtet darauf, dass die Abgabe alle wichtigen Dateien enthält! Alle Bilder müssen im Unterordner "bilder" abgegelgt sein, alle CSS-Dateien im Ordner "css". Bewertet wird das abgegebene Produkt, nicht der Zustand auf eurem Rechner. Testet eurer Seite also gegebenenfalls vorher auf anderen Computern. | |||
|Farbe={{Farbe:Warnung}}}} | |||
== Anforderungen == | == Anforderungen == | ||
Jeder Steckbrief muss ein oder mehrere Vorkommen der folgenden im Unterricht behandelten Elemente enthalten: | |||
# Tags zur Textauszeichnung | |||
## Absätze | |||
## Fett, Kursiv, Unterstreichungen, ... | |||
## Überschriften | |||
# Bilder | |||
# Links | |||
# Listen | |||
# Tabellen | |||
Außerdem muss der HTML-Steckbrief mit einer '''CSS-Datei''' verknüpft sein, welche verschiedene Elemente des Steckbriefs mit CSS-Regeln formatiert. Darunter sollen folgende Elemente sein: | |||
# Formatierung von Textelementen (z.B. Textfarbe, Unterstreichungen, ...) | |||
Optional können diese Elemente in den Steckbrief eingebaut werden: | |||
# [https://link.ngb.schule/css-pseudoklassen Formatierung mit Pseudoselektoren] (z.B. Links mit :visited, Änderungen mit :hover, ...) | |||
# Multimedia-Objekte (z.B. Videos, Audio, interaktive Elemente, ...) | |||
# Strukturierungselemente (<div>, Navigationselemente, ...) | |||
# Formulare | |||
# Icons (z.B. [https://www.font-awesome.com Font Awesome]) | |||
== Bewertung == | |||
Bewertet wird die Vollständigkeit der Steckbriefe nach den obigen Vorgaben, Aufbau und Struktur des Quelltextes (wie ordentlich der Quelltext geschrieben ist) und wie sinnvoll die Inhalte des Steckbriefes sind. | |||
== Hilfreiche Links == | == Hilfreiche Links == | ||
=== Links aus dem Unterricht === | |||
* [https://link.ngb.schule/html-bailey Baileys Homepage] | |||
* [https://link.ngb.schule/html-takota Takotas Homepage] | |||
* [https://link.ngb.schule/html-steckbrief Arbeitsauftrag HTML-Steckbrief] | |||
* [https://link.ngb.schule/html-neue-tags Einführung neuer HTML-Tags] | |||
* [https://link.ngb.schule/html-tabellen Beispiel einer HTML-Tabellen] | |||
* [https://link.ngb.schule/css-uebersicht Übersicht von CSS-Eigenschaften] | |||
* [https://link.ngb.schule/css-pseudoklassen Einführung zu CSS-Pseudoklassen] | |||
=== Weiterführende Links === | |||
* [https://www.phase5.info/ Phase5 HTML-Editor] | |||
* [https://www.html-seminar.de/html-editor.htm Einführung in den Phase5 HTML-Editor] | * [https://www.html-seminar.de/html-editor.htm Einführung in den Phase5 HTML-Editor] | ||
* [https://link.ngb.schule/html-steckbrief Online HTML-Editor zum Ausprobieren neuer Elemente] | * [https://link.ngb.schule/html-steckbrief Online HTML-Editor zum Ausprobieren neuer Elemente] | ||
* [https://www.w3schools.com/tags/default.asp Übersicht aller HTML-Tags (auf englisch)] | |||
[[Kategorie:Projekte:2018/19|HTML-Projekt]] | [[Kategorie:Projekte:2018/19|HTML-Projekt]] | ||