merge klausur-erklaerungen into test-merge

resolves all conflicts: main's content preferred for slide edits,
klausur-erklaerungen's structural additions (erklaerung slides,
klausurfragen, archive, scripts) preserved.
fixes generate-root-index.sh semester to sommersemester 2026.

archive/223015c_it_grundlagen_40pt.xml

@@ -0,0 +1,469 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<quiz>
+
+<!-- ============================================================
+     223015c – Grundlagen IT- und Internettechnik
+     40 Punkte / 40 Minuten
+     Michael Czechowski – HdM Stuttgart – WS 2025/26
+     ============================================================ -->
+
+<!-- ─── 3 pt – Von-Neumann: 5 Komponenten ─── -->
+<question type="matching">
+  <n><text>Q1 – Von-Neumann: Komponenten zuordnen</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ordne jeder Komponente der Von-Neumann-Architektur ihre
+      Funktion zu.</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Die 5 Komponenten: ALU (Rechnen), Steuerwerk (Befehle steuern), Speicherwerk (Programme UND Daten), Ein-/Ausgabe (Peripherie), Bus-System (Verbindung).</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <shuffleanswers>true</shuffleanswers>
+  <answer fraction="100"><text>Rechenwerk (ALU)</text><match>Führt arithmetische und logische Operationen durch.</match></answer>
+  <answer fraction="100"><text>Steuerwerk</text><match>Holt, dekodiert und steuert die Ausführung von Befehlen.</match></answer>
+  <answer fraction="100"><text>Speicherwerk</text><match>Enthält sowohl Programme als auch Daten (Stored Program Concept).</match></answer>
+  <answer fraction="100"><text>Ein-/Ausgabe</text><match>Schnittstelle zu externen Geräten wie Tastatur, Bildschirm, Netzwerk.</match></answer>
+  <answer fraction="100"><text>Bus-System</text><match>Verbindet alle Komponenten mittels Adress-, Daten- und Steuerbus.</match></answer>
+</question>
+
+<!-- ─── 2 pt – Von-Neumann vs Harvard: Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q2 – Von-Neumann vs. Harvard</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ein Arduino-Mikrocontroller nutzt die <strong>Harvard-Architektur</strong>.
+      Ein modernes Smartphone nutzt eine (modifizierte) Von-Neumann-Architektur.</p>
+      <p><strong>Warum ist die Harvard-Architektur für Echtzeit-Anwendungen
+      auf dem Arduino vorteilhafter, und was wäre der Nachteil, wenn
+      das Smartphone diese Architektur verwenden würde?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Harvard: separate Code/Daten-Speicher → paralleler Zugriff, schneller. Nachteil: Code und Daten nicht aus gleichem Speicher nahtlos mischbar → weniger Flexibilität, kein „Laden beliebiger Apps" wie bei Von-Neumann.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – Speed vs. Flexibilität.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was getrennte Speicher für Code und Daten bedeuten.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Harvard nutzt <strong>separate Speicher</strong> für Code und Daten → paralleler Zugriff, schneller. Beim Smartphone wäre es schwieriger, beliebige Apps zu laden – weniger Flexibilität.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Harvard ist langsamer, aber sicherer – daher für Echtzeit geeignet. Smartphones brauchen die Geschwindigkeit nicht.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Beide Architekturen sind funktional identisch – der Unterschied liegt nur im Gehäuse.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Von-Neumann ist schneller durch gemeinsamen Speicher. Harvard wird gewählt, weil Echtzeit-Apps weniger Speicher brauchen.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – Stored Program Concept Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q3 – Stored Program Concept</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Vor der Von-Neumann-Architektur mussten bei Maschinen wie dem
+      ENIAC Programme durch <strong>Umstecken von Kabeln</strong> eingegeben
+      werden.</p>
+      <p><strong>Was konkret ermöglicht das Stored Program Concept, was
+      vorher nicht möglich war? Nenne zwei Beispiele.</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Stored Program: Programme werden als Daten im Speicher abgelegt → austauschbar ohne Hardwareänderung. Ermöglicht: Betriebssysteme, Apps installieren/löschen, Multitasking, Updates.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – Programme als Daten im Speicher = Flexibilität.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – der Kern liegt darin, dass Programme im Speicher als Daten residieren.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Programme werden als <strong>Daten im Speicher</strong> abgelegt → z. B. Apps können installiert/gelöscht werden und <strong>Multitasking</strong> (mehrere Programme gleichzeitig) wird möglich.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Programme werden auf separater Hardware gespeichert → die Hauptspeicher-Kapazität wird ums Doppelte gesteigert.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Die Hardware kann jetzt selbst Befehle erfinden – kein Mensch muss mehr programmieren.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Nur ein einzelnes Programm kann gleichzeitig laufen, aber es kann schneller geladenen werden.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – HTML Metadaten: Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q4 – HTML: &lt;head&gt; vs. &lt;body&gt;</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ein Student erstellt eine Webseite und platziert <em>alles</em>
+      im <code>&lt;body&gt;</code> – auch den <code>&lt;title&gt;</code>
+      und die <code>&lt;meta name="description"&gt;</code>.</p>
+      <p><strong>Welche zwei konkreten Konsequenzen hat das?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>title und meta description gehören in &lt;head&gt;. Im &lt;body&gt;: (1) kein Titel im Browser-Tab / Suchergebnis, (2) keine Beschreibung für Suchmaschinen/Screen-Reader → SEO und Accessibility beeinträchtigt.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – Metadaten im Body werden nicht als solche interpretiert.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – &lt;head&gt; und &lt;body&gt; haben spezifische Funktionen.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[(1) Der Browser-Tab zeigt <strong>keinen Titel</strong> an. (2) Suchmaschinen haben <strong>keine Beschreibung</strong> für das Snippet → schlechte SEO und Screen-Reader können die Seite nicht richtig vorlesen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Kein Problem – Browser ignorieren die Unterscheidung zwischen <code>&lt;head&gt;</code> und <code>&lt;body&gt;</code>.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[(1) Der Titel wird im Seiteninhalt sichtbar angezeigt. (2) Die description wird als Text auf der Seite eingeblendet.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Nur das Fehlen von <code>&lt;meta charset&gt;</code> ist ein Problem – title und description funktionieren überall.]]></text></answer>
+</question>
+
+<!-- ─── 3 pt – Accessibility Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q5 – Barrierefreiheit: Curb-Cut-Effekt</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Der <strong>Curb-Cut-Effekt</strong> beschreibt, wie eine
+      barrierefreie Lösung – ursprünglich für Menschen mit Behinderung –
+      letztendlich <em>allen</em> zugute kommt.</p>
+      <p><strong>Nenne ein konkretes Web-Beispiel, das diesen Effekt
+      demonstriert, und erkläre, wer davon profitiert.</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Beispiel: Untertitel (für Gehörlose) → helfen auch in lauter Umgebung, beim Sprachlernen, bei Ton aus. Alt-Texte (für Screen-Reader) → helfen auch SEO. Semantisches HTML → besser für alle.</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – Barrierefreiheit hilft allen.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, welche barrierefreien Maßnahmen auch Menschen ohne Behinderung nutzen.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>Untertitel:</strong> Gedacht für Gehörlose, helfen aber auch in lauter Umgebung, beim Sprachlernen oder wenn der Ton aus ist – profitiert fast jedermann.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Barrierefreie Webseiten sind langsamer zu laden – der Curb-Cut-Effekt beschreibt diesen negativen Nebeneffekt.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der Curb-Cut-Effekt bedeutet, dass barrierefreie Seiten nur für Menschen mit Behinderung nützlich sind.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Dark Mode:</strong> Gedacht für Sehbehinderung, hilft auch in dunkler Umgebung – Beispiel für den Curb-Cut-Effekt.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – EAA / WCAG ─── -->
+<question type="multichoice">
+  <n><text>Q6 – European Accessibility Act</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Der <strong>European Accessibility Act (EAA)</strong> ist seit
+      Juni 2025 in Kraft.</p>
+      <p><strong>Was bedeutet das konkret für ein deutsches
+      E-Commerce-Unternehmen, das eine Webseite betreibt?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>EAA verpflichtet u. a. E-Commerce-Anbieter zur Barrierefreiheit. Die Webseite muss WCAG-Standards erfüllen. Bei Verstoß: Bußgelder bis 100.000 € möglich.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – rechtliche Pflicht zur Barrierefreiheit.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – der EAA erstellt eine rechtliche Verpflichtung für bestimmte Sektoren.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Die Webseite <strong>muss barrierefreiheitstechnisch</strong> WCAG-Standards erfüllen – E-Commerce ist explizit im EAA geregelt. Bei Verstoß: Bußgelder möglich.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der EAA betrifft nur öffentliche Behörden – private Unternehmen sind ausgenommen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Das Unternehmen muss nur eine englische Version der Webseite bereitstellen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der EAA regelt nur die Barrierefreiheit von mobilen Apps, nicht von Webseiten.]]></text></answer>
+</question>
+
+<!-- ─── 3 pt – TCP/IP Schichten: Protokoll → Schicht ─── -->
+<question type="matching">
+  <n><text>Q7 – TCP/IP: Protokoll → Schicht</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ordne jedem Protokoll die richtige TCP/IP-Schicht zu.</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Anwendung: HTTP, DNS, SMTP. Transport: TCP, UDP. Internet: IP. Netzzugang: Ethernet, WLAN.</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <shuffleanswers>true</shuffleanswers>
+  <answer fraction="100"><text>HTTP</text><match>Anwendung</match></answer>
+  <answer fraction="100"><text>TCP</text><match>Transport</match></answer>
+  <answer fraction="100"><text>IP</text><match>Internet</match></answer>
+  <answer fraction="100"><text>Ethernet</text><match>Netzzugang</match></answer>
+  <answer fraction="100"><text>DNS</text><match>Anwendung</match></answer>
+  <answer fraction="100"><text>UDP</text><match>Transport</match></answer>
+</question>
+
+<!-- ─── 3 pt – Encapsulation: D-S-P-F ─── -->
+<question type="matching">
+  <n><text>Q8 – Encapsulation: Dateneinheit → Schicht</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Bei der Übertragung wird eine Nachricht von Schicht zu Schicht
+      verpackt (Encapsulation). Ordne jeder Dateneinheit die zugehörige
+      Schicht zu.</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Daten (Anwendung) → Segment (Transport, +Ports) → Paket (Internet, +IP) → Frame (Netzzugang, +MAC). Merkhilfe: D-S-P-F.</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <shuffleanswers>true</shuffleanswers>
+  <answer fraction="100"><text>Daten</text><match>Anwendungsschicht – die eigentliche Nachricht (z. B. HTML-Seite).</match></answer>
+  <answer fraction="100"><text>Segment</text><match>Transportschicht – Daten + Ports und Sequenznummern.</match></answer>
+  <answer fraction="100"><text>Paket</text><match>Internetschicht – Segment + IP-Adressen (Quelle und Ziel).</match></answer>
+  <answer fraction="100"><text>Frame</text><match>Netzzugangsschicht – Paket + MAC-Adressen und Prüfsumme.</match></answer>
+</question>
+
+<!-- ─── 3 pt – IP vs MAC vs Port Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q9 – IP vs. MAC vs. Port: Transfer-Szenario</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Dein Laptop sendet eine HTTPS-Anfrage an einen Webserver in
+      einem anderen Land. Das Paket durchläuft mehrere Router.</p>
+      <p><strong>Welche der folgenden Aussagen über die Adressen auf dem
+      Weg ist korrekt?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>IP-Adresse des Ziel-Servers bleibt konstant (global). MAC-Adresse ändert sich bei jedem Hop (lokal, nächster Router). Port 443 (HTTPS) bleibt konstant.</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – nur MAC ändert sich unterwegs.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, welche Adresse bei jedem Hop neu gesetzt wird.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Die <strong>IP-Adresse</strong> des Servers bleibt konstant, der <strong>Port</strong> (443) ändert sich nicht – die <strong>MAC-Adresse</strong> wird an jedem Router neu gesetzt (lokal, ein Hop).]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Alle drei Adressen (IP, MAC, Port) ändert sich bei jedem Router.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Die MAC-Adresse bleibt konstant, die IP-Adresse ändert sich bei jedem Hop.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[IP und Port ändert sich, MAC bleibt konstant – MAC ist die globale Adresse.]]></text></answer>
+</question>
+
+<!-- ─── 3 pt – 3-Way Handshake: Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q10 – TCP 3-Way-Handshake: Was passiert wäre?</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Der Client sendet ein <strong>SYN</strong> zum Server.
+      Das SYN-Paket geht verloren – es erreicht den Server nie.</p>
+      <p><strong>Was passiert als nächstes, und warum wird keine
+      Verbindung aufgebaut?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Der Server erhält kein SYN → sendet kein SYN-ACK zurück → der Client bekommt keine Antwort → Verbindung wird nicht aufgebaut. TCP wird das SYN nach einem Timeout erneut senden (Neuübertragung).</text></generalfeedback>
+  <defaultgrade>3</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – ohne SYN beim Server: kein SYN-ACK, kein Handshake.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was der Server ohne SYN tun kann.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Der Server kennt die Anfrage nicht → sendet <strong>kein SYN-ACK</strong> → der Client erhält keine Antwort → <strong>keine Verbindung</strong>. Der Client wird das SYN nach einem Timeout erneut senden.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der Server sendet trotzdem ein SYN-ACK, da die IP-Adresse bekannt ist – die Verbindung wird trotzdem aufgebaut.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der Client sendet direkt ein ACK als Fallback – die Verbindung wird mit zwei Paketen aufgebaut.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Das verloren gegangene SYN wird automatisch vom Netzwerk rekonstruiert – kein Problem.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – TCP vs UDP Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q11 – TCP vs. UDP: Videostreaming</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ein Videostreaming-Dienst sendet Daten an deinen Browser.
+      Ein einzelnes Paket geht verloren.</p>
+      <p><strong>Warum wählt der Dienst <strong>UDP</strong> statt TCP,
+      obwohl ein Paket verloren geht?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Bei Echtzeit-Video ist Verzögerung schlimmer als Paketverlust. TCP würde das Paket erneut anfordern → Video friert. UDP ignoriert das Verlust → kurzer Artefakt, Video läuft weiter.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – bei Echtzeit ist Verzögerung ärger als Verlust.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was TCP bei einem verlorenen Paket tun würde.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[Bei <strong>Echtzeit</strong> ist Verzögerung schlimmer als Verlust. TCP würde das Paket <strong>erneut anfordern</strong> → Video friert ein. UDP ignoriert es → kurzer Glitch, Video läuft weiter.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[UDP sendet jedes Paket doppelt, daher geht statistisch nie etwas verloren.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[TCP kann bei Videostreaming nicht verwendet werden, da es zu langsam für Multimedia ist.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[UDP ist immer schneller als TCP – deshalb nutzt jeder Streaming-Dienst UDP.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – HTTP Methoden: Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q12 – HTTP-Methoden: Szenario</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ein Nutzer aktualisiert sein Profilbild auf einer Webseite.
+      Das Foto wird zum Server gesendet und das <strong>alte Bild
+      ersetzt</strong>.</p>
+      <p><strong>Welche HTTP-Methode wird für diese Operation verwendet,
+      und warum nicht GET?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>PUT – Daten ersetzen (eine existierende Ressource wird überschrieben). GET ruft nur Daten ab, sendet keine Daten zum Server.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – PUT für das Ersetzen einer Ressource.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was „ersetzen" in HTTP bedeutet.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>PUT</strong> – ersetzt eine existierende Ressource. GET ruft nur Daten ab und sendet <em>keine</em> Daten zum Server.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>GET</strong> – GET kann auch Daten senden, wenn eine URL mit Parameter verwendet wird.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>POST</strong> – POST ist immer für das Ersetzen von Daten zuständig.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>DELETE</strong> – DELETE sendet das neue Foto und löscht gleichzeitig das alte.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – HTTP Status-Codes Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q13 – HTTP Status-Codes: Fehlerdiagnose</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Du rufst eine Webseite auf und der Browser zeigt folgende
+      Fehlermeldung an:</p>
+      <pre>HTTP/1.1 503 Service Unavailable</pre>
+      <p><strong>Was bedeutet dieser Code, und wer ist für die Behebung
+      zuständig – du oder der Betreiber der Webseite?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>503 ist ein 5xx-Code = Server-Fehler. Der Server ist überlastet oder temporär nicht verfügbar. Verantwortung liegt beim Serverbetreiber, nicht beim Nutzer.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – 5xx = Server-Problem, nicht dein Fehler.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was die Ziffer „5" im Code bedeutet.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>Server-Fehler:</strong> Der Server ist überlastet oder temporär nicht verfügbar. Verantwortung liegt beim <strong>Betreiber</strong> – du kannst nur später erneut versuchen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Client-Fehler: Du hast die falsche URL eingegeben – ein 5xx-Code bedeutet, dass deine Anfrage falsch war.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Erfolgs-Code: 503 bedeutet, dass der Server die Anfrage erfolgreich umgeleitet hat.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der Code bedeutet, dass der Server die Seite dauerhaft verschoben hat – du muss die neue URL suchen.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – DNS Ablauf Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q14 – DNS: Rolle im Ablauf</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Du gibst <code>https://hdm-stuttgart.de</code> in die
+      Adresszeile ein.</p>
+      <p><strong>Was passiert <em>vor</em> dem TCP-Handshake, und warum
+      ist dieser Schritt zwingend nötig?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>DNS-Auflösung: Der Name „hdm-stuttgart.de" wird in eine IP-Adresse umgewandelt. TCP braucht eine IP-Adresse – names können nicht direkt verbunden werden.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – DNS vor TCP, Name → IP.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, was TCP als Zieladresse braucht.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>DNS-Auflösung:</strong> Der Name <code>hdm-stuttgart.de</code> wird in eine <strong>IP-Adresse</strong> umgewandelt. TCP kann nur zu IP-Adressen Verbindungen aufbauen, nicht zu Namen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Der Browser sendet direkt den Namen an den Server – DNS wird erst danach für die Verschlüsselung benötigt.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[DNS passiert nach dem TCP-Handshake – erst wird die Verbindung aufgebaut, dann der Name aufgelöst.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[DNS ist nur für HTTPS nötig – bei HTTP kann der Name direkt verwendet werden.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – CSS Spezifität Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q15 – CSS Spezifität: Welche Regel gewinnt?</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Gegeben folgender CSS-Code:</p>
+      <pre>
+p           { color: blue; }      /* (A) */
+.highlight  { color: green; }     /* (B) */
+#main       { color: red; }       /* (C) */
+      </pre>
+      <p>Ein Element <code>&lt;p class="highlight" id="main"&gt;Text&lt;/p&gt;</code>
+      wird angezeigt.<br>
+      <strong>Welche Farbe zeigt der Text an, und warum?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Spezifität: ID (0,1,0,0) > Klasse (0,0,1,0) > Element (0,0,0,1). Alle drei Regeln treffen das Element – ID #main gewinnt → rot.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – ID gewinnt durch höchste Spezifität.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege die Spezifitätswerte: ID > Klasse > Element.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>Rot</strong> – die ID-Regel <code>#main</code> hat die höchste Spezifität (0,1,0,0) und gewinnt über Klasse (0,0,1,0) und Element (0,0,0,1).]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Blau</strong> – die Element-Regel steht zuerst im Code und hat daher Vorrang.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Grün</strong> – Klassen-Selektoren haben immer Vorrang vor IDs.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Rot</strong> – die letzte Regel im Code gewinnt immer, unabhängig vom Selektor-Typ.]]></text></answer>
+</question>
+
+<!-- ─── 2 pt – Responsive Design Transfer ─── -->
+<question type="multichoice">
+  <n><text>Q16 – Responsive Design: Mobile First</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Ein Developer schreibt folgendes CSS:</p>
+      <pre>
+.container { background: white; }
+
+@media (min-width: 768px) {
+    .container { background: blue; }
+}
+
+@media (min-width: 1024px) {
+    .container { background: green; }
+}
+      </pre>
+      <p><strong>Welche Farbe hat <code>.container</code> bei einem
+      Bildschirm von 900 px Breite, und warum?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Mobile First: Basis = white. Bei 900px greift min-width: 768px → blue. min-width: 1024px greift NICHT (900 &lt; 1024). Ergebnis: blau.</text></generalfeedback>
+  <defaultgrade>2</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – 768px greift, 1024px nicht.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – überlege, welche min-width-Bedingungen bei 900px erfüllt sind.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>Blau</strong> – bei 900 px greift <code>min-width: 768px</code> (900 ≥ 768), aber <code>min-width: 1024px</code> greift nicht (900 &lt; 1024).]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Weiß</strong> – Media-Queries gelten nur ab 1024 px, darunter bleibt immer die Basis-Farbe.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Grün</strong> – die letzte Media-Query überschreibt immer alle vorherigen.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Weiß</strong> – bei 900 px greift keine Media-Query, da 900 zwischen den beiden Breakpoints liegt.]]></text></answer>
+</question>
+
+<!-- ─── 1 pt – Zusammen: Der Ablauf eines Klicks ─── -->
+<question type="multichoice">
+  <n><text>Q17 – Zusammen: Reihenfolge eines HTTPS-Aufrufs</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Du gibst eine URL ein. <strong>Welche Reihenfolge der Schritte
+      ist korrekt?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Korrekte Reihenfolge: (1) DNS-Auflösung, (2) TCP 3-Way-Handshake, (3) HTTP-Request (GET), (4) HTTP-Response (200 OK + HTML).</text></generalfeedback>
+  <defaultgrade>1</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – DNS → TCP → HTTP Request → HTTP Response.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – an erster Stelle steht immer die DNS-Auflösung.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[(1) DNS → (2) TCP-Handshake → (3) HTTP GET → (4) HTTP 200 OK]]></text></answer>
+  <answer fraction="0"><text><![CDATA[(1) TCP-Handshake → (2) DNS → (3) HTTP GET → (4) HTTP 200 OK]]></text></answer>
+  <answer fraction="0"><text><![CDATA[(1) HTTP GET → (2) DNS → (3) TCP-Handshake → (4) HTTP 200 OK]]></text></answer>
+  <answer fraction="0"><text><![CDATA[(1) DNS → (2) HTTP GET → (3) TCP-Handshake → (4) HTTP 200 OK]]></text></answer>
+</question>
+
+<!-- ─── 1 pt – Bonusfrage: Spezifität Edge Case ─── -->
+<question type="multichoice">
+  <n><text>Q18 – CSS: 100 Element-Selektoren vs. 1 Klasse</text></n>
+  <questiontext type="html">
+    <text><![CDATA[
+      <p>Es gibt zwei CSS-Regeln für ein <code>&lt;p&gt;</code>-Element:</p>
+      <pre>
+p p p p p p p p p p  { color: blue; }   /* 100× Element-Selektor */
+.highlight           { color: red; }    /* 1× Klasse */
+      </pre>
+      <p>Das Element hat die Klasse <code>highlight</code>.
+      <strong>Welche Farbe gewinnt?</p>
+    ]]></text>
+  </questiontext>
+  <generalfeedback type="html"><text>Eine einzelne Klasse (0,0,1,0) schlägt immer hundert Element-Selektoren (0,0,0,100). Spezifität wird nicht additiv „aufgezählt" – die Stelle zählt als Einheit.</text></generalfeedback>
+  <defaultgrade>1</defaultgrade>
+  <penalty>0.25</penalty>
+  <hidden>0</hidden>
+  <single>true</single>
+  <shuffleanswers>true</shuffleanswers>
+  <correctfeedback type="html"><text>Genau – eine Klasse gewinnt immer gegen beliebig viele Elemente.</text></correctfeedback>
+  <incorrectfeedback type="html"><text>Nein – Spezifität funktioniert nicht durch Addition innerhalb einer Stelle.</text></incorrectfeedback>
+  <answer fraction="100"><text><![CDATA[<strong>Rot</strong> – eine Klasse (0,0,1,0) gewinnt immer gegen beliebig viele Element-Selektoren (0,0,0,n). Spezifität-Stellen überschreiben sich, nicht addieren.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Blau</strong> – 100 Element-Selektoren ergeben 0,0,0,100 = höhere Spezifität als 0,0,1,0.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[<strong>Blau</strong> – die längere Regel (mehr Selektoren) hat immer höhere Spezifität.]]></text></answer>
+  <answer fraction="0"><text><![CDATA[Unentschieden – die Regeln haben exakt gleiche Spezifität.]]></text></answer>
+</question>
+
+</quiz>

archive/klausurfragen_it.md

@@ -0,0 +1,439 @@
+Here is the quiz converted into a clean, readable Markdown format. I have preserved the structure, code snippets, and feedback for each question.
+
+---
+
+# 223015c – Grundlagen IT- und Internettechnik
+
+**WS 2025/26 – Michael Czechowski – HdM Stuttgart**
+**40 Punkte / 40 Minuten**
+
+---
+
+### Q1 – Von-Neumann: Komponenten zuordnen (3 pt)
+
+**Ordne jeder Komponente der Von-Neumann-Architektur ihre Funktion zu.**
+
+* **Rechenwerk (ALU):** Führt arithmetische und logische Operationen durch.
+* **Steuerwerk:** Holt, dekodiert und steuert die Ausführung von Befehlen.
+* **Speicherwerk:** Enthält sowohl Programme als auch Daten (Stored Program Concept).
+* **Ein-/Ausgabe:** Schnittstelle zu externen Geräten wie Tastatur, Bildschirm, Netzwerk.
+* **Bus-System:** Verbindet alle Komponenten mittels Adress-, Daten- und Steuerbus.
+
+> **Feedback:** Die 5 Komponenten: ALU (Rechnen), Steuerwerk (Befehle steuern), Speicherwerk (Programme UND Daten), Ein-/Ausgabe (Peripherie), Bus-System (Verbindung).
+
+---
+
+### Q2 – Von-Neumann vs. Harvard (2 pt)
+
+**Ein Arduino-Mikrocontroller nutzt die Harvard-Architektur. Ein modernes Smartphone nutzt eine (modifizierte) Von-Neumann-Architektur.**
+
+**Warum ist die Harvard-Architektur für Echtzeit-Anwendungen auf dem Arduino vorteilhafter, und was wäre der Nachteil, wenn das Smartphone diese Architektur verwenden würde?**
+
+* [ ] Harvard ist langsamer, aber sicherer – daher für Echtzeit geeignet. Smartphones brauchen die Geschwindigkeit nicht.
+* [x] **Harvard nutzt separate Speicher für Code und Daten → paralleler Zugriff, schneller. Beim Smartphone wäre es schwieriger, beliebige Apps zu laden – weniger Flexibilität.** ✅
+* [ ] Beide Architekturen sind funktional identisch – der Unterschied liegt nur im Gehäuse.
+* [ ] Von-Neumann ist schneller durch gemeinsamen Speicher. Harvard wird gewählt, weil Echtzeit-Apps weniger Speicher brauchen.
+
+> **Feedback:** Harvard: separate Code/Daten-Speicher → paralleler Zugriff, schneller. Nachteil: Code und Daten nicht aus gleichem Speicher nahtlos mischbar → weniger Flexibilität, kein „Laden beliebiger Apps" wie bei Von-Neumann.
+
+---
+
+### Q3 – Stored Program Concept (2 pt)
+
+**Vor der Von-Neumann-Architektur mussten bei Maschinen wie dem ENIAC Programme durch Umstecken von Kabeln eingegeben werden.**
+
+**Was konkret ermöglicht das Stored Program Concept, was vorher nicht möglich war? Nenne zwei Beispiele.**
+
+* [ ] Programme werden auf separater Hardware gespeichert → die Hauptspeicher-Kapazität wird ums Doppelte gesteigert.
+* [ ] Die Hardware kann jetzt selbst Befehle erfinden – kein Mensch muss mehr programmieren.
+* [x] **Programme werden als Daten im Speicher abgelegt → z. B. Apps können installiert/gelöscht werden und Multitasking (mehrere Programme gleichzeitig) wird möglich.** ✅
+* [ ] Nur ein einzelnes Programm kann gleichzeitig laufen, aber es kann schneller geladenen werden.
+
+> **Feedback:** Stored Program: Programme werden als Daten im Speicher abgelegt → austauschbar ohne Hardwareänderung. Ermöglicht: Betriebssysteme, Apps installieren/löschen, Multitasking, Updates.
+
+---
+
+### Q4 – HTML: `<head>` vs. `<body>` (2 pt)
+
+**Ein Student erstellt eine Webseite und platziert *alles* im `<body>` – auch den `<title>` und die `<meta name="description">`.**
+
+**Welche zwei konkreten Konsequenzen hat das?**
+
+* [ ] Kein Problem – Browser ignorieren die Unterscheidung zwischen `<head>` und `<body>`.
+* [x] **(1) Der Browser-Tab zeigt keinen Titel an. (2) Suchmaschinen haben keine Beschreibung für das Snippet → schlechte SEO und 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 – title und description funktionieren überall.
+
+> **Feedback:** title und meta description gehören in `<head>`. Im `<body>`: (1) kein Titel im Browser-Tab / Suchergebnis, (2) keine Beschreibung für Suchmaschinen/Screen-Reader → SEO und Accessibility beeinträchtigt.
+
+---
+
+### Q5 – Barrierefreiheit: Curb-Cut-Effekt (3 pt)
+
+**Der Curb-Cut-Effekt beschreibt, wie eine barrierefreie Lösung – ursprünglich für Menschen mit Behinderung – letztendlich *allen* zugute kommt.**
+
+**Nenne ein konkretes Web-Beispiel, das diesen Effekt demonstriert, und erkläre, wer davon profitiert.**
+
+* [ ] Barrierefreie Webseiten sind langsamer zu laden – der Curb-Cut-Effekt beschreibt diesen negativen Nebeneffekt.
+* [ ] Der Curb-Cut-Effekt bedeutet, dass barrierefreie Seiten nur für Menschen mit Behinderung nützlich sind.
+* [x] **Untertitel: Gedacht für Gehörlose, helfen aber auch in lauter Umgebung, beim Sprachlernen oder wenn der Ton aus ist – profitiert fast jedermann.** ✅
+* [ ] **Dark Mode:** Gedacht für Sehbehinderung, hilft auch in dunkler Umgebung – Beispiel für den Curb-Cut-Effekt.
+
+> **Feedback:** Beispiel: Untertitel (für Gehörlose) → helfen auch in lauter Umgebung, beim Sprachlernen, bei Ton aus. Alt-Texte (für Screen-Reader) → helfen auch SEO. Semantisches HTML → besser für alle.
+
+---
+
+### Q6 – European Accessibility Act (2 pt)
+
+**Der European Accessibility Act (EAA) ist seit Juni 2025 in Kraft.**
+
+**Was bedeutet das konkret für ein deutsches E-Commerce-Unternehmen, das eine Webseite betreibt?**
+
+* [ ] Der EAA betrifft nur öffentliche Behörden – private Unternehmen sind ausgenommen.
+* [ ] Das Unternehmen muss nur eine englische Version der Webseite bereitstellen.
+* [x] **Die Webseite muss barrierefreiheitstechnisch WCAG-Standards erfüllen – E-Commerce ist explizit im EAA geregelt. Bei Verstoß: Bußgelder möglich.** ✅
+* [ ] Der EAA regelt nur die Barrierefreiheit von mobilen Apps, nicht von Webseiten.
+
+> **Feedback:** EAA verpflichtet u. a. E-Commerce-Anbieter zur Barrierefreiheit. Die Webseite muss WCAG-Standards erfüllen. Bei Verstoß: Bußgelder bis 100.000 € möglich.
+
+---
+
+### Q7 – TCP/IP: Protokoll → Schicht (3 pt)
+
+**Ordne jedem Protokoll die richtige TCP/IP-Schicht zu.**
+
+* **HTTP:** Anwendung
+* **DNS:** Anwendung
+* **TCP:** Transport
+* **UDP:** Transport
+* **IP:** Internet
+* **Ethernet:** Netzzugang
+
+> **Feedback:** Anwendung: HTTP, DNS, SMTP. Transport: TCP, UDP. Internet: IP. Netzzugang: Ethernet, WLAN.
+
+---
+
+### Q8 – Encapsulation: Dateneinheit → Schicht (3 pt)
+
+**Bei der Übertragung wird eine Nachricht von Schicht zu Schicht verpackt (Encapsulation). Ordne jeder Dateneinheit die zugehörige Schicht zu.**
+
+* **Daten:** Anwendungsschicht – die eigentliche Nachricht (z. B. HTML-Seite).
+* **Segment:** Transportschicht – Daten + Ports und Sequenznummern.
+* **Paket:** Internetschicht – Segment + IP-Adressen (Quelle und Ziel).
+* **Frame:** Netzzugangsschicht – Paket + MAC-Adressen und Prüfsumme.
+
+> **Feedback:** Daten (Anwendung) → Segment (Transport, +Ports) → Paket (Internet, +IP) → Frame (Netzzugang, +MAC). Merkhilfe: D-S-P-F.
+
+---
+
+### Q9 – IP vs. MAC vs. Port: Transfer-Szenario (3 pt)
+
+**Dein Laptop sendet eine HTTPS-Anfrage an einen Webserver in einem anderen Land. Das Paket durchläuft mehrere Router.**
+
+**Welche der folgenden Aussagen über die Adressen auf dem Weg ist korrekt?**
+
+* [ ] Alle drei Adressen (IP, MAC, Port) ändert sich bei jedem Router.
+* [x] **Die IP-Adresse des Servers bleibt konstant, der Port (443) ändert sich nicht – die MAC-Adresse wird an jedem Router neu gesetzt (lokal, ein Hop).** ✅
+* [ ] Die MAC-Adresse bleibt konstant, die IP-Adresse ändert sich bei jedem Hop.
+* [ ] IP und Port ändert sich, MAC bleibt konstant – MAC ist die globale Adresse.
+
+> **Feedback:** IP-Adresse des Ziel-Servers bleibt konstant (global). MAC-Adresse ändert sich bei jedem Hop (lokal, nächster Router). Port 443 (HTTPS) bleibt konstant.
+
+---
+
+### Q10 – TCP 3-Way-Handshake: Was passiert wäre? (3 pt)
+
+**Der Client sendet ein SYN zum Server. Das SYN-Paket geht verloren – es erreicht den Server nie.**
+
+**Was passiert als nächstes, und warum wird keine Verbindung aufgebaut?**
+
+* [ ] Der Server sendet trotzdem ein SYN-ACK, da die IP-Adresse bekannt ist – die Verbindung wird trotzdem aufgebaut.
+* [x] **Der Server kennt die Anfrage nicht → sendet kein SYN-ACK → der Client erhält keine Antwort → keine Verbindung. Der Client wird das SYN nach einem Timeout erneut senden.** ✅
+* [ ] Der Client sendet direkt ein ACK als Fallback – die Verbindung wird mit zwei Paketen aufgebaut.
+* [ ] Das verloren gegangene SYN wird automatisch vom Netzwerk rekonstruiert – kein Problem.
+
+> **Feedback:** Der Server erhält kein SYN → sendet kein SYN-ACK zurück → der Client bekommt keine Antwort → Verbindung wird nicht aufgebaut. TCP wird das SYN nach einem Timeout erneut senden (Neuübertragung).
+
+---
+
+### Q11 – TCP vs. UDP: Videostreaming (2 pt)
+
+**Ein Videostreaming-Dienst sendet Daten an deinen Browser. Ein einzelnes Paket geht verloren.**
+
+**Warum wählt der Dienst UDP statt TCP, obwohl ein Paket verloren geht?**
+
+* [ ] UDP sendet jedes Paket doppelt, daher geht statistisch nie etwas verloren.
+* [x] **Bei Echtzeit ist Verzögerung schlimmer als Verlust. TCP würde das Paket erneut anfordern → Video friert ein. UDP ignoriert es → kurzer Glitch, Video läuft weiter.** ✅
+* [ ] TCP kann bei Videostreaming nicht verwendet werden, da es zu langsam für Multimedia ist.
+* [ ] UDP ist immer schneller als TCP – deshalb nutzt jeder Streaming-Dienst UDP.
+
+> **Feedback:** Bei Echtzeit-Video ist Verzögerung schlimmer als Paketverlust. TCP würde das Paket erneut anfordern → Video friert. UDP ignoriert das Verlust → kurzer Artefakt, Video läuft weiter.
+
+---
+
+### Q12 – HTTP-Methoden: Szenario (2 pt)
+
+**Ein Nutzer aktualisiert sein Profilbild auf einer Webseite. Das Foto wird zum Server gesendet und das *alte Bild ersetzt*.**
+
+**Welche HTTP-Methode wird für diese Operation verwendet, und warum nicht GET?**
+
+* [ ] **GET** – GET kann auch Daten senden, wenn eine URL mit Parameter verwendet wird.
+* [x] **PUT – ersetzt eine existierende Ressource. GET ruft nur Daten ab und sendet *keine* Daten zum Server.** ✅
+* [ ] **POST** – POST ist immer für das Ersetzen von Daten zuständig.
+* [ ] **DELETE** – DELETE sendet das neue Foto und löscht gleichzeitig das alte.
+
+> **Feedback:** PUT – Daten ersetzen (eine existierende Ressource wird überschrieben). GET ruft nur Daten ab, sendet keine Daten zum Server.
+
+---
+
+### Q13 – HTTP Status-Codes: Fehlerdiagnose (2 pt)
+
+**Du rufst eine Webseite auf und der Browser zeigt folgende Fehlermeldung an:**
+`HTTP/1.1 503 Service Unavailable`
+
+**Was bedeutet dieser Code, und wer ist für die Behebung zuständig – du oder der Betreiber der Webseite?**
+
+* [ ] Client-Fehler: Du hast die falsche URL eingegeben – ein 5xx-Code bedeutet, dass deine Anfrage falsch war.
+* [ ] Erfolgs-Code: 503 bedeutet, dass der Server die Anfrage erfolgreich umgeleitet hat.
+* [x] **Server-Fehler: Der Server ist überlastet oder temporär nicht verfügbar. Verantwortung liegt beim Betreiber – du kannst nur später erneut versuchen.** ✅
+* [ ] Der Code bedeutet, dass der Server die Seite dauerhaft verschoben hat – du muss die neue URL suchen.
+
+> **Feedback:** 503 ist ein 5xx-Code = Server-Fehler. Der Server ist überlastet oder temporär nicht verfügbar. Verantwortung liegt beim Serverbetreiber, nicht beim Nutzer.
+
+---
+
+### Q14 – DNS: Rolle im Ablauf (2 pt)
+
+**Du gibst `https://hdm-stuttgart.de` in die Adresszeile ein.**
+
+**Was passiert *vor* dem TCP-Handshake, und warum ist dieser Schritt zwingend nötig?**
+
+* [ ] Der Browser sendet direkt den Namen an den Server – DNS wird erst danach für die Verschlüsselung benötigt.
+* [x] **DNS-Auflösung: Der Name `hdm-stuttgart.de` wird in eine IP-Adresse umgewandelt. TCP kann nur zu IP-Adressen Verbindungen aufbauen, nicht zu Namen.** ✅
+* [ ] DNS passiert nach dem TCP-Handshake – erst wird die Verbindung aufgebaut, dann der Name aufgelöst.
+* [ ] DNS ist nur für HTTPS nötig – bei HTTP kann der Name direkt verwendet werden.
+
+> **Feedback:** DNS-Auflösung: Der Name „hdm-stuttgart.de" wird in eine IP-Adresse umgewandelt. TCP braucht eine IP-Adresse – names können nicht direkt verbunden werden.
+
+---
+
+### Q15 – CSS Spezifität: Welche Regel gewinnt? (2 pt)
+
+**Gegeben folgender CSS-Code:**
+
+```css
+p           { color: blue; }      /* (A) */
+.highlight  { color: green; }     /* (B) */
+#main       { color: red; }       /* (C) */
+
+```
+
+**Ein Element `<p class="highlight" id="main">Text</p>` wird angezeigt.**
+**Welche Farbe zeigt der Text an, und warum?**
+
+* [ ] **Blau** – die Element-Regel steht zuerst im Code und hat daher Vorrang.
+* [ ] **Grün** – Klassen-Selektoren haben immer Vorrang vor IDs.
+* [x] **Rot – die ID-Regel `#main` hat die höchste Spezifität (0,1,0,0) und gewinnt über Klasse (0,0,1,0) und Element (0,0,0,1).** ✅
+* [ ] **Rot** – die letzte Regel im Code gewinnt immer, unabhängig vom Selektor-Typ.
+
+> **Feedback:** Spezifität: ID (0,1,0,0) > Klasse (0,0,1,0) > Element (0,0,0,1). Alle drei Regeln treffen das Element – ID #main gewinnt → rot.
+
+---
+
+### Q16 – Responsive Design: Mobile First (2 pt)
+
+**Ein Developer schreibt folgendes CSS:**
+
+```css
+.container { background: white; }
+
+@media (min-width: 768px) {
+    .container { background: blue; }
+}
+
+@media (min-width: 1024px) {
+    .container { background: green; }
+}
+
+```
+
+**Welche Farbe hat `.container` bei einem Bildschirm von 900 px Breite, und warum?**
+
+* [ ] **Weiß** – Media-Queries gelten nur ab 1024 px, darunter bleibt immer die Basis-Farbe.
+* [ ] **Grün** – die letzte Media-Query überschreibt immer alle vorherigen.
+* [x] **Blau – bei 900 px greift `min-width: 768px` (900 ≥ 768), aber `min-width: 1024px` greift nicht (900 < 1024).** ✅
+* [ ] **Weiß** – bei 900 px greift keine Media-Query, da 900 zwischen den beiden Breakpoints liegt.
+
+> **Feedback:** Mobile First: Basis = white. Bei 900px greift min-width: 768px → blue. min-width: 1024px greift NICHT (900 < 1024). Ergebnis: blau.
+
+---
+
+### Q17 – Zusammen: Reihenfolge eines HTTPS-Aufrufs (1 pt)
+
+**Du gibst eine URL ein. Welche Reihenfolge der Schritte ist korrekt?**
+
+* [ ] (1) TCP-Handshake → (2) DNS → (3) HTTP GET → (4) HTTP 200 OK
+* [x] **(1) DNS → (2) TCP-Handshake → (3) HTTP GET → (4) HTTP 200 OK** ✅
+* [ ] (1) HTTP GET → (2) DNS → (3) TCP-Handshake → (4) HTTP 200 OK
+* [ ] (1) DNS → (2) HTTP GET → (3) TCP-Handshake → (4) HTTP 200 OK
+
+> **Feedback:** Korrekte Reihenfolge: (1) DNS-Auflösung, (2) TCP 3-Way-Handshake, (3) HTTP-Request (GET), (4) HTTP-Response (200 OK + HTML).
+
+---
+
+### Q18 – Bonusfrage: Spezifität Edge Case (1 pt)
+
+**Es gibt zwei CSS-Regeln für ein `<p>`-Element:**
+
+```css
+p p p p p p p p p p  { color: blue; }   /* 100× Element-Selektor */
+.highlight           { color: red; }    /* 1× Klasse */
+
+```
+
+**Das Element hat die Klasse `highlight`. Welche Farbe gewinnt?**
+
+* [ ] **Blau** – 100 Element-Selektoren ergeben 0,0,0,100 = höhere Spezifität als 0,0,1,0.
+* [x] **Rot – eine Klasse (0,0,1,0) gewinnt immer gegen beliebig viele Element-Selektoren (0,0,0,n). Spezifität-Stellen überschreiben sich, nicht addieren.** ✅
+* [ ] **Blau** – die längere Regel (mehr Selektoren) hat immer höhere Spezifität.
+* [ ] Unentschieden – die Regeln haben exakt gleiche Spezifität.
+
+> **Feedback:** Eine einzelne Klasse (0,0,1,0) schlägt immer hundert Element-Selektoren (0,0,0,100). Spezifität wird nicht additiv „aufgezählt" – die Stelle zählt als Einheit.
+
+---
+
+### Q19 – Von-Neumann: Der Flaschenhals (Engpass)
+
+**Die Von-Neumann-Architektur hat einen bekannten Nachteil, den sogenannten „Von-Neumann-Flaschenhals“. Was ist damit gemeint?**
+
+* [ ] Das Steuerwerk kann Befehle schneller verarbeiten, als das Rechenwerk sie berechnen kann.
+* [x] **Die CPU ist schneller als der Datentransfer über den gemeinsamen Bus. Da Daten und Befehle denselben Bus nutzen, müssen sie nacheinander geladen werden.** ✅
+* [ ] Der Speicher verliert seine Daten, wenn der Strom abgeschaltet wird, was den Startvorgang verlangsamt.
+* [ ] Die Ein-/Ausgabegeräte blockieren den Prozessor dauerhaft, da sie keinen eigenen Speicher haben.
+
+> **Feedback:** Der Flaschenhals entsteht, weil Befehle und Daten sich den gleichen Weg (Bus) teilen müssen und der Speicherzugriff langsamer ist als die CPU-Geschwindigkeit.
+
+---
+
+### Q20 – HTML: Encoding (Charset)
+
+**In Q4 ging es um Metadaten. Ein weiteres wichtiges Tag im `<head>` ist `<meta charset="UTF-8">`. Was ist die konkrete Konsequenz, wenn dieses Tag fehlt oder falsch ist?**
+
+* [ ] Die Webseite lädt gar nicht, da der Browser den Binärcode nicht interpretieren kann.
+* [x] **Sonderzeichen (Umlaute, Emojis) werden als kryptische Symbole („Hieroglyphen“) dargestellt, da der Browser die falsche Zeichenkodierung rät.** ✅
+* [ ] Die Seite wird langsamer, da der Browser erst alle Sprachen der Welt durchprobieren muss.
+* [ ] Das CSS wird nicht geladen, da CSS zwingend UTF-8 voraussetzt.
+
+> **Feedback:** Ohne definierte `charset` (Zeichensatz) nutzt der Browser oft einen Standard (z. B. Latin-1), was bei UTF-8-gespeicherten Dateien zu Darstellungsfehlern bei ä, ö, ü oder Emojis führt.
+
+---
+
+### Q21 – Barrierefreiheit: POUR-Prinzip
+
+**Die WCAG basieren auf vier Prinzipien (POUR). Eines davon ist „Bedienbarkeit“ (Operable). Welches Szenario beschreibt eine Verletzung dieses Prinzips?**
+
+* [ ] Der Textkontrast ist zu gering (grau auf hellgrau), sodass man ihn kaum lesen kann.
+* [x] **Eine Navigation funktioniert nur per Maus (Hover), ist aber per Tastatur (Tab-Taste) nicht erreichbar.** ✅
+* [ ] Der Inhalt ist in sehr komplizierter Fachsprache geschrieben, die ein Laie nicht versteht.
+* [ ] Die Webseite stürzt in alten Browsern ab.
+
+> **Feedback:** „Bedienbar“ bedeutet, dass die Schnittstelle (Buttons, Links) von jedem genutzt werden kann – also auch ohne Maus (nur Tastatur). Kontrast gehört zu „Wahrnehmbar“ (Perceivable).
+
+---
+
+### Q22 – Encapsulation: Die Empfänger-Seite (Decapsulation)
+
+**In Q8 haben wir Daten verpackt. Wenn der Server das Signal empfängt, passiert das Gegenteil (Decapsulation). In welcher Reihenfolge werden die Header *entfernt*?**
+
+* [ ] Anwendung (HTTP) → Transport (TCP) → Internet (IP) → Netzzugang (Ethernet)
+* [ ] Es werden alle Header gleichzeitig entfernt, sobald die Daten im RAM liegen.
+* [x] **Netzzugang (Ethernet-Header weg) → Internet (IP-Header weg) → Transport (TCP-Header weg) → Daten.** ✅
+* [ ] Internet (IP) → Netzzugang (Ethernet) → Transport (TCP) → Anwendung (HTTP)
+
+> **Feedback:** Das Auspacken erfolgt in umgekehrter Reihenfolge wie das Einpacken (Zwiebel-Prinzip). Erst wird der Umschlag (Ethernet) geöffnet, dann das Paket (IP), dann das Segment (TCP).
+
+---
+
+### Q23 – Ports: Wozu genau?
+
+**Wir wissen aus Q9, dass IP-Adressen Computer identifizieren. Wozu genau dient dann die Port-Nummer (z. B. 80 oder 443) auf dem Zielrechner?**
+
+* [ ] Sie bestimmt die Geschwindigkeit der Verbindung.
+* [ ] Sie dient zur Verschlüsselung der Daten.
+* [x] **Sie adressiert den konkreten Dienst bzw. die Anwendung auf dem Computer (z. B. Webserver vs. Mailserver).** ✅
+* [ ] Sie zeigt an, ob der Computer per WLAN oder Kabel verbunden ist.
+
+> **Feedback:** Die IP ist wie die Hausnummer (welches Gebäude?), der Port ist wie die Türnummer oder der Name an der Klingel (wer im Haus soll das Paket bekommen? Webserver? Mailserver?).
+
+---
+
+### Q24 – TCP: Sequenznummern
+
+**TCP ist zuverlässig. Ein Mechanismus dafür sind „Sequenznummern“ im Header. Welches Problem lösen diese konkret?**
+
+* [ ] Sie verhindern, dass Hacker die Verbindung abhören können.
+* [x] **Pakete können im Internet unterschiedliche Routen nehmen und in falscher Reihenfolge ankommen. Sequenznummern erlauben das korrekte Sortieren beim Empfänger.** ✅
+* [ ] Sie zählen, wie viele Benutzer gerade gleichzeitig auf dem Server sind.
+* [ ] Sie bestimmen die maximale Größe einer Datei.
+
+> **Feedback:** Da IP-Pakete überholen können, kommen Teil 2 und Teil 3 vielleicht vor Teil 1 an. TCP sortiert sie anhand der Nummern wieder richtig. UDP macht das nicht.
+
+---
+
+### Q25 – HTTP Methoden: Sicherheit
+
+**Warum sollte man niemals die GET-Methode verwenden, um sensible Daten (z. B. ein Passwort) an den Server zu senden?**
+
+* [ ] GET ist langsamer als POST und Passwörter müssen schnell übertragen werden.
+* [x] **Bei GET stehen die Daten sichtbar in der URL (Browser-Verlauf, Server-Logs, Proxy-Server). Bei POST stehen sie im Body.** ✅
+* [ ] GET erlaubt nur Zahlen, keine Buchstaben.
+* [ ] GET-Anfragen werden vom Server nicht verschlüsselt, POST-Anfragen immer.
+
+> **Feedback:** Parameter bei GET hängen an der URL (`?pw=123`). Das ist in der History und in Logs sichtbar. HTTPS verschlüsselt zwar beides auf der Leitung, aber die URL ist an zu vielen Stellen sichtbar.
+
+---
+
+### Q26 – HTTP Status: 404 Not Found
+
+**Du erhältst einen 404-Fehler. In Q13 (503) lag der Fehler beim Server. Wer hat beim 404-Fehler „Schuld“ bzw. wo liegt die Ursache meistens?**
+
+* [ ] Der Server ist abgestürzt.
+* [ ] Das Internet ist ausgefallen.
+* [x] **Der Client (Nutzer). Es wurde eine URL angefordert, die es nicht gibt (Tippfehler oder veralteter Link).** ✅
+* [ ] Der DNS-Server konnte den Namen nicht auflösen.
+
+> **Feedback:** 4xx-Codes sind Client-Errors. Der Server funktioniert super, er sagt dir nur: „Das, was du (Client) suchst, habe ich nicht.“
+
+---
+
+### Q27 – CSS: `!important` vs. ID
+
+**In Q15 hat die ID gewonnen. Nun ändern wir den Code:**
+
+```css
+#main { color: red; }
+p     { color: blue !important; }
+
+```
+
+**Welche Farbe hat das `<p id="main">` Element nun?**
+
+* [ ] **Rot** – ID ist immer noch spezifischer als ein Element-Selektor.
+* [ ] **Lila** – Die Farben mischen sich.
+* [x] **Blau** – `!important` durchbricht die normale Spezifitäts-Kaskade und gewinnt sogar gegen IDs (außer die ID hat auch !important). ✅
+* [ ] **Rot** – `!important` wird von modernen Browsern ignoriert.
+
+> **Feedback:** `!important` ist die „Atombombe“ im CSS. Es überschreibt normale Spezifitätsregeln (ID, Klasse, Element). Es sollte daher sehr sparsam eingesetzt werden.
+
+---
+
+### Q28 – Responsive Design: Desktop First
+
+**In Q16 nutzten wir `min-width` (Mobile First). Wie würde die Media Query aussehen, wenn wir „Desktop First“ arbeiten würden (also Standard ist Desktop, Anpassung für kleine Screens)?**
+
+* [ ] `@media (device-width: small) { ... }`
+* [ ] `@media (min-width: ...)` – das bleibt gleich, nur die Reihenfolge ändert sich.
+* [x] **`@media (max-width: ...)` – Wir definieren Stile für Bildschirme, die *kleiner* als eine bestimmte Breite sind.** ✅
+* [ ] `@media (mobile: true) { ... }`
+
+> **Feedback:** Desktop First bedeutet: Das Basis-CSS ist für große Schirme. Mit `max-width` (maximale Breite) definieren wir Ausnahmen für Geräte, die schmaler sind (Tablets, Handys).

scripts/generate-index.sh

@@ -41,6 +41,7 @@ TOPIC_MAP["vertiefung-offene-fragen"]="Vertiefung & Offene Fragen"
 TOPIC_MAP["geschichte-grundlagen-html"]="Geschichte, Grundlagen & HTML"
 TOPIC_MAP["netzwerke-protokolle-css"]="Netzwerke, Protokolle & CSS"
 TOPIC_MAP["interaktivitaet-javascript"]="Interaktivität & JavaScript"
+TOPIC_MAP["klausurfragen"]="Klausurfragen"
 
 # Configure which topics should appear disabled per course
 # Two modes: fully disabled (non-clickable card) and buttons-disabled (link remains clickable, buttons are disabled)

scripts/generate-root-index.sh

@@ -0,0 +1,187 @@
+#!/usr/bin/env bash
+# Generate root index.html for /hdm/
+# Lists all courses (klausurfragen are now per-course)
+
+BUILD_DIR="build"
+
+cat > "$BUILD_DIR/index.html" << 'HEADER'
+<!DOCTYPE html>
+<html lang="de">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>HdM Vorlesungen</title>
+  <style>
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, sans-serif;
+      max-width: 720px;
+      margin: 0 auto;
+      padding: 3rem 1.5rem;
+      background: #fafafa;
+      color: #1d1d1f;
+      line-height: 1.5;
+    }
+    h1 {
+      font-size: 2rem;
+      font-weight: 600;
+      letter-spacing: -0.02em;
+      margin-bottom: 0.5rem;
+    }
+    .subtitle { color: #86868b; font-size: 1rem; }
+    .courses {
+      margin-top: 2rem;
+      display: flex;
+      flex-direction: column;
+      gap: 0.75rem;
+    }
+    .course-card {
+      position: relative;
+      background: #fff;
+      border-radius: 12px;
+      box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+      transition: all 0.2s ease;
+      display: grid;
+      grid-template-columns: 1fr auto auto;
+      align-items: center;
+      gap: 1rem;
+    }
+    .course-card:hover {
+      transform: translateY(-2px);
+      box-shadow: 0 4px 12px rgba(0,0,0,0.12);
+    }
+    .course-link {
+      display: block;
+      padding: 1.25rem 1.5rem;
+      text-decoration: none;
+      color: inherit;
+      grid-column: 1;
+    }
+    .course-link::after {
+      content: '';
+      position: absolute;
+      inset: 0;
+      border-radius: 12px;
+    }
+    .course-label {
+      font-size: 0.7rem;
+      font-weight: 600;
+      text-transform: uppercase;
+      letter-spacing: 0.05em;
+    }
+    .course-b .course-label { color: #1e5f8a; }
+    .course-c .course-label { color: #d63384; }
+    .course-title {
+      font-size: 1.15rem;
+      font-weight: 500;
+      color: #1d1d1f;
+      margin: 0.25rem 0;
+    }
+    .course-info { font-size: 0.85rem; color: #86868b; }
+    .btn {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      padding: 0.5rem 1rem;
+      border-radius: 8px;
+      text-decoration: none;
+      font-size: 0.8rem;
+      font-weight: 500;
+      transition: all 0.2s;
+      white-space: nowrap;
+      position: relative;
+      z-index: 1;
+      margin-right: 0.5rem;
+    }
+    .btn-slides {
+      background: #6c757d;
+      color: #fff;
+    }
+    .btn-slides:hover { filter: brightness(1.1); }
+    .btn-pdf {
+      background: #f5f5f7;
+      color: #1d1d1f;
+    }
+    .btn-pdf:hover { background: #e8e8ed; }
+    .section-title {
+      font-size: 1rem;
+      font-weight: 600;
+      color: #86868b;
+      margin-top: 2.5rem;
+      margin-bottom: 0.75rem;
+    }
+    .references {
+      display: flex;
+      flex-direction: column;
+      gap: 0.75rem;
+    }
+    footer {
+      margin-top: 2.5rem;
+      padding-top: 1.5rem;
+      border-top: 1px solid #e5e5e7;
+      color: #86868b;
+      font-size: 0.85rem;
+    }
+    footer a { color: #1d1d1f; text-decoration: none; }
+    footer a:hover { text-decoration: underline; }
+    .qr-section {
+      margin-top: 2.5rem;
+      padding: 1.5rem;
+      background: #fff;
+      border-radius: 12px;
+      box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+      text-align: center;
+    }
+    .qr-code { width: 100%; height: auto; }
+    .qr-url { margin-top: 0.75rem; font-size: 0.85rem; color: #86868b; }
+    @media (max-width: 600px) {
+      .course-card { grid-template-columns: 1fr; }
+      .course-link { padding-bottom: 0.75rem; }
+      .btn { margin: 0 1rem 1rem 1.5rem; }
+    }
+  </style>
+</head>
+<body>
+  <h1>HdM Vorlesungen</h1>
+  <p class="subtitle">Sommersemester 2026 · Michael Czechowski</p>
+  <div class="courses">
+    <div class="course-card course-b">
+      <a href="223015b/" class="course-link">
+        <span class="course-label">223015b</span>
+        <div class="course-title">Dateiformate, Schnittstellen, Speichermedien &amp; Distributionswege</div>
+        <span class="course-info">6 Kapitel · Modul "Technik 1"</span>
+      </a>
+    </div>
+    <div class="course-card course-c">
+      <a href="223015c/" class="course-link">
+        <span class="course-label">223015c</span>
+        <div class="course-title">Grundlagen IT- und Internettechnik</div>
+        <span class="course-info">3 Kapitel · Modul "Technik 1"</span>
+      </a>
+    </div>
+HEADER
+
+cat >> "$BUILD_DIR/index.html" << 'FOOTER'
+  </div>
+  <h2 class="section-title">Referenzen</h2>
+  <div class="references">
+    <div class="course-card">
+      <a href="https://codecrispi.es/" class="course-link">
+        <span class="course-label">Plattform</span>
+        <div class="course-title">Code Crispies</div>
+        <span class="course-info">Selbstlernplattform</span>
+      </a>
+    </div>
+  </div>
+  <div class="qr-section">
+    <img src="qr-root.svg" alt="QR Code" class="qr-code">
+    <p class="qr-url">https://librete.ch/hdm/</p>
+  </div>
+  <footer>
+    <a href="mailto:mail@librete.ch">Kontakt</a>
+  </footer>
+</body>
+</html>
+FOOTER
+
+echo "Generated $BUILD_DIR/index.html"

slides/223015b/klausurfragen.md

@@ -48,7 +48,7 @@ section.disable {
 # Klausurfragen – 223015b
 **Dateiformate, Schnittstellen, Speichermedien · HdM Stuttgart · M. Czechowski**
 
-<small>Stand: 01.02.2026</small>
+<small>Stand: 02.02.2026</small>
 
 ---
 
@@ -60,7 +60,7 @@ section.disable {
 > `[ESSAY]` = `essay` (Freitext, manuell bewertet)
 > `[SHORTANS]` = `shortanswer` (Stichwort/Satz, automatisch geprüft)
 > `[NUMERIC]` = `numerical` (Zahlenwert ± Toleranz)
-> `[CLOZE]` = `cloze` (Lückentext, gemischt)`
+> `[CLOZE]` = `cloze` (Lückentext, gemischt)
 
 ---
 
@@ -922,6 +922,8 @@ Wie viele Farben kann ein GIF-Bild gleichzeitig anzeigen?
 
 ---
 
+<!-- _class: disable -->
+
 ### M4 – WebP vs. JPEG: Vorteil?
 **Thema:** Bildformate – WebP
 **Punkte:** 1
@@ -1165,6 +1167,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
@@ -1181,6 +1185,8 @@ Was ist der fundamentale technische Unterschied zwischen HDD und SSD?
 
 ---
 
+<!-- _class: disable -->
+
 ### O3 – HDD vs. SSD: Eigenschaften zuordnen
 **Thema:** Speichermedien – Vergleich
 **Punkte:** 2

slides/223015c/01-geschichte-grundlagen-html.md

@@ -668,6 +668,27 @@ Die Frage: Wer entscheidet, was mit Technologie gemacht wird? Die Entwickler? Di
 
 ---
 
+<!-- _class: erklaerung -->
+<!-- _header: '' -->
+<!-- _footer: '' -->
+
+# Von-Neumann-Architektur: Erklaerung
+
+**Definition:** Das revolutionaere Prinzip, dass Programme und Daten im selben Speicher liegen und Programme somit wie Daten behandelt werden koennen.
+
+**Kernpunkte:**
+- **Stored Program Concept:** Programme sind austauschbare Daten
+- **Universalrechner:** Gleiche Hardware fuer beliebige Aufgaben
+- **Software-Flexibilitaet:** Programme koennen geladen, geaendert und geloescht werden
+
+**Vorher (ENIAC):** Programmierung durch Umstecken von Kabeln → Tage fuer jedes neue Programm
+
+**Nachher:** Software als austauschbare Datei → Betriebssysteme, Apps, Updates moeglich
+
+**Harvard-Architektur (Alternative):** Getrennter Speicher fuer Code und Daten → schneller, aber weniger flexibel (Arduino, DSPs)
+
+---
+
 <!-- _class: lead -->
 
 # Vom Militär zum Netz

slides/223015c/klausurfragen.md

@@ -48,7 +48,7 @@ section.disable {
 # Klausurfragen – 223015c
 **IT-Grundlagen · HdM Stuttgart · M. Czechowski**
 
-<small>Stand: 01.02.2026</small>
+<small>Stand: 02.02.2026</small>
 
 ---
 
@@ -60,7 +60,7 @@ section.disable {
 > `[ESSAY]` = `essay` (Freitext, manuell bewertet)
 > `[SHORTANS]` = `shortanswer` (Stichwort/Satz, automatisch geprüft)
 > `[NUMERIC]` = `numerical` (Zahlenwert ± Toleranz)
-> `[CLOZE]` = `cloze` (Lückentext, gemischt)`
+> `[CLOZE]` = `cloze` (Lückentext, gemischt)
 
 ---
 
@@ -138,6 +138,7 @@ Erklären Sie die fünf Komponenten der Von-Neumann-Architektur: **Rechenwerk (A
 
 ---
 
+
 <!-- _class: lead -->
 
 ## BLOCK B – Netzwerk-Grundlagen (TCP/IP)
@@ -696,7 +697,7 @@ Was ist die Hauptfunktion eines DNS-Servers?
 
 <!-- _class: disable -->
 
-### D2 – DNS: Zeitlicher Ablauf
+### D2-alt – DNS: Zeitlicher Ablauf
 **Thema:** DNS – Rolle im Gesamtablauf
 **Punkte:** 2
 **Typ:** `[MC]`
@@ -994,6 +995,7 @@ Erklären Sie die drei Typen von Einschränkungen: **permanent**, **temporär**
 
 ---
 
+
 <!-- _class: disable -->
 
 ### H3 – Curb-Cut-Effekt: Beispiel identifizieren