diff --git a/slides/klausurfragen.md b/slides/klausurfragen.md index 2e027fc..19dd9cd 100644 --- a/slides/klausurfragen.md +++ b/slides/klausurfragen.md @@ -1,6 +1,82 @@ -# 223015c – Fragenkatalog (Question Pool) -**IT-Grundlagen · HdM Stuttgart · M. Czechowski** -**Ziel: ~100 Fragen, hohe Varianz, semestraler Los-Mechanismus** +--- +marp: true +theme: gaia +paginate: true +backgroundColor: #fff +header: "" +footer: "" +title: "Fragenkatalog - Klausurvorbereitung" +--- +FA2 + + +# Fragenkatalog – 223015b/223015c +**IT-Grundlagen/Dateiformate · HdM Stuttgart · M. Czechowski** + +Stand: 01.02.2026 --- @@ -15,7 +91,8 @@ > `[CLOZE]` = `cloze` (Lückentext, gemischt)` --- ---- + + ## BLOCK A – Von-Neumann-Architektur @@ -40,6 +117,8 @@ Ordne jeder Komponente der Von-Neumann-Architektur ihre Funktion zu. --- + + ### A2 – Welche Komponente ist das? **Thema:** Von-Neumann – einzelne Komponente identifizieren **Punkte:** 1 @@ -56,24 +135,7 @@ Ein Programm besteht aus einer Folge von Befehlen. Eine Komponente der Von-Neuma --- -### A3 – Bus-Typen identifizieren -**Thema:** Von-Neumann – Bus-System im Detail -**Punkte:** 2 -**Typ:** `[MATCH]` - -Ordne jedem Bus-Typ seine Funktion zu. - -| Bus | Funktion | -|---|---| -| Adressbus | Übermittelt die Speicheradresse, an der Daten gelesen/geschrieben werden | -| Datenbus | Führt die eigentlichen Daten zwischen CPU und Speicher | -| Steuerbus | Übermittelt Steuersignale (Lesen/Schreiben, Takt) | - -> **Feedback:** Adressbus = „Wo?", Datenbus = „Was?", Steuerbus = „Wie/Wann?" - ---- - -### A4 – Von-Neumann: Was wird ermöglicht? +### A3 – Von-Neumann: Was wird ermöglicht? **Thema:** Von-Neumann – Bedeutung **Punkte:** 2 **Typ:** `[MM]` (Mehrfachauswahl) @@ -91,38 +153,7 @@ Welche der folgenden Aussagen werden durch die Von-Neumann-Architektur ermöglic --- -### A5 – Von-Neumann vs. Harvard: Kern-Unterschied -**Thema:** Architektur-Vergleich -**Punkte:** 1 -**Typ:** `[MC]` - -Mikrocontroller nutzen oft die Harvard-Architektur. Was unterscheidet sie von der Von-Neumann-Architektur? - -- [ ] Harvard hat mehr Prozessorkerne. -- [x] **Bei Harvard sind Code- und Datenspeicher getrennt – bei Von-Neumann teilen sie den gleichen Speicher.** ✅ -- [ ] Harvard nutzt keinen Bus. -- [ ] Der Unterschied liegt nur in der Taktfrequenz. - -> **Feedback:** Von-Neumann: ein gemeinsamer Speicher für Code und Daten. Harvard: zwei separate Speicher. Harvard ist schneller bei Echtzeitanwendungen (paralleler Zugriff), aber weniger flexibel. - ---- - -### A6 – Harvard: Wofür? -**Thema:** Harvard-Architektur – Anwendung -**Punkte:** 1 -**Typ:** `[MC]` - -Wo nutzt man die Harvard-Architektur? - -- [ ] In allen modernen Laptops und Smartphones. -- [ ] In Cloud-Rechenzentren. -- [x] **In Mikrokontrollern (z. B. Arduino) und DSPs – dort zählt Echtzeit.** ✅ -- [ ] Sie wurde durch Von-Neumann ersetzt und existiert nicht mehr. - -> **Feedback:** Harvard-Architektur = Nische für Echtzeit-Anwendungen. Mikrocontroller, Signalprozessoren. Der Rest der modernen Computerwelt: Von-Neumann (z. B. Laptop, Smartphone, Server, Spielkonsole). - ---- ---- + ## BLOCK B – Netzwerk-Grundlagen (TCP/IP) @@ -136,13 +167,14 @@ Wo nutzt man die Harvard-Architektur? Ordne jedem Protokoll die richtige TCP/IP-Schicht zu. | Protokoll | Schicht | -|---|---| -| HTTP | Anwendung | -| DNS | Anwendung | -| TCP | Transport | -| UDP | Transport | -| IP | Internet | +|----------|---| +| HTTP | Anwendung | +| DNS | Anwendung | +| TCP | Transport | +| UDP | Transport | +| IP | Internet | | Ethernet | Netzzugang | +| WLAN | Netzzugang | > **Feedback:** Anwendung: HTTP, DNS, SMTP, FTP. Transport: TCP, UDP. Internet: IP. Netzzugang: Ethernet, WLAN. @@ -164,6 +196,8 @@ Das Protokoll IP arbeitet auf welcher TCP/IP-Schicht? --- + + ### B3 – Schicht-Funktion beschreiben **Thema:** TCP/IP – Funktionen der Schichten **Punkte:** 2 @@ -194,7 +228,7 @@ Was identifiziert eine MAC-Adresse? ### B5 – Was ist eine IP-Adresse? **Thema:** IP-Adresse – Konzept **Punkte:** 1 -**Typ:** `[MC]` +**Typ:** `[MC]`WiFi Was identifiziert eine IP-Adresse? @@ -240,6 +274,8 @@ Ordne jeder Adresse ihre Beschreibung zu. --- + + ### B8 – MAC ändert sich, IP nicht: Warum? **Thema:** IP vs. MAC beim Routing – Transfer **Punkte:** 2 @@ -393,13 +429,14 @@ Welches Problem lösen Sequenznummern im TCP-Header konkret? - [ ] Sie verhindern, dass Hacker die Verbindung abhören können. - [x] **Pakete können in falscher Reihenfolge ankommen. Sequenznummern erlauben das korrekte Sortieren beim Empfänger.** ✅ -- [ ] Sie zählen, wie viele Benutzer gleichzeitig auf dem Server sind. +- [ ] Sie zählen, wie viele BenutzerInnen gleichzeitig auf dem Server sind. - [ ] Sie bestimmen die maximale Größe einer Datei. > **Feedback:** IP-Pakete können unterschiedliche Routen nehmen → Part 3 kommt vor Part 1. TCP sortiert sie anhand der Sequenznummern wieder. --- ---- + + ## BLOCK C – HTTP @@ -428,7 +465,7 @@ Ordne jeder HTTP-Methode ihre Hauptfunktion zu. **Punkte:** 1 **Typ:** `[MC]` -Ein Nutzer erstellt einen neuen Blog-Eintrag auf einer Webseite. Welche HTTP-Methode wird verwendet? +Ein NutzerInnen erstellt einen neuen Blog-Eintrag auf einer Webseite. Welche HTTP-Methode wird verwendet? - [x] **POST – eine neue Ressource wird erstellt.** ✅ - [ ] PUT – PUT wird immer verwendet, wenn Daten gesendet werden. @@ -444,7 +481,7 @@ Ein Nutzer erstellt einen neuen Blog-Eintrag auf einer Webseite. Welche HTTP-Met **Punkte:** 1 **Typ:** `[MC]` -Ein Nutzer aktualisiert sein Profilbild – das alte Bild wird durch ein neues ersetzt. Welche HTTP-Methode? +Ein NutzerInnen aktualisiert sein Profilbild – das alte Bild wird durch ein neues ersetzt. Welche HTTP-Methode? - [ ] GET – GET kann auch Daten senden. - [x] **PUT – ersetzt eine existierende Ressource.** ✅ @@ -460,7 +497,7 @@ Ein Nutzer aktualisiert sein Profilbild – das alte Bild wird durch ein neues e **Punkte:** 1 **Typ:** `[MC]` -Ein Nutzer löscht einen von ihm erstellten Kommentar auf einer Webseite. Welche HTTP-Methode wird der Browser im Hintergrund verwenden? +Ein NutzerInnen löscht einen von ihm erstellten Kommentar auf einer Webseite. Welche HTTP-Methode wird der Browser im Hintergrund verwenden? - [ ] GET – GET kann auch Löschvorgänge auslösen. - [ ] POST – POST ist die Standardmethode für alle Änderungen. @@ -471,9 +508,7 @@ Ein Nutzer löscht einen von ihm erstellten Kommentar auf einer Webseite. Welche --- ---- - - + ### C5 – GET: Warum nicht für Passwörter? **Thema:** HTTP-Methoden – GET Sicherheit @@ -491,7 +526,7 @@ Warum sollte man niemals GET verwenden, um sensible Daten (z. B. ein Passwort) a --- -### C6 – Status-Codes: Categorisierung +### C6 – Status-Codes: Kategorisierung **Thema:** HTTP Status-Codes – Bedeutung der ersten Ziffer **Punkte:** 2 **Typ:** `[MATCH]` @@ -502,7 +537,7 @@ Ordne jeder ersten Ziffer eines HTTP-Status-Codes ihre Bedeutung zu. |---|---| | 2xx | Erfolg – die Anfrage wurde erfolgreich verarbeitet | | 3xx | Weiterleitung – die Ressource wurde verschoben | -| 4xx | Client-Fehler – die Anfrage des Nutzers war fehlerhaft | +| 4xx | Client-Fehler – die Anfrage des NutzerInnens war fehlerhaft | | 5xx | Server-Fehler – der Server hat ein Problem | > **Feedback:** Die erste Ziffer = Kategorie. 200 OK, 301 Moved, 404 Not Found, 503 Service Unavailable – die Kategorie sagt dir sofort, wo das Problem liegt. @@ -514,7 +549,7 @@ Ordne jeder ersten Ziffer eines HTTP-Status-Codes ihre Bedeutung zu. **Punkte:** 1 **Typ:** `[MC]` -Du rufst eine Webseite auf und erhältst `HTTP/1.1 503 Service Unavailable`. Was bedeutet das? +Du rufst eine Webseite auf und erhältst `HTTP/2 503 Service Unavailable`. Was bedeutet das? - [ ] Du hast die falsche URL eingegeben. - [ ] Der Server hat die Anfrage erfolgreich umgeleitet. @@ -534,7 +569,7 @@ Du erhältst einen 404-Fehler. Wer ist für die Ursache verantwortlich? - [ ] Der Server ist abgestürzt. - [ ] Das Internet ist ausgefallen. -- [x] **Der Client (Nutzer) – eine URL wurde angefordert, die nicht existiert (Tippfehler oder veralteter Link).** ✅ +- [x] **Der Client (NutzerInnen) – eine URL wurde angefordert, die nicht existiert (Tippfehler oder veralteter Link).** ✅ - [ ] Der DNS-Server konnte den Namen nicht auflösen. > **Feedback:** 4xx = Client-Fehler. Der Server funktioniert perfekt, er sagt nur: „Das, was du anforderst, habe ich nicht." @@ -569,7 +604,8 @@ Erkläre, warum HTTP-Status-Codes aus einer dreistelligen Zahl bestehen und was > **Musterlösung:** Die erste Ziffer kategorisiert die Antwort: 2xx = Erfolg, 3xx = Weiterleitung, 4xx = Client-Fehler, 5xx = Server-Fehler. Die restlichen zwei Ziffern spezifizieren den genauen Fall. Beispiele: 200 OK (Erfolg), 404 Not Found (Client-Fehler), 500 Internal Server Error (Server-Fehler). Diese Struktur ermöglicht es, allein aus dem Code zu verstehen, ob und wo ein Problem liegt – ohne die Antwort ganz lesen zu müssen. --- ---- + + ## BLOCK D – DNS @@ -628,7 +664,8 @@ Der DNS-Server übersetzt einen [[1:Domain-Namen]] in eine [[2:IP-Adresse]]. Die > **Feedback:** Die vier Lücken beschreiben den DNS-Ablauf vollständig: Was wird übersetzt, in was, wann, und warum. --- ---- + + ## BLOCK E – Der Gesamtablauf (Zusammen) @@ -666,9 +703,7 @@ Du gibst eine URL ein. Welche Reihenfolge ist korrekt? > **Feedback:** DNS immer zuerst. Dann TCP (Verbindung). Dann HTTP (Anfrage/Antwort). --- - ---- ---- + ## BLOCK F – HTML-Grundlagen @@ -679,14 +714,14 @@ Du gibst eine URL ein. Welche Reihenfolge ist korrekt? **Punkte:** 2 **Typ:** `[MC]` -Ein Student platziert `` und `<meta name="description">` im `<body>` statt im `<head>`. Welche zwei Konsequenzen hat das? +Eine studierende Person platziert den `<title>` und `<meta name="description">` im `<body>` statt im `<head>`. Welche zwei Konsequenzen hat das? - [ ] Kein Problem – Browser ignorieren die Unterscheidung. - [x] **(1) Der Browser-Tab zeigt keinen Titel an. (2) Suchmaschinen haben keine Beschreibung für das Snippet → schlechte SEO, Screen-Reader können die Seite nicht richtig vorlesen.** ✅ - [ ] (1) Der Titel wird im Seiteninhalt sichtbar angezeigt. (2) Die description wird als Text auf der Seite eingeblendet. - [ ] Nur das Fehlen von `<meta charset>` ist ein Problem. -> **Feedback:** `<head>` = Metadaten (unsichtbar für den Nutzer, sichtbar für Browser/Maschinen). `<body>` = sichtbarer Inhalt. Title und description im Body werden nicht als Metadaten interpretiert. +> **Feedback:** `<head>` = Metadaten (unsichtbar für die NutzerInnen, sichtbar für Browser/Maschinen). `<body>` = sichtbarer Inhalt. Title und description im Body werden nicht als Metadaten interpretiert. --- @@ -706,7 +741,7 @@ Ordne jedem Element zu, ob es in `<head>` oder `<body>` gehört. | `<p>Text hier</p>` | `<body>` | | `<link rel="stylesheet">` | `<head>` | -> **Feedback:** `<head>` = alles, was der Nutzer nicht direkt sieht (Metadaten, Styles, Titel). `<body>` = alles, was im Browser-Fenster angezeigt wird. +> **Feedback:** `<head>` = alles, was der NutzerInnen nicht direkt sieht (Metadaten, Styles, Titel). `<body>` = alles, was im Browser-Fenster angezeigt wird. --- @@ -725,7 +760,8 @@ Was ist die konkrete Konsequenz, wenn `<meta charset="UTF-8">` fehlt oder falsch > **Feedback:** Ohne charset nutzt der Browser oft einen Standard wie Latin-1. Bei UTF-8-gespeicherten Dateien → Umlaute und Emojis werden falsch dargestellt (Mojibake). --- ---- + +<!-- _class: lead --> ## BLOCK G – CSS @@ -753,9 +789,6 @@ Ein Element `<p class="highlight" id="main">` wird angezeigt. Welche Farbe? --- ---- - - ### G2 – Responsive Design: Mobile First – Welche Farbe? **Thema:** CSS Media Queries – Mobile First @@ -778,6 +811,8 @@ Welche Farbe bei 900 px Breite? --- +<!-- _class: disable --> + ### G3 – Desktop First: `max-width` erkläre **Thema:** CSS Media Queries – Desktop First **Punkte:** 1 @@ -801,10 +836,11 @@ Wie würde eine Media Query für „Desktop First" aussehen (Standard ist Deskto Erkläre den Unterschied zwischen „Mobile First" und „Desktop First" beim Responsive Design. Welche Media-Query-Eigenschaft nutzt jeder Ansatz, und warum? -> **Musterlösung:** Mobile First: Das Basis-CSS ist für kleine Bildschirme (Handy). Mit `min-width` werden schrittweise Anpassungen für größere Bildschirme hinzugefügt („ab dieser Breite"). Desktop First: Das Basis-CSS ist für große Bildschirme. Mit `max-width` werden Ausnahmen für kleinere Geräte definiert (「bis zu dieser Breite"). Mobile First wird bevorzugt, weil die Mehrheit der Nutzer mobil zugreift und es forced-mobile-first die Grundlage für progressive Enhancement bietet. +> **Musterlösung:** Mobile First: Das Basis-CSS ist für kleine Bildschirme (Handy). Mit `min-width` werden schrittweise Anpassungen für größere Bildschirme hinzugefügt („ab dieser Breite"). Desktop First: Das Basis-CSS ist für große Bildschirme. Mit `max-width` werden Ausnahmen für kleinere Geräte definiert (「bis zu dieser Breite"). Mobile First wird bevorzugt, weil die Mehrheit der NutzerInnen mobil zugreift und es forced-mobile-first die Grundlage für progressive Enhancement bietet. --- ---- + +<!-- _class: lead --> ## BLOCK H – Barrierefreiheit @@ -835,10 +871,10 @@ Ordne jedem Eingabegerät seine Nutzungsweise zu. **Punkte:** 2 **Typ:** `[MC]` -Ein Nutzer kann aktuell nur mit einer Hand sein Handy bedienen, weil er das Baby auf dem Arm trägt. Wie klassifiziert man diese Einschränkung? +Eine NutzerInnen kann aktuell nur mit einer Hand sein Handy bedienen, weil er das Baby auf dem Arm trägt. Wie klassifiziert man diese Einschränkung? - [ ] Permanent – das ist eine bleibende körperliche Behinderung. -- [ ] Temporär – der Nutzer ist verletzt und braucht Zeit zum Heilen. +- [ ] Temporär – der NutzerInnen ist verletzt und braucht Zeit zum Heilen. - [x] **Situativ – die Einschränkung entsteht durch die aktuelle Umgebung/Situation, nicht durch eine Behinderung.** ✅ - [ ] Diese Art von Einschränkung existiert nicht – Barrierefreiheit betrifft nur Menschen mit Behinderung. @@ -846,6 +882,8 @@ Ein Nutzer kann aktuell nur mit einer Hand sein Handy bedienen, weil er das Baby --- +<!-- _class: disable --> + ### H3 – Curb-Cut-Effekt: Beispiel identifizieren **Thema:** Barrierefreiheit – Curb-Cut-Effekt **Punkte:** 1 @@ -862,14 +900,16 @@ Welches Beispiel demonstriert den Curb-Cut-Effekt? --- -### H4 – Curb-Cut-Effekt: Erkläre +<!-- _class: disable --> + +### H4 – Curb-Cut-Effekt: Erklärung **Thema:** Barrierefreiheit – Curb-Cut-Effekt Transfer **Punkte:** 2 **Typ:** `[ESSAY]` Erkläre das Konzept des Curb-Cut-Effekts. Nenne zwei konkrete Web-Beispiele und erkläre jeweils, wer die ursprüngliche Zielgruppe war und wer sonst davon profitiert. -> **Musterlösung:** Der Curb-Cut-Effekt beschreibt, wie eine Maßnahme für Menschen mit Behinderung am Ende allen zugute kommt – wie die Bordsteinabsenkung, die für Rollstuhlfahrer gedacht war, aber auch Kinderwagen, Rollkoffer und Fahrrädern helft. Web-Beispiele: (1) Untertitel – primär für Gehörlose, helfen auch in lauter Umgebung oder beim Sprachlernen. (2) Alt-Texte – primär für Screen-Reader-Nutzer, helfen auch Suchmaschinen (SEO). +> **Musterlösung:** Der Curb-Cut-Effekt beschreibt, wie eine Maßnahme für Menschen mit Behinderung am Ende allen zugute kommt – wie die Bordsteinabsenkung, die für Rollstuhlfahrer gedacht war, aber auch Kinderwagen, Rollkoffer und Fahrrädern helft. Web-Beispiele: (1) Untertitel – primär für Gehörlose, helfen auch in lauter Umgebung oder beim Sprachlernen. (2) Alt-Texte – primär für Screen-Reader-NutzerInnen, helfen auch Suchmaschinen (SEO). --- @@ -889,12 +929,12 @@ Was ist der European Accessibility Act (EAA)? --- -### H6 – Barrierefreiheit: Warum auch für „normale" Nutzer? +### H6 – Barrierefreiheit: Warum auch für „normale" NutzerInnen? **Thema:** Barrierefreiheit – Business Case **Punkte:** 2 **Typ:** `[ESSAY]` -Erkläre, warum barrierefreie Gestaltung nicht nur für Menschen mit Behinderung wichtig ist, sondern auch einen praktischen Nutzen für alle Nutzer hat. Nenne mindestens zwei konkrete Beispiele. +Erkläre, warum barrierefreie Gestaltung nicht nur für Menschen mit Behinderung wichtig ist, sondern auch einen praktischen Nutzen für alle NutzerInnen hat. Nenne mindestens zwei konkrete Beispiele. > **Musterlösung:** Barrierefreiheit verbessert die UX für alle: (1) SEO – Alt-Texte und semantisches HTML helfen Suchmaschinen, die Seite besser zu verstehen → besseres Ranking. (2) Mobile – viele barrierefreie Prinzipien (z. B. große Tippflächen, guter Kontrast) sind auch für Mobilgeräte im Sonnenlicht wichtig. (3) Ältere Menschen – Sehschwäche, motorische Einschränkungen betreffen einen großen Anteil der Bevölkerung. Der Markt: ~15% Menschen mit Behinderung + ~20% ältere Menschen. @@ -912,10 +952,12 @@ Du willst eine Webseite auf Barrierefreiheit testen, ohne assistive Technologie - [ ] Du installierst einen Screenreader und lässt die Seite vorlesen. - [ ] Du öffnest den Quellcode und zählst die barrierefreien Tags. -> **Feedback:** Der Tastatur-Test ist der schnellste barrierefreie Selbsttest: Nur Tab + Enter benutzen. Wenn man so eine Funktion nicht erreicht kann, ist sie für Tastatur-Nutzer (und damit auch für Screenreader-Nutzer) nicht zugänglich. Tools wie axe DevTools oder Lighthouse automatisieren ~30% der Checks. +> **Feedback:** Der Tastatur-Test ist der schnellste barrierefreie Selbsttest: Nur Tab + Enter benutzen. Wenn man so eine Funktion nicht erreicht kann, ist sie für Tastatur-NutzerInnen (und damit auch für Screenreader-NutzerInnen) nicht zugänglich. Tools wie axe DevTools oder Lighthouse automatisieren ~30% der Checks. --- +<!-- _class: lead --> + ## BLOCK I – Zusammenfassung-Fragen (Übergreifend) --- @@ -925,7 +967,7 @@ Du willst eine Webseite auf Barrierefreiheit testen, ohne assistive Technologie **Punkte:** 3 **Typ:** `[ESSAY]` -Ein Nutzer klickt auf einen „Neuen Eintrag erstellen"-Button einer Webanwendung. Beschreibe vom Klick bis zur Antwort des Servers, welche Protokolle beteiligt sind und welche HTTP-Methode verwendet wird. +Ein NutzerInnen klickt auf einen „Neuen Eintrag erstellen"-Button einer Webanwendung. Beschreibe vom Klick bis zur Antwort des Servers, welche Protokolle beteiligt sind und welche HTTP-Methode verwendet wird. > **Musterlösung:** (1) Der Browser sendet eine HTTP-Anfrage. Da es sich um eine neue Ressource handelt, nutzt er POST. (2) Vorher: DNS löst den Domain-Namen auf. (3) TCP-Handshake stellt die Verbindung her. (4) POST-Anfrage wird gesendet (Daten im Body). (5) Server verarbeitet, erstellt den Eintrag, antwortet mit 201 Created. @@ -941,9 +983,7 @@ Du rufst eine Webseite auf und erhältst eine Fehlermeldung. Beschreibe drei ver > **Musterlösung:** (1) DNS-Fehler: „Der Server wurde nicht gefunden" → DNS konnte den Namen nicht auflösen (z. B. Tippfehler in der URL oder DNS-Server nicht erreichbar). (2) TCP-Fehler: „Die Verbindung wurde verweigert" → Server existiert (IP bekannt), akzeptiert aber keine Verbindung (nicht gestartet, Port blockiert). (3) HTTP-Fehler: 404 → TCP-Verbindung erfolgreich, aber die angeforderte Ressource existiert nicht auf dem Server. --- - ---- ---- +<!-- _class: lead --> ## BLOCK J – Dateiformate: Grundbegriffe @@ -1066,12 +1106,8 @@ Ordne zu: Container oder Codec? |---|---| | MP4 | Container | | H.264 | Codec | -| MKV | Container | -| AAC | Codec | | WebM | Container | | AV1 | Codec | -| VP9 | Codec | - > **Feedback:** Container = Dateiformat, das Streams zusammenpackt (MP4, MKV, WebM). Codec = Kompressionsalgorithmus für einen bestimmten Stream (H.264, AV1, AAC). --- @@ -1088,14 +1124,6 @@ Verlustfreie und verlustbehaftete Kompression arbeiten nach unterschiedlichen Pr | Redundanz entfernen (wiederholende Muster kompakter darstellen) | Verlustfrei | | Irrelevanz entfernen (für Menschen nicht wahrnehmbar) | Verlustbehaftet | -**Zusätzlich:** Welches Beispiel passt zu welchem Prinzip? - -| Beispiel | Prinzip | -|---|---| -| „AAAA" wird zu „4×A" (Run-Length Encoding) | Redundanz | -| Hohe Frequenzen in einem Foto werden weggeworfen – das Auge merkt es kaum | Irrelevanz | -| Psychoakustik bei MP3: Töne maskieren andere Töne | Irrelevanz | - > **Feedback:** Der Kernunterschied: Verlustfrei arbeitet mit Redundanz – Wiederholungen werden kompakter gespeichert, aber nichts geht verloren. Verlustbehaftet arbeitet mit Irrelevanz – Daten werden weggeworfen, die Menschen sowieso nicht wahrnehmen können (Psychovisuell bei Bildern, Psychoakustisch bei Audio). --- @@ -1117,7 +1145,8 @@ Sortiere die Dateneinheiten von kleinster zu größter: > **Feedback:** Jede Stufe = Faktor 1.000 (SI-Präfixe). Merkhilfe: „Komm Mit Großem Tee, Peter". Ein einzelnes Foto (12 MP, unkomprimiert) ≈ 36 MB. Ein FullHD-Kinofilm ≈ 1 GB. Ein 4K-Film pro Minute unkomprimiert ≈ 44 GB. --- ---- + +<!-- _class: lead --> ## BLOCK K – Bildformate & Raster vs. Vektor @@ -1268,7 +1297,8 @@ Ordne jedem Interpolationsverfahren seine Eigenschaft zu. > **Feedback:** Bei der Wahl: Pixel-Art → Nearest Neighbor (soll pixelig bleiben). Normale Bilder → Bilinear oder Bicubic. Maximale Qualität bei Fotos → Lanczos. --- ---- + +<!-- _class: lead --> ## BLOCK L – JPEG: Innenleben @@ -1298,7 +1328,7 @@ JPEG ist ein … Wie nutzt JPEG die Schwächen des menschlichen Auges aus? - [ ] Das Auge kann keine Farben wahrnehmen – daher werden Farben komplett entfernt. -- [x] **Das Auge sieht Helligkeit besser als Farbe. JPEG behält die Helligkeit (Y) voll auf, reduziert aber die Farbauflösung (Cb, Cr) – der Verlust wird kaum wahrgenommen.** ✅ +- [x] **Das Auge sieht Helligkeit besser als Farbe. JPEG behält die Helligkeit (Y) nahezu vollständig, reduziert aber die Farbauflösung (Cb, Cr) – der Verlust wird kaum wahrgenommen.** ✅ - [ ] Das Auge kann keine Details sehen – daher werden alle Details entfernt. - [ ] JPEG nutzt keine Wahrnehmungsforschung, komprimiert rein mathematisch. @@ -1421,22 +1451,7 @@ Ordne jedem JPEG-Artefakt seine Beschreibung zu. --- -### L10 – JPEG Quality: Sweet Spot -**Thema:** JPEG – Praktische Qualitätswahl -**Punkte:** 1 -**Typ:** `[MC]` - -Bei welcher JPEG-Quality sind Artefakte für die meisten Menschen kaum sichtbar, aber die Datei trotzdem deutlich kleiner? - -- [ ] Quality 30 – hier beginnt die Kompression erst. -- [ ] Quality 100 – nur hier ist JPEG verlustfrei. -- [x] **Quality 85–90 – etwa 10× Kompression, für Menschen kaum unterscheidbar vom Original.** ✅ -- [ ] Quality 50 – der optimale Kompromiss für alle Anwendungen. - -> **Feedback:** Quality 85–90 = der „Sweet Spot". Quality 100 ≠ verlustfrei (immer noch lossy!). Für Web/Social Media: 60–80 oft ausreichend. Für Archivierung: 90–100 oder besser PNG/RAW. - ---- ---- +<!-- _class: lead --> ## BLOCK M – Bildformate: PNG, GIF, WebP, SVG @@ -1527,19 +1542,22 @@ Ordne jedem Szenario das optimale Bildformat zu. | Szenario | Format | |---|---| | Ein Foto für eine Webseite (klein, OK-Qualität) | JPEG | -| Ein Screenshot einer Benutzeroberfläche | PNG | +| Ein Screenshot einer BenutzerInnenoberfläche | PNG | | Ein Logo, das auf allen Bildschirmgrößen scharf sein muss | SVG | | Ein animiertes Reaktionsbild für einen Chat | GIF | > **Feedback:** JPEG = Fotos (klein, lossy OK). PNG = Screenshots, Grafiken mit Transparenz (verlustfrei). SVG = Logos, Icons (skalierbar). GIF = Animationen (256 Farben, aber Animations-Support). --- ---- + +<!-- _class: lead --> ## BLOCK N – Video-Kompression --- +<!-- _class: disable --> + ### N1 – Spatial vs. Temporal Compression **Thema:** Video – Kompressionsprinzipien **Punkte:** 2 @@ -1557,6 +1575,8 @@ Ordne jedem Prinzip seine Beschreibung zu. --- +<!-- _class: disable --> + ### N2 – I-Frame, P-Frame, B-Frame: Was ist was? **Thema:** Video – Frame-Typen **Punkte:** 2 @@ -1574,6 +1594,8 @@ Ordne jedem Frame-Typ seine Beschreibung zu. --- +<!-- _class: disable --> + ### N3 – Was passiert, wenn ein I-Frame beschädigt ist? **Thema:** Video – I-Frame Bedeutung Transfer **Punkte:** 2 @@ -1585,6 +1607,8 @@ Erkläre, warum ein I-Frame bei der Videogespeicherung so wichtig ist. Was passi --- +<!-- _class: disable --> + ### N4 – Motion Compensation: Prinzip **Thema:** Video – Motion Compensation **Punkte:** 1 @@ -1601,6 +1625,8 @@ Was beschreibt ein Motion Vector bei der Videogespeicherung? --- +<!-- _class: disable --> + ### N5 – Video-Codecs: Zeitstrahl **Thema:** Video – Codecs-Übersicht **Punkte:** 2 @@ -1627,12 +1653,15 @@ Erkläre, warum AV1 als „die Zukunft" der Videogespeicherung gilt. Nenne minde > **Musterlösung:** AV1 (2018) ist royalty-free und open source – die Alliance for Open Media vereint Google, Netflix, Amazon, Apple, Mozilla. Es liefert 30% bessere Kompression als H.265 und unterstützt 8K, HDR, hohe Frame-Rates. H.265 scheitert vor allem am Patent-Chaos: Drei konkurrierende Patent-Pools (MPEG-LA, HEVC Advance, Velos Media) erzeugen rechtliche Unsicherheit und unklare Kosten → viele Unternehmen bleiben bei H.264 oder wechseln direkt zu AV1. --- ---- + +<!-- _class: lead --> ## BLOCK O – Speichermedien & Schnittstellen --- +<!-- _class: disable --> + ### O1 – KB vs. KiB: Was ist der Unterschied? **Thema:** Speicher – Einheiten **Punkte:** 2 @@ -1649,6 +1678,8 @@ Eine Festplatte wird als „1 TB" vermarktet, aber Windows zeigt nur ~931 GB an. --- +<!-- _class: disable --> + ### O2 – HDD vs. SSD: Kern-Unterschied **Thema:** Speichermedien – HDD vs. SSD **Punkte:** 1 @@ -1665,6 +1696,8 @@ Was ist der fundamentale technische Unterschied zwischen HDD und SSD? --- +<!-- _class: disable --> + ### O3 – HDD vs. SSD: Eigenschaften zuordnen **Thema:** Speichermedien – Vergleich **Punkte:** 2 @@ -1685,6 +1718,8 @@ Ordne jeder Eigenschaft zu: HDD oder SSD? --- +<!-- _class: disable --> + ### O4 – USB-C: Stecker oder Protokoll? **Thema:** Schnittstellen – USB-C **Punkte:** 2 @@ -1701,6 +1736,8 @@ Ein USB-C-Kabel kann langsam sein, obwohl es wie ein „modernes" Kabel aussieht --- +<!-- _class: disable --> + ### O5 – Dateisysteme: Zuordnung **Thema:** Dateisysteme – Überblick **Punkte:** 2 @@ -1720,6 +1757,8 @@ Ordne jedem Dateisystem seine ideale Anwendung zu. --- +<!-- _class: disable --> + ### O6 – FAT32: Warum nicht für große Dateien? **Thema:** Dateisysteme – FAT32 Limitation **Punkte:** 1 @@ -1747,6 +1786,8 @@ Erkläre die 3-2-1-Regel für Backups. Begründe, warum jede der drei Ziffern wi --- +<!-- _class: disable --> + ### O8 – Backup-Arten: Unterschiede **Thema:** Backup – Typen **Punkte:** 2 @@ -1761,8 +1802,3 @@ Ordne jedem Backup-Typ seine Beschreibung zu. | Differenziell | Änderungen seit dem letzten Voll-Backup – Mittelweg zwischen beiden | > **Feedback:** Typisches Schema: Sonntag Full, Mo–Sa Inkrementell oder Differenziell. Inkrementell = schnellstes Backup, langsamste Wiederherstellung (Kette aufbauen). Full = langsamstes Backup, schnellste Wiederherstellung. - ---- - -> **Ende des Katalogs – Aktuell: 105 Fragen across 15 Blöcke.** -> Abgedeckte Themen: Von-Neumann, TCP/IP, HTTP, DNS, Gesamtablauf, HTML, CSS, Barrierefreiheit, Dateiformate-Grundbegriffe (inkl. Redundanz/Irrelevanz, Codec/Container, Dateneinheiten), Bildformate (Raster/Vektor/JPEG/PNG/GIF/WebP/SVG), Video-Kompression, Speichermedien, Schnittstellen, Dateisysteme, Backup.