update termin 1 slides based on feedback
- remove torches of freedom story (ibm story sufficient) - fix von-neumann claim (not all devices, mention harvard) - change email to mail@librete.ch - simplify overflow slides - rename dehomag image file
This commit is contained in:
@@ -47,7 +47,7 @@ Hochschule der Medien Stuttgart
|
||||
- Softwareentwickler & IT-Berater
|
||||
- Schwerpunkte: Cloud, AI, Web-Technologien, Systemarchitektur, Open Source
|
||||
- Hintergrund: Philosophie & Informatik
|
||||
- Kontakt: michael.czechowski@lehre.dhbw-stuttgart.de
|
||||
- Kontakt: mail@librete.ch
|
||||
|
||||
<!--
|
||||
Kurze Vorstellung
|
||||
@@ -107,57 +107,6 @@ MedienStudentInnen, nicht InformatikerInnen
|
||||
<!-- _header: '' -->
|
||||
<!-- _footer: '' -->
|
||||
|
||||

|
||||
|
||||
<!--
|
||||
Torches of Freedom, 1929
|
||||
Edward Bernays, Neffe von Sigmund Freud
|
||||
-->
|
||||
|
||||
---
|
||||
|
||||
# Torches of Freedom (1929)
|
||||
|
||||
**Edward Bernays** – Neffe von Sigmund Freud
|
||||
|
||||
**Problem:** Frauen rauchen nicht in der Öffentlichkeit (Tabu)
|
||||
**Auftraggeber:** American Tobacco Company
|
||||
|
||||
**Lösung:** Suffragetten-Marsch, Osterparade NYC
|
||||
"Torches of Freedom" – Zigaretten als Freiheitssymbol
|
||||
|
||||
**Ergebnis:** Umsatz verdoppelt, Tabu gebrochen
|
||||
|
||||
<!--
|
||||
Bernays gilt als "Vater der PR"
|
||||
Manipulation durch Medien und Symbolik
|
||||
Verbindung Psychologie + Massenmedien
|
||||
Warum erzähle ich das? → Technik formt Gesellschaft, Gesellschaft formt Technik
|
||||
-->
|
||||
|
||||
---
|
||||
|
||||
# Warum diese Geschichte?
|
||||
|
||||
**Technik ist nie neutral.**
|
||||
|
||||
- Lochkarten zählten Menschen... und sortieren sie
|
||||
- Computer berechneten Atombomben... und verbinden uns
|
||||
- Das Internet demokratisiert Wissen... und verbreitet Desinformation
|
||||
|
||||
**MedienwirtschaftlerInnen** müssen verstehen:
|
||||
Technologie ist ein Werkzeug – **wofür** es genutzt wird, entscheiden Menschen.
|
||||
|
||||
<!--
|
||||
Kritisches Denken über Technologie
|
||||
Medienkompetenz braucht technisches Verständnis
|
||||
-->
|
||||
|
||||
---
|
||||
|
||||
<!-- _header: '' -->
|
||||
<!-- _footer: '' -->
|
||||
|
||||

|
||||
|
||||
<!--
|
||||
@@ -208,7 +157,7 @@ Heute: IBM als Cloud- und AI-Unternehmen (Watson, Red Hat)
|
||||
<!-- _header: '' -->
|
||||
<!-- _footer: '' -->
|
||||
|
||||

|
||||

|
||||
|
||||
<!--
|
||||
Hollerith-Maschinen im Dritten Reich
|
||||
@@ -445,13 +394,16 @@ Speicher enthält beides: Was zu tun ist (Programm) + Womit (Daten)
|
||||
- Kein Multitasking
|
||||
- Keine Updates
|
||||
|
||||
**JEDES digitale Gerät** basiert auf diesem Prinzip:
|
||||
Laptop, Smartphone, Router, Smartwatch, Auto-Computer...
|
||||
**Die meisten Computer** basieren auf diesem Prinzip:
|
||||
Laptop, Smartphone, Server, Spielkonsole...
|
||||
|
||||
**Ausnahme:** Mikrocontroller & DSPs nutzen oft die **Harvard-Architektur**
|
||||
(separate Speicher für Code und Daten → schneller für Echtzeitanwendungen)
|
||||
|
||||
<!--
|
||||
Alternativen existieren (Harvard-Architektur für Embedded)
|
||||
Aber: Grundkonzept gilt überall
|
||||
Deshalb wichtig zu verstehen
|
||||
Harvard-Architektur: AVR, PIC, viele ARM-Prozessoren
|
||||
Modified Harvard in modernen CPUs (separate Caches)
|
||||
Für Medienwirtschaft: Von-Neumann-Konzept reicht
|
||||
-->
|
||||
|
||||
---
|
||||
@@ -774,23 +726,21 @@ a = anchor (Anker)
|
||||
|
||||
# Hands-On: Werkzeuge einrichten
|
||||
|
||||
**Option 1: Ganz einfach**
|
||||
- Texteditor (Notepad, TextEdit, gedit)
|
||||
- Datei speichern als `index.html`
|
||||
- Im Browser öffnen (Firefox empfohlen)
|
||||
**Option 1: Texteditor + Browser**
|
||||
- Notepad, TextEdit oder gedit
|
||||
- Speichern als `index.html` → Im Browser öffnen
|
||||
|
||||
**Option 2: Komfortabler**
|
||||
- VS Code (kostenlos): https://code.visualstudio.com
|
||||
**Option 2: VS Code** (empfohlen)
|
||||
- code.visualstudio.com
|
||||
- Extension: "Live Server"
|
||||
|
||||
**Option 3: Ohne Installation**
|
||||
- https://stackblitz.com
|
||||
- https://codepen.io
|
||||
**Option 3: Online-Editoren**
|
||||
- stackblitz.com
|
||||
- codepen.io
|
||||
|
||||
<!--
|
||||
Erstmal ohne IDE starten!
|
||||
Verstehen: HTML ist nur Text
|
||||
Browser interpretiert den Text
|
||||
-->
|
||||
|
||||
---
|
||||
@@ -954,17 +904,15 @@ Antworten sammeln: Brief, Telefon, Fax, Funk...
|
||||
|
||||
# Kommunikationsarten
|
||||
|
||||
| Kategorie | Denkweise |
|
||||
|-----------|-----------|
|
||||
| **Synchron** | "Ich sende und warte auf Antwort" |
|
||||
| **Asynchron** | "Ich sende – du antwortest später" |
|
||||
| **Verbindungsorientiert** | "Wir bauen erst eine Leitung auf" |
|
||||
| **Verbindungslos** | "Ich schicke Pakete los – jedes für sich" |
|
||||
| Kategorie | Beispiel |
|
||||
|-----------|----------|
|
||||
| **Synchron** | Telefonat, Video-Call |
|
||||
| **Asynchron** | E-Mail, Brief, SMS |
|
||||
| **Verbindungsorientiert** | Telefon (Leitung aufbauen) |
|
||||
| **Verbindungslos** | Brief, Postkarte |
|
||||
|
||||
<!--
|
||||
Telefon = synchron + verbindungsorientiert
|
||||
Brief = asynchron + verbindungslos
|
||||
Internet nutzt beides!
|
||||
Internet nutzt beides: TCP = verbindungsorientiert, UDP = verbindungslos
|
||||
-->
|
||||
|
||||
---
|
||||
@@ -1127,22 +1075,13 @@ HTTPS = HTTP + TLS-Verschlüsselung
|
||||
|
||||
# Hands-On: Netzwerk erkunden (20 Min)
|
||||
|
||||
**Öffnet das Terminal:**
|
||||
- Windows: PowerShell
|
||||
- Mac/Linux: Terminal
|
||||
**Terminal öffnen:** PowerShell (Win) / Terminal (Mac/Linux)
|
||||
|
||||
**Befehle ausprobieren:**
|
||||
```bash
|
||||
# Eure IP-Adresse
|
||||
ipconfig # Windows
|
||||
ifconfig # Mac/Linux
|
||||
|
||||
# Ping (erreichbar?)
|
||||
ping google.de
|
||||
|
||||
# Weg zum Server
|
||||
tracert google.de # Windows
|
||||
traceroute google.de # Mac/Linux
|
||||
ipconfig # IP-Adresse (Win)
|
||||
ifconfig # IP-Adresse (Mac/Linux)
|
||||
ping google.de # Erreichbarkeit testen
|
||||
tracert google.de # Weg zum Server (Win)
|
||||
```
|
||||
|
||||
---
|
||||
@@ -1231,15 +1170,11 @@ Validierung kostenlos
|
||||
|
||||
**Baut eine "Über mich"-Seite mit:**
|
||||
|
||||
1. **Semantischem Grundgerüst** (header, nav, main, footer)
|
||||
2. **Navigation** mit Links zu Abschnitten
|
||||
3. **Über-mich-Abschnitt** mit Bild
|
||||
4. **Hobbies-Liste**
|
||||
5. **Kontaktformular** mit:
|
||||
- Name (required)
|
||||
- E-Mail (type="email")
|
||||
- Nachricht (textarea)
|
||||
- Absenden-Button
|
||||
1. Semantisches Grundgerüst (header, nav, main, footer)
|
||||
2. Navigation mit Links zu Abschnitten
|
||||
3. Über-mich-Abschnitt mit Bild
|
||||
4. Hobbies-Liste
|
||||
5. Kontaktformular (Name, E-Mail, Nachricht, Button)
|
||||
|
||||
**Ziel:** Vollständige, valide HTML-Seite
|
||||
|
||||
@@ -1266,8 +1201,7 @@ Validierung kostenlos
|
||||
|
||||
**Nächster Termin:** 10.01.2026 – CSS & Netzwerke
|
||||
|
||||
**Kontakt:** michael.czechowski@lehre.dhbw-stuttgart.de
|
||||
**Repository:** git.librete.ch/hdm/223015b
|
||||
**Kontakt:** mail@librete.ch
|
||||
|
||||
---
|
||||
|
||||
|
||||
Reference in New Issue
Block a user