Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- de:modul:m287:learningunits:lu00:13 [2026/06/22 07:23] – gelöscht - Externe Bearbeitung (Unbekanntes Datum) 127.0.0.1
+++ de:modul:m287:learningunits:lu00:13 [2026/06/22 07:26] (aktuell) – vdemir
@@ Zeile 1: / Zeile 1: @@
+====== LU00m - LB2 V2.2 - Inhalt =====
+===== LU01 - Verweise und URL-Aufbau =====
+^# ^Stufe ^Lernziel ^
+^1.1 ^Kennen |Ich kenne die Syntax und seine Bestandteile einer URL. |
+^1.2 ^Aufzählen |Ich kann mindestens drei verschiedene Protokolle aufzählen, die in einer URL verwendet werden können. |
+^1.3 ^Unterscheiden |Ich kenne den unterschied zwischen einer Referenzierung mit absoluter und relativer Pfadangabe. |
+^1.4 ^Anwenden |Ich kann Referenzierungen mit absoluter und relativer Pfadangabe gezielt in HTML-Dokumenten anwenden/einsetzen. |
+===== LU03 - Box Modell =====
+^# ^Stufe ^Lernziel ^
+^3.1 ^Unterscheiden |Ich kenne den Unterschied zwischen dem klassischen und dem neuen Box-Modell.  |
+^3.2 ^Erklären      |Ich kann den Vorteil des neuen Box-Modells in eigenen Worten angeben. |
+^3.3 ^Erklären      |Ich kann Inhalte (Content) in Boxen syntaktisch (Aufbau) und semantisch (Bedeutung) korrekt mit dem klassischen und dem neuen Box-Modell erstellen und strukturieren. |
+^3.4 ^Anwenden      |Ich kann Inhalte (Content) in Boxen in der ausführlichen und in der kurzen Schreibweise lesen, verstehen, strukturieren und gestalten. |
+^3.5 ^Erstellen     |Ich kann den Begriff zusammenfallende (vertikale) Aussenabstände (Collapsing Margins) in eigenen Worten erklären. |
+===== LU04 - Display =====
+^# ^Stufe ^Lernziel ^
+^4.1 ^Kennen        |Ich kenne die Standardwerte von der Eigenschaft //display// und kann die Unterschied in eigenen Worten erklären. |
+^4.2 ^Kennen        |Ich kenne den Aufbau eines Flexbox Layouts (Container, Items) und deren Eigenschaften. |
+^4.3 ^Kennen        |Ich kenne den Aufbau eines Grid Layouts (Container, Zeilen, Spalten, Zellen). |
+^4.4 ^Unterscheiden |Ich kann die Standardwerte der Eigenschaft display unterscheiden und den Unterschied in eigenen Worten erklären. |
+^4.5 ^Unterscheiden |Ich verstehe den Unterschied zwischen Flexbox und Grid Layout. |
+^4.6 ^Erstellen     |Ich kann ein Flexbox Layout syntaktisch und semantisch korrekt erstellen und strukturieren. |
+^4.7 ^Erstellen     |Ich kann ein Grid Layout syntaktisch und semantisch korrekt erstellen und strukturieren. |
+===== LU05 - Responsive Webdesign (RWD) =====
+^# ^Stufe ^Lernziel ^
+^5.1 ^Erklären      |Ich kann erklären, was Responsive Webdesign ist und warum es heute für professionelle Webentwicklung unverzichtbar ist (inkl. Google Mobile-First-Indexierung). |
+^5.2 ^Unterscheiden |Ich kann die Schlüsselelemente des Responsive Webdesigns (flexibles Grid, flexible Medien, Media Queries) benennen und voneinander unterscheiden. |
+^5.3 ^Definieren    |Ich kann den Begriff Viewport definieren und dessen Bedeutung für die Darstellung einer Webseite auf verschiedenen Endgeräten erläutern. |
+^5.4 ^Aufzählen     |Ich kann die aktuell gültigen CSS-Medientypen //(all, screen, print, speech)// aufzählen und deren Verwendungszweck beschreiben. |
+^5.5 ^Anwenden      |Ich kann das media-Attribut im <link>- oder <style>-Tag korrekt einsetzen, um gerätespezifische Stylesheets (z. B. für Bildschirm und Drucker) einzubinden zu können. |
+^5.6 ^Beurteilen    |Ich kann veraltete (deprecated) Medientypen wie //handheld//, //tv// oder //braille// identifizieren und begründen, und begründen warum diese durch moderne CSS3-Media-Queries ersetzt wurden. |
+^5.7 ^Kennen        |Ich kenne die drei Varianten, um Media Queries in ein HTML-Dokument einzubinden (//<link>//, //<style>//, //@media)//. |
+^5.8 ^Beurteilen    |Ich kann den Begriff //Breakpoint// in eigenen Worten erklären und dessen Funktion im Responsive Webdesign beschreiben. |
+^5.9 ^Beurteilen    |Ich kann Media Queries mit Breakpoints und //and//-Verknüpfungen syntaktisch und semantisch korrekt erstellen und in HTML-Dokumente einbinden. |
+^5.10 ^Kennen       |Ich kenne die wichtigsten Medienmerkmale (width, height, orientation, resolution etc.) und deren Bedeutung für Media Queries. |
+^5.11 ^Unterscheiden |Ich kann den Unterschied zwischen width/height (Viewport) und device-width/device-height (Gerät) in eigenen Worten erklären. |
+^5.12 ^Anwenden     |Ich kann Medienmerkmale mit den Präfixen min- und max- sowie dem Attribut orientation gezielt in Media Queries einsetzen. |
+===== LU06 - Bootstrap =====
+^# ^Stufe ^Lernziel ^
+^6.1 ^Kennen        |Ich kenne die zwei Varianten, um Bootstrap in ein HTML-Dokument einzubinden (Download und CDN), und deren jeweilige Vor- und Nachteile. |
+^6.2 ^Erklären      |Ich kann erklären, wofür die <link>-Attribute integrity und crossorigin beim Einbinden von Bootstrap verwendet werden.  |
+^6.3 ^Anwenden      |Ich kann Bootstrap korrekt in ein bestehendes HTML-Projekt einbinden und die Auswirkungen auf die Darstellung im Webbrowser beurteilen.|
+^6.4 ^Kennen        |Ich kenne den Unterschied zwischen .container und .container-fluid sowie das 12-Spalten-Raster von Bootstrap. |
+^6.5 ^Unterscheiden |Ich kann erklären, wann ich .container oder .container-fluid einsetze und welchem HTML-Element ich die Container-Klasse sinnvoll zuordne. |
+^6.6 ^Erstellen     |Ich kann ein responsives Spaltenlayout mit den Bootstrap-Klassen container, row und col- syntaktisch und semantisch korrekt erstellen. |
+===== LU07 - Softwarequalität =====
+^# ^Stufe ^Lernziel ^
+^ 7.1 ^Kennen | Ich kenne die sechs Qualitätsmerkmale der Norm ISO 9126 (Zuverlässigkeit, Funktionalität, Benutzbarkeit, Effizienz, Änderbarkeit, Übertragbarkeit) und kann sie benennen. |
+^ 7.2 ^Kennen | Ich kenne die wichtigsten Fehlerarten (Codier-, Logik-, Entwurfs-, Daten-, Umsetzungs- und Oberflächenfehler) und kann je ein Beispiel dazu nennen. |
+^ 7.3 ^Kennen | Ich kenne die Prinzipien guter Testaktivitäten (frühzeitig, messbar, dokumentiert, geplant) und die fünf Kriterien für die Auswahl von Testfällen. |
+^ 7.4 ^Kennen | Ich kenne den Zweck von Validatoren und weiss, welche W3C-Dienste für HTML und CSS verwendet werden. |
+^ 7.5 ^Unterscheiden | Ich kann den Unterschied zwischen der White-Box- und der Black-Box-Testmethode in eigenen Worten erklären und begründen, wer welche Methode anwenden kann. |
+^ 7.6 ^Erklären | Ich kann erklären, warum frühzeitiges Testen Zeit und Kosten spart, und dies anhand eines Praxisbeispiels (z.B. Prototyp vs. fertiges Produkt) veranschaulichen. |
+^ 7.7 ^Erklären | Ich kann erklären, welche Auswirkungen Softwarefehler auf verschiedene Einsatzgebiete (Massenprodukt vs. individuelle Software) haben können. |
+^ 7.8 ^Erklären | Ich kann erklären, warum Validatoren für Standardkonformität, Barrierefreiheit, SEO und langfristige Wartbarkeit wichtig sind. |
+^ 7.9 ^Erstellen | Ich kann für ein gegebenes Testobjekt strukturierte Testfälle erstellen, die Normal-, Grenz- und Ausnahmefälle abdecken, und diese in einem Testbericht dokumentieren. |
+^ 7.10 ^Anwenden | Ich kann den W3C HTML- und CSS-Validator gezielt einsetzen, die Ergebnisse (Fehler, Warnungen) interpretieren und den Code entsprechend korrigieren. |