public/uni
2
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

223015c 01: tippfehler/grammatik/fachfehler korrigiert, frage-headings entschärft

Browse Source
This commit is contained in:
libretech
2026-06-17 12:17:55 +02:00
parent 4cd9975017
commit 1dd983a453
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
slides/223015c/01-geschichte-grundlagen-html.md
+20 -20
View File
@@ -126,7 +126,7 @@ Hochschule der Medien Stuttgart
2. Netzwerke, Protokolle, **semantisches HTML** & **CSS** 2. Netzwerke, Protokolle, **semantisches HTML** & **CSS**
3. Interaktivität, Animationen & **JavaScript** 3. Interaktivität, Animationen & **JavaScript**
**Ziel:** "Gelernte Hilflosigkeit" ablegen **Ziel:** Technische Scheu abbauen und Web-Grundlagen selbst beherrschen
--- ---
@@ -403,10 +403,10 @@ Der Turing-Test (1950): Ein Interrogator kommuniziert per Text mit einem Mensche
- Implosions-Simulationen - Implosions-Simulationen
- Nuklearphysik-Gleichungen - Nuklearphysik-Gleichungen
**Lösung 1943:** Menschliche "Computer" **Lösung 1943:** Die Berechnungen übernehmen menschliche "Computer"
→ Mathematikerinnen mit Taschenrechnern & IBM-Lochkarten → Mathematikerinnen mit Taschenrechnern & IBM-Lochkarten
**Zu langsam** → Bedarf an automatischer Berechnung **Das ist zu langsam** → es entsteht der Bedarf an automatischer Berechnung
**Schlüsselfigur:** John von Neumann (Mathematik & Stoßwellen) **Schlüsselfigur:** John von Neumann (Mathematik & Stoßwellen)
@@ -427,7 +427,7 @@ Das ENIAC-Projekt in Philadelphia sollte die Berechnungen beschleunigen.
# John von Neumann (1903–1957) # John von Neumann (1903–1957)
- Geboren in Budapest, Österreich-Ungarn - Geboren in Budapest, Österreich-Ungarn
- Mit 8: Konnte Telefonbücher auswendig - Mit 8: Konnte ganze Telefonbücher auswendig aufsagen
- Mit 22: Doktor in Mathematik - Mit 22: Doktor in Mathematik
**Beiträge:** **Beiträge:**
@@ -623,7 +623,7 @@ COBOL läuft heute noch auf Bankensystemen
- Jeder Befehl entspricht direkt einer CPU-Instruktion - Jeder Befehl entspricht direkt einer CPU-Instruktion
- Hardwarenah, aber für Menschen lesbar - Hardwarenah, aber für Menschen lesbar
**Fun Fact:** Chris Sawyer schrieb **RollerCoaster Tycoon** (1999) fast komplett in x86-Assembly **Kuriosum:** Chris Sawyer schrieb **RollerCoaster Tycoon** (1999) fast komplett in x86-Assembly
<!-- <!--
KATHLEEN BOOTH (1922–2022): KATHLEEN BOOTH (1922–2022):
@@ -945,7 +945,7 @@ binary 00101010 = decimal 42
--- ---
# Was kann man mit 256 Zuständen machen? # 256 Zustände – was sich damit darstellen lässt
- **256 Zeichen** (Buchstaben, Zahlen, Symbole) - **256 Zeichen** (Buchstaben, Zahlen, Symbole)
- **256 Graustufen** (0 = Schwarz, 255 = Weiß) - **256 Graustufen** (0 = Schwarz, 255 = Weiß)
@@ -1076,7 +1076,7 @@ Dieselben 8 Byte (PNG-Dateianfang: 89 50 4E 47 0D 0A 1A 0A) — drei Perspektive
--- ---
# Wo begegnet Ihnen Hex-Code? # Wo euch Hex-Code begegnet
| Kontext | Beispiel | | Kontext | Beispiel |
|---------|----------| |---------|----------|
@@ -1112,7 +1112,7 @@ Fehlercodes: Windows zeigt diese bei Bluescreens
--- ---
# Bit vs. Byte: Die Verwirrung # Bit vs. Byte: der Unterschied
**1 Byte = 8 Bit** → Bit ÷ 8 = Byte **1 Byte = 8 Bit** → Bit ÷ 8 = Byte
@@ -1146,7 +1146,7 @@ Warum? Marketing - 100 klingt besser als 12,5
**H**yper**T**ext **M**arkup **L**anguage **H**yper**T**ext **M**arkup **L**anguage
* **Keine** Programmiersprache * **Keine** Programmiersprache
* Am ehesten eine Formattierungssprache * Am ehesten eine Auszeichnungssprache (Markup)
* Beschreibt **Struktur und Aufbau** einer Webseite * Beschreibt **Struktur und Aufbau** einer Webseite
* ```html * ```html
<p>Das ist ein Absatz.</p> <p>Das ist ein Absatz.</p>
@@ -1167,8 +1167,8 @@ Aktuelle Version: HTML5 (seit 2014)
# Was ist HTML? (2/2) # Was ist HTML? (2/2)
* Mit HTML werden **HTML-Dokumente** beschrieben (bspw. `index.html`) * Mit HTML werden **HTML-Dokumente** beschrieben (bspw. `index.html`)
* Ein HTML-Dokument beschreibt das/den `Document Object Model (DOM)` * Ein HTML-Dokument beschreibt das **Document Object Model (DOM)**
* Der DOM ist eine **hierarchische Baumstruktur** (Kind- und Elternelemente) * Das DOM ist eine **hierarchische Baumstruktur** (Kind- und Elternelemente)
* *parent nodes / elements* * *parent nodes / elements*
* *child nodes / elements* * *child nodes / elements*
* *sibling nodes / elements* * *sibling nodes / elements*
@@ -1178,12 +1178,12 @@ Aktuelle Version: HTML5 (seit 2014)
# HTML-Anatomie (1/2) # HTML-Anatomie (1/2)
Formattierungssprache HTML ist eine Auszeichnungssprache (Markup).
* HTML folgt einer strengen **Syntax** zur Formattieren von digitalen Inhalten * HTML folgt einer strengen **Syntax** zum Auszeichnen digitaler Inhalte
* Syntax: `<element attribute="value"> ... </element>` * Syntax: `<element attribute="value"> ... </element>`
* Öffnende und schließende HTML-Tags müssen identisch sein * Öffnende und schließende HTML-Tags müssen identisch sein
* Das schließende Tag muss ein `/` nach der Spitzenklammer haben * Das schließende Tag hat ein `/` direkt nach der öffnenden spitzen Klammer (`</p>`)
--- ---
@@ -1199,7 +1199,7 @@ Formattierungssprache
* `<b> ... </b>` fett-gedruckter Text (inline) * `<b> ... </b>` fett-gedruckter Text (inline)
* `<a> ... </a>` Hyperlink (Verlinkung zu anderen Webseiten, Bildern) * `<a> ... </a>` Hyperlink (Verlinkung zu anderen Webseiten, Bildern)
* `<body> ... </body>` Sichtbarer Teil eines HTML-Dokuments * `<body> ... </body>` Sichtbarer Teil eines HTML-Dokuments
* `<details> ... </details>` Collapsable / Akkordion / Aufklapp-Text * `<details> ... </details>` Aufklapp-Text (Akkordion)
* **Selbst-schließend** * **Selbst-schließend**
* `<img />` Bild, Vektorgrafik etc. * `<img />` Bild, Vektorgrafik etc.
* `<input />` Eingabefeld * `<input />` Eingabefeld
@@ -1385,7 +1385,7 @@ a = anchor (Anker)
# Natives HTML # Natives HTML
Was noch üblicherweise mit Skriptsprachen wie JavaScript und anderen umgesetzt werden musste, kann nun HTML selber. Wer dieses dennoch verwendet, hat das einen sog. *"Code smell"*. Vieles, was früher JavaScript erforderte, beherrscht HTML inzwischen selbst. Wer es dennoch per Skript löst, produziert einen sogenannten *"Code Smell"*.
| Funktion | HTML-Element | | Funktion | HTML-Element |
|----------|--------------| |----------|--------------|
@@ -1510,7 +1510,7 @@ Accessibility ist eingebaut
<!-- _class: lead --> <!-- _class: lead -->
# Wie nutzen Menschen das Web? # Wie Menschen das Web nutzen
--- ---
@@ -1554,7 +1554,7 @@ Accessibility ist eingebaut
--- ---
# Wie nutzen Menschen das Web? # Wie Menschen das Web nutzen
| Eingabe | Nutzungsweise | | Eingabe | Nutzungsweise |
|---------|---------------| |---------|---------------|
@@ -1613,10 +1613,10 @@ Screenreader lesen den DOM sequenziell – semantisches HTML (`<nav>`, `<main>`,
--- ---
# Warum "Barrierefreiheit"? # Bedeutung von "Barrierefreiheit"
**Rechtlich:** **Rechtlich:**
- EU: European Accessibility Act (seit Juni 2025 in Kraft!) - EU: European Accessibility Act (seit Juni 2025 in Kraft)
- DE: BITV 2.0 (Behörden), Privatwirtschaft betroffen - DE: BITV 2.0 (Behörden), Privatwirtschaft betroffen
**Ethisch:** **Ethisch:**