hdm/223015b
1
0 Fork 0
Code Pull Requests Activity

Compare commits

base: hdm/223015b:7d2e943d6e4aa601c080e1d1021c2f428d2593bb
hdm/223015b:main hdm/223015b:lecture-01
...
compare: hdm/223015b:main
hdm/223015b:main hdm/223015b:lecture-01
6 Commits
7d2e943d6e ... main
Author SHA1 Message Date
libretech 6222174921 add data units, global data growth and AI content statistics slides to termin 1 2025-12-25 14:08:00 +01:00
libretech 32cf27d87c add consistent dark theme styling across all slides 
- add CSS variables for colors (foreground, highlight, dimmed)
- style code blocks with dark background and blue accent
- improve inline code appearance
- update link colors
- add deploy restriction to CLAUDE.md
 2025-12-19 21:31:43 +01:00
libretech cae460dfc9 add index.html generator for slide overview 2025-12-19 16:45:59 +01:00
libretech fac7683e92 fix slides url: hdm.librete.ch → librete.ch/hdm/223015b 2025-12-19 15:20:16 +01:00
libretech d9c8b0d250 optimize images and add deploy-html target 
- resize all images to max 1920px width (152MB → 66MB)
- add assets-original/ to gitignore for backups
- add make optimize-images target
- add make deploy-html for faster HTML-only deployment
 2025-12-19 15:16:24 +01:00
libretech 800ed932bb add hex-dec lookup table and 8bit-P character images, update speaker notes 2025-12-19 15:03:55 +01:00
43 changed files with 426 additions and 46 deletions
Expand all files Collapse all files

No files matched your search

.gitignore
+1
View File
@@ -63,3 +63,4 @@ Desktop.ini
*.pdf *.pdf
index.md.bak index.md.bak
hdm-lehrauftrag-uebersicht.md hdm-lehrauftrag-uebersicht.md
slides/assets-original/
CLAUDE.md
+1
View File
@@ -5,6 +5,7 @@ This project builds a presentation deck for Marp based on Markdown files.
## Agent Restrictions ## Agent Restrictions
- Agent NEVER runs commands on its own except changing files INSIDE THIS FOLDER, never any other then this - Agent NEVER runs commands on its own except changing files INSIDE THIS FOLDER, never any other then this
- Agent NEVER runs build commands or any automated processes without explicit user request, as the user is working in dev mode - Agent NEVER runs build commands or any automated processes without explicit user request, as the user is working in dev mode
- Agent NEVER runs deploy commands (make deploy, scp, etc.) without explicit user permission - always ask first
## Critical File Protection: index.md ## Critical File Protection: index.md
- `index.md` is the MAIN CONTENT FILE for the entire lecture series - treat with extreme care - `index.md` is the MAIN CONTENT FILE for the entire lecture series - treat with extreme care
Makefile
+26 -3
View File
@@ -1,6 +1,6 @@
# Makefile for Marp Slides Project # Makefile for Marp Slides Project
.PHONY: help build dev watch pdf html clean install deploy copy-assets .PHONY: help build dev watch pdf html clean install deploy deploy-html copy-assets optimize-images
# Directories # Directories
SLIDES_DIR = slides SLIDES_DIR = slides
@@ -27,10 +27,14 @@ help:
@echo " make pdf - Export all slides to PDF" @echo " make pdf - Export all slides to PDF"
@echo " make html - Export all slides to HTML" @echo " make html - Export all slides to HTML"
@echo "" @echo ""
@echo " Deploy:"
@echo " make deploy - Full build + deploy (HTML, PDF, assets)"
@echo " make deploy-html - HTML only deploy (faster)"
@echo ""
@echo " Other:" @echo " Other:"
@echo " make optimize-images - Resize images to max 1920px"
@echo " make clean - Remove generated files" @echo " make clean - Remove generated files"
@echo " make install - Install dependencies" @echo " make install - Install dependencies"
@echo " make deploy - Deploy slides to server"
# Ensure build directory exists # Ensure build directory exists
$(BUILD_DIR)/.exists: $(BUILD_DIR)/.exists:
@@ -79,6 +83,7 @@ html: copy-assets
echo " $$f.html"; \ echo " $$f.html"; \
npx @marp-team/marp-cli $(SLIDES_DIR)/$$f.md -o $(BUILD_DIR)/$$f.html; \ npx @marp-team/marp-cli $(SLIDES_DIR)/$$f.md -o $(BUILD_DIR)/$$f.html; \
done done
@./scripts/generate-index.sh $(BUILD_DIR)
@echo "Done! HTML files in $(BUILD_DIR)/" @echo "Done! HTML files in $(BUILD_DIR)/"
# Clean generated files # Clean generated files
@@ -91,7 +96,18 @@ install:
@echo "Installing dependencies..." @echo "Installing dependencies..."
npm install npm install
# Deploy slides # Optimize images (resize to max 1920px, requires nix-shell -p imagemagick)
optimize-images:
@echo "Backing up originals to assets-original/..."
@mkdir -p $(SLIDES_DIR)/assets-original
@cp $(SLIDES_DIR)/assets/*.png $(SLIDES_DIR)/assets-original/ 2>/dev/null || true
@cp $(SLIDES_DIR)/assets/*.jpg $(SLIDES_DIR)/assets-original/ 2>/dev/null || true
@echo "Resizing images to max 1920px..."
@nix-shell -p imagemagick --run 'for img in $(SLIDES_DIR)/assets/*.png; do magick "$$img" -resize "1920x>" -quality 85 "$$img"; done'
@nix-shell -p imagemagick --run 'for img in $(SLIDES_DIR)/assets/*.jpg; do magick "$$img" -resize "1920x>" -quality 85 "$$img"; done'
@echo "Done! Originals backed up in assets-original/"
# Deploy slides (full build)
deploy: build deploy: build
@echo "Deploying slides..." @echo "Deploying slides..."
@echo "Copying HTML files..." @echo "Copying HTML files..."
@@ -100,3 +116,10 @@ deploy: build
scp -r $(BUILD_DIR)/assets/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/ scp -r $(BUILD_DIR)/assets/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/
@echo "Copying materials..." @echo "Copying materials..."
scp -r $(BUILD_DIR)/materials/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/ 2>/dev/null || true scp -r $(BUILD_DIR)/materials/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/ 2>/dev/null || true
# Deploy HTML only (faster, no PDF rebuild)
deploy-html: html
@echo "Deploying HTML only..."
scp $(BUILD_DIR)/*.html tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/
scp -r $(BUILD_DIR)/assets/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/
scp -r $(BUILD_DIR)/materials/ tengo@tuttle.uberspace.de:/home/tengo/html/hdm/223015b/ 2>/dev/null || true
scripts/generate-index.sh
Executable
+93
View File
@@ -0,0 +1,93 @@
#!/usr/bin/env bash
# Generate index.html for slide overview
BUILD_DIR="${1:-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>223015b - Dateiformate, Schnittstellen, Speichermedien</title>
<style>
* { box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
max-width: 800px;
margin: 0 auto;
padding: 2rem;
background: #1a1a2e;
color: #eee;
}
h1 { color: #fff; margin-bottom: 0.5rem; }
.subtitle { color: #888; margin-bottom: 2rem; }
.termin {
background: #16213e;
border-radius: 8px;
padding: 1.5rem;
margin-bottom: 1rem;
text-decoration: none;
display: block;
transition: transform 0.2s, background 0.2s;
}
.termin:hover { background: #1f4068; transform: translateX(5px); }
.termin h2 { color: #fff; margin: 0 0 0.5rem 0; font-size: 1.2rem; }
.termin .date { color: #4ecca3; font-size: 0.9rem; }
.termin .topic { color: #aaa; font-size: 0.95rem; margin-left: 1rem; }
footer { margin-top: 2rem; color: #666; font-size: 0.85rem; text-align: center; }
footer a { color: #4ecca3; }
</style>
</head>
<body>
<h1>223015b</h1>
<p class="subtitle">Dateiformate, Schnittstellen, Speichermedien & Distributionswege<br>
HdM Stuttgart - WS 2025/26 - Michael Czechowski</p>
HEADER
# Generate links for each termin (sorted)
for html in $(ls "$BUILD_DIR"/2*.html 2>/dev/null | sort); do
filename=$(basename "$html")
# Extract components from filename
# Format: 2025-12-19-termin-1-grundlagen-text-audio.html
date=$(echo "$filename" | grep -oE '^[0-9]{4}-[0-9]{2}-[0-9]{2}')
termin_num=$(echo "$filename" | grep -oE 'termin-[0-9]+' | grep -oE '[0-9]+')
topic_raw=$(echo "$filename" | sed -E 's/^[0-9]{4}-[0-9]{2}-[0-9]{2}-termin-[0-9]+-//' | sed 's/\.html$//')
# Format topic: replace - with space, capitalize
topic=$(echo "$topic_raw" | sed 's/-/ /g' | sed 's/.*/\u&/')
# Format date
if [[ "$date" =~ ^[0-9]{4}-[0-9]{2}-[0-9]{2}$ ]]; then
formatted_date=$(date -d "$date" "+%d.%m.%Y" 2>/dev/null || echo "$date")
else
formatted_date="TBA"
fi
# Handle termin number
if [[ "$termin_num" == "0" ]]; then
termin_label="Einfuhrung"
else
termin_label="Termin $termin_num"
fi
cat >> "$BUILD_DIR/index.html" << LINK
<a href="$filename" class="termin">
<h2>$termin_label</h2>
<span class="date">$formatted_date</span>
<span class="topic">$topic</span>
</a>
LINK
done
cat >> "$BUILD_DIR/index.html" << 'FOOTER'
<footer>
<a href="https://git.librete.ch/hdm/223015b">Git Repository</a> -
<a href="mailto:mail@librete.ch">Kontakt</a>
</footer>
</body>
</html>
FOOTER
echo "Generated $BUILD_DIR/index.html"
slides/2025-12-19-termin-0-intro.md
+28 -1
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
slides/2025-12-19-termin-1-grundlagen-text-audio.md
+161 -34
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
@@ -180,6 +207,113 @@ Eselsbrücke: 1 Byte = 1 Buchstabe/Symbol (in ASCII/UTF-8 für einfache Zeichen)
--- ---
# Dateneinheiten
| Einheit | Bytes | Bits | Potenz |
|---------|-------|------|--------|
| **1 Byte** | 1 | 8 | 10⁰ |
| **1 Kilobyte (KB)** | 1.000 | 8.000 | 10³ |
| **1 Megabyte (MB)** | 1.000.000 | 8 Mio. | 10⁶ |
| **1 Gigabyte (GB)** | 1 Mrd. | 8 Mrd. | 10⁹ |
| **1 Terabyte (TB)** | 1 Bio. | 8 Bio. | 10¹² |
<!--
SI-Präfixe (Dezimal): 1 KB = 1.000 Bytes
Binär (IEC): 1 KiB = 1.024 Bytes (Kibibyte)
Windows zeigt oft binär, sagt aber "KB" → Verwirrung!
1 TB Festplatte = ~931 GiB nutzbar
-->
---
# Dateneinheiten (Fortsetzung)
| Einheit | Bytes | Potenz | Beispiel |
|---------|-------|--------|----------|
| **1 Petabyte (PB)** | 10¹⁵ | 1.000 TB | Netflix-Gesamtarchiv |
| **1 Exabyte (EB)** | 10¹⁸ | 1.000 PB | Alle E-Mails weltweit/Tag |
| **1 Zettabyte (ZB)** | 10²¹ | 1.000 EB | Internet-Traffic 2016 |
| **1 Yottabyte (YB)** | 10²⁴ | 1.000 ZB | *Noch nie erreicht* |
<!--
Peta = 10^15 (Billiarde)
Exa = 10^18 (Trillion)
Zetta = 10^21 (Trilliarde)
Yotta = 10^24 (Quadrillion)
Eselsbrücke: "Kilo Mega Giga Tera Peta Exa Zetta Yotta"
→ "Komm Mit Großem Tee, Peter Exte Zettelt Yachten"
-->
---
# Datenwachstum der Menschheit
| Jahr | Datenmenge | Kontext |
|------|------------|---------|
| **100.000 v. Chr.** | 0 | Erste Menschen, nur Sprache |
| **3.000 v. Chr.** | ~wenige KB | Keilschrift, Hieroglyphen |
| **1450** | ~wenige GB | Gutenberg, Buchdruck |
| **1986** | **2,6 EB** | Analog (Bücher, Vinyl, Film) |
| **2007** | **295 EB** | Beginn digitale Dominanz |
| **2017** | **19 ZB** | Analog kaum gewachsen |
| **2025** | **181 ZB** | 90% unstrukturiert |
<!--
Exponentielles Wachstum: Verdopplung alle 2 Jahre
1986: Letzte Ära mit analoger Dominanz
2007: Erste Jahr, in dem digital > analog
2025: 181 ZB = 181.000.000.000.000.000.000.000 Bytes
Analog blieb bei ~2,6 EB stehen (Bücher, Vinyl, Film)
Digital explodierte: IoT, Social Media, Cloud, Video
-->
---
# 181 Zettabyte – Was bedeutet das?
**2025:** Welt erzeugt **181 ZB** pro Jahr
- **2,5 Quintillionen Bytes** täglich
- **29 Terabyte** pro Sekunde
- **90%** davon: unstrukturiert (Videos, Bilder, Audio)
- **70%** davon: von Nutzern generiert
**Zum Vergleich:**
- 1 ZB = 250 Milliarden DVDs
- 181 ZB = Jeder Mensch erzeugt ~23 TB/Jahr
<!--
Quellen: IDC Global DataSphere Forecast, Statista 2025
IoT-Geräte allein: 73 ZB in 2025
Cloud-Speicher: 100 ZB (50% der Weltdaten)
Prognose 2028: 394 ZB
-->
---
# AI-generierte Inhalte 2025
**Wie viel Content ist heute synthetisch?**
| Bereich | AI-Anteil |
|---------|-----------|
| **Neue Webseiten** | ~74% enthalten AI-Content |
| **Web-Text gesamt** | ~30-40% AI-generiert |
| **Neue Artikel** | ~52% von AI geschrieben |
| **Social-Media-Bilder** | ~71% AI-generiert |
**Prognose 2026:** 90% des Online-Contents synthetisch
<!--
Quellen: Ahrefs 2025, arXiv, Europol-Report
"Synthetic Media" = AI-generiert oder -manipuliert
Problem: Schwer zu messen, da Menschen + AI zusammenarbeiten
Model Collapse: AI trainiert auf AI-Output → Qualitätsverlust
-->
---
<!-- _header: '' --> <!-- _header: '' -->
<!-- _footer: '' --> <!-- _footer: '' -->
@@ -191,6 +325,11 @@ Eselsbrücke: 1 Byte = 1 Buchstabe/Symbol (in ASCII/UTF-8 für einfache Zeichen)
Vorgeschichte: Vorgeschichte:
US-ASCII (1967) Code Chart US-ASCII (1967) Code Chart
- 7 Bit = 128 Zeichen
- Erste 32: Steuerzeichen (nicht druckbar)
- Zeichen 32-126: Druckbar (Buchstaben, Ziffern, Satzzeichen)
- Keine Umlaute, kein ñ, kein é
- "American Standard" → Rest der Welt ausgeschlossen
"Ich möchte, dass ihr das mit mir jetzt gemeinsam lesen lernt; stellt euch vor ihr seid ArchäologInnen." "Ich möchte, dass ihr das mit mir jetzt gemeinsam lesen lernt; stellt euch vor ihr seid ArchäologInnen."
@@ -211,7 +350,6 @@ US-ASCII (1967) Code Chart
»256 Shades of Gray« »256 Shades of Gray«
256 Graustufen: 0 = Schwarz, 255 = Weiß 256 Graustufen: 0 = Schwarz, 255 = Weiß
--> -->
@@ -238,6 +376,7 @@ Jeder Kanal 0-255 → 256³ = 16.777.216 Farben ("True Color")
Das menschliche Auge kann etwa 10 Millionen Farben unterscheiden Das menschliche Auge kann etwa 10 Millionen Farben unterscheiden
→ 24 Bit reicht für fotorealistische Bilder → 24 Bit reicht für fotorealistische Bilder
--> -->
--- ---
<!-- _header: '' --> <!-- _header: '' -->
@@ -294,6 +433,13 @@ background-color: #FF0000; = Rot
--- ---
<!-- _header: '' -->
<!-- _footer: '' -->
![bg fit](./assets/hex-dec-lookup-table.png)
---
# Das Problem: Sprachen # Das Problem: Sprachen
**Die Welt hat mehr als 256 Zeichen!** **Die Welt hat mehr als 256 Zeichen!**
@@ -317,22 +463,6 @@ Chaos: Verschiedene Standards für verschiedene Sprachen
--- ---
<!-- _header: '' -->
<!-- _footer: '' -->
![bg](./assets/ascii-table.png)
<!--
ASCII-Tabelle (1963)
7 Bit = 128 Zeichen
Erste 32: Steuerzeichen (nicht druckbar)
Zeichen 32-126: Druckbar (Buchstaben, Ziffern, Satzzeichen)
Keine Umlaute, kein ñ, kein é
"American Standard" → Rest der Welt ausgeschlossen
-->
---
# Unicode: Ein Standard für alle # Unicode: Ein Standard für alle
**Unicode (1991):** **Unicode (1991):**
@@ -380,19 +510,6 @@ UTF-8-Kodierung: Variable Länge spart Speicher bei ASCII
--- ---
<!-- _header: '' -->
<!-- _footer: '' -->
<!-- _backgroundColor: #000 -->
![bg fit](./assets/hex-binary-table.png)
<!--
Hex-Binär-Umrechnungstabelle
Jede Hex-Ziffer = 4 Bits
-->
---
# Hexadezimal: Lesbarkeit # Hexadezimal: Lesbarkeit
**Binär ist unleserlich:** **Binär ist unleserlich:**
@@ -460,6 +577,10 @@ Hex-Editor = Standard-Tool für Dateianalyse und Reverse Engineering
<!-- <!--
Hex-Editor-Screenshot mit PNG-Datei Hex-Editor-Screenshot mit PNG-Datei
Erste Bytes: 89 50 4E 47 = PNG-Signatur Erste Bytes: 89 50 4E 47 = PNG-Signatur
- 89: non-printable character (signalisiert, dass wir hier außerhalb von ASCII sind)
- 50: P
- 4E: N
- 47: G
IHDR = Image Header (Breite, Höhe, Farbtiefe) IHDR = Image Header (Breite, Höhe, Farbtiefe)
Zeigen, wie man Magic Number liest Zeigen, wie man Magic Number liest
Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux) Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux)
@@ -467,6 +588,13 @@ Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux)
--- ---
<!-- _header: '' -->
<!-- _footer: '' -->
![bg fit](./assets/8bit-P-character.png)
---
# Magic Numbers # Magic Numbers
**Dateityp-Identifikation durch erste Bytes** **Dateityp-Identifikation durch erste Bytes**
@@ -478,8 +606,7 @@ Tool: HxD (Windows), Hex Fiend (Mac), xxd (Linux)
| PDF | `25 50 44 46` | % P D F ✓ | | PDF | `25 50 44 46` | % P D F ✓ |
| ZIP | `50 4B 03 04` | P K ✗ ✗ | | ZIP | `50 4B 03 04` | P K ✗ ✗ |
**Wichtig:** ASCII = nur 0-127! Werte darüber (z.B. `89` = 137) sind **nicht druckbar** (non-printable). **Wichtig:** ASCII = nur 0-127! Werte darüber (z.B. `89` = 137) sind **nicht druckbar** (non-printable). *Hex-Editoren zeigen dafür `.` oder `ÿ` als Platzhalter.*
Hex-Editoren zeigen dafür `.` oder `ÿ` als Platzhalter.
<!-- <!--
"Warum findet ihr 89 nicht in der ASCII-Tabelle?" "Warum findet ihr 89 nicht in der ASCII-Tabelle?"
@@ -1082,7 +1209,7 @@ Goldenes Ohr: Manche hören Unterschied, manche nicht
# Fragen & Diskussion # Fragen & Diskussion
**Kontakt:** mail@librete.ch **Kontakt:** mail@librete.ch
**Folien:** Online verfügbar unter https://hdm.librete.ch **Folien:** Online verfügbar unter https://librete.ch/hdm/223015b
--- ---
slides/2026-01-09-termin-2-bild-audio-video.md
+29 -2
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
@@ -818,7 +845,7 @@ Keine Abgabe, nur zum Ausprobieren
# Fragen & Diskussion # Fragen & Diskussion
**Kontakt:** mail@librete.ch **Kontakt:** mail@librete.ch
**Folien:** Online verfügbar unter https://hdm.librete.ch **Folien:** Online verfügbar unter https://librete.ch/hdm/223015b
--- ---
slides/2026-01-23-termin-3-speichermedien-schnittstellen.md
+29 -2
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
@@ -1417,7 +1444,7 @@ Keine Abgabe, nur zum Ausprobieren
# Fragen & Diskussion # Fragen & Diskussion
**Kontakt:** mail@librete.ch **Kontakt:** mail@librete.ch
**Folien:** Online verfügbar unter https://hdm.librete.ch **Folien:** Online verfügbar unter https://librete.ch/hdm/223015b
--- ---
slides/2026-01-30-termin-4-distribution-apis-zukunft.md
+29 -2
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
@@ -1877,7 +1904,7 @@ Evaluation: Feedback ernst nehmen, Kurs verbessern
# Fragen & Diskussion # Fragen & Diskussion
**Kontakt:** mail@librete.ch **Kontakt:** mail@librete.ch
**Folien:** Online verfügbar unter https://hdm.librete.ch **Folien:** Online verfügbar unter https://librete.ch/hdm/223015b
--- ---
slides/2026-xx-xx-termin-5-vertiefung-offene-fragen.md
+29 -2
View File
@@ -9,11 +9,38 @@ title: Dateiformate, Schnittstellen, Speichermedien & Distributionswege
--- ---
<style> <style>
:root {
--color-foreground: #1a1a2e;
--color-highlight: #5da9e9;
--color-dimmed: #4a4a6a;
}
section.invert {
--color-foreground: #fff;
}
section { section {
font-size: 1.7rem; font-size: 1.7rem;
} }
h2 { h2 {
color: var(--color-dimmed); color: var(--color-highlight);
}
pre {
background: #0f0f23;
color: #5da9e9;
border-radius: 8px;
border-left: 3px solid #5da9e9;
}
pre code {
background: transparent;
color: inherit;
}
code {
background: #1a1a2e;
color: #5da9e9;
padding: 0.15em 0.4em;
border-radius: 4px;
}
a {
color: var(--color-highlight);
} }
</style> </style>
@@ -65,7 +92,7 @@ Themen nach Interesse der Studierenden
# Fragen & Diskussion # Fragen & Diskussion
**Kontakt:** mail@librete.ch **Kontakt:** mail@librete.ch
**Folien:** Online verfügbar unter https://hdm.librete.ch **Folien:** Online verfügbar unter https://librete.ch/hdm/223015b
--- ---
slides/assets/8bit-P-character.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

slides/assets/addaptive-substractive-colors.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 574 KiB

After

Width:  |  Height:  |  Size: 233 KiB

slides/assets/ascii-table.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.6 MiB

After

Width:  |  Height:  |  Size: 2.6 MiB

slides/assets/audio-spectrogram.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.8 MiB

After

Width:  |  Height:  |  Size: 2.9 MiB

slides/assets/av1-logo.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

slides/assets/cassette-ipod.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.1 MiB

After

Width:  |  Height:  |  Size: 2.4 MiB

slides/assets/compression-types.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.5 MiB

After

Width:  |  Height:  |  Size: 2.4 MiB

slides/assets/container-codec-diagram.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 MiB

After

Width:  |  Height:  |  Size: 2.4 MiB

slides/assets/digital-landscape.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.7 MiB

After

Width:  |  Height:  |  Size: 4.0 MiB

slides/assets/gif-animation.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.7 MiB

After

Width:  |  Height:  |  Size: 2.7 MiB

slides/assets/grayscale-gradient.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.8 MiB

After

Width:  |  Height:  |  Size: 1.8 MiB

slides/assets/hex-binary-table.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.4 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

slides/assets/hex-code-hidden.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 408 KiB

After

Width:  |  Height:  |  Size: 175 KiB

slides/assets/hex-code.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 484 KiB

After

Width:  |  Height:  |  Size: 204 KiB

slides/assets/hex-dec-lookup-table.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

slides/assets/hexeditor-screenshot.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.3 MiB

After

Width:  |  Height:  |  Size: 2.7 MiB

slides/assets/iframe-pframe-diagram.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 MiB

After

Width:  |  Height:  |  Size: 2.1 MiB

slides/assets/instagram-quality-loss.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.3 MiB

After

Width:  |  Height:  |  Size: 2.6 MiB

slides/assets/jpeg-artifacts.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.3 MiB

After

Width:  |  Height:  |  Size: 2.5 MiB

slides/assets/jung-naiv.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 805 KiB

After

Width:  |  Height:  |  Size: 525 KiB

slides/assets/karlheinz-brandenburg.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 197 KiB

After

Width:  |  Height:  |  Size: 171 KiB

slides/assets/lightbulb-onoff.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 MiB

After

Width:  |  Height:  |  Size: 2.0 MiB

slides/assets/matrix-code.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.5 MiB

After

Width:  |  Height:  |  Size: 2.7 MiB

slides/assets/napster-interface.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.0 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

slides/assets/netflix-4k.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.5 MiB

After

Width:  |  Height:  |  Size: 2.7 MiB

slides/assets/original-ascii-table.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 121 KiB

After

Width:  |  Height:  |  Size: 125 KiB

slides/assets/photo-comparison.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.8 MiB

After

Width:  |  Height:  |  Size: 3.0 MiB

slides/assets/rgb-color-model-with-title.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.3 MiB

After

Width:  |  Height:  |  Size: 2.0 MiB

slides/assets/rgb-color-model.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.0 MiB

After

Width:  |  Height:  |  Size: 1.9 MiB

slides/assets/spectogram-chet-baker.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 MiB

After

Width:  |  Height:  |  Size: 3.0 MiB

slides/assets/streaming-quality-switch.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 MiB

After

Width:  |  Height:  |  Size: 2.3 MiB

slides/assets/suzanne-vega.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 308 KiB

After

Width:  |  Height:  |  Size: 338 KiB

slides/assets/youtube-vp9.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.5 MiB

After

Width:  |  Height:  |  Size: 2.5 MiB