Skip to content

Commit 697324a

Browse files
committed
* renamed Files
* Added HTML Exercise
1 parent 657b5ba commit 697324a

4 files changed

Lines changed: 60 additions & 6 deletions

File tree

Material/Notes/Exercises/Exercise_2025-01-13_Webdesign.md renamed to Material/Notes/Exercises/Exercise_2026-01-13_Webdesign.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: Aufgabe Webdesign
3-
date: 2025-02-13
3+
date: 2026-02-13
44
lang: de-DE
55
author: "Silas Schnurr"
66
...

Material/Notes/Exercises/Exercise_2025-01-20_HTTP.md renamed to Material/Notes/Exercises/Exercise_2026-01-20_HTTP.md

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: Übungsaufgabe HTTP
3-
date: 2025-01-20
3+
date: 2026-01-20
44
lang: de-DE
55
author: "Silas Schnurr"
66
...
@@ -83,8 +83,6 @@ Diskutieren Sie jeweils Vor- und Nachteile im Hinblick auf Fehlertoleranz und ho
8383
Wählen Sie eine der vorgestellten REST-Alternativen (gRPC, GraphQL, WebSockets oder Server-Sent Events) und vergleichen Sie diese mit REST.
8484
Gehen Sie dabei auf typische Einsatzszenarien ein und begründen Sie, warum die gewählte Alternative dort besser geeignet ist als REST.
8585

86-
### Theoretische Fragen
87-
8886
## Information: Einordnung in die Softwareentwicklung
8987

9088
Diese Aufgabe ist Teil der Konzeptions- und Discovery-Phase der Softwareentwicklung und wird häufig als API-Design oder API-Konzeption bezeichnet. Ziel ist es, frühzeitig zu klären, welche Schnittstellen benötigt werden, bevor mit der eigentlichen Implementierung begonnen wird.
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
title: Übungsaufgabe HTML
3+
date: 2026-02-03
4+
lang: de-DE
5+
author: "Silas Schnurr"
6+
...
7+
8+
# Übungsaufgabe HTML
9+
10+
In dieser Übung erstellen Sie eine einfache Nachrichten-Webseite, um die Grundlagen von HTML zu festigen und den Umgang mit grundlegenden HTML-Elementen zu üben.
11+
12+
## Projekt erstellen
13+
14+
1. Erstellen Sie einen neuen Projektordner und legen Sie darin eine Datei namens `index.html` an.
15+
2. Öffnen Sie die Datei index.html in einem Texteditor (z. B. Visual Studio Code oder Notepad++) und in einem Browser.
16+
17+
## Einfache Nachrichten-Seite mit bekannten Mitteln erstellen
18+
19+
Erstellen Sie eine kleine Nachrichten-Webseite mit den Ihnen bekannten HTML-Elementen. Orientieren Sie sich dabei an folgenden Anforderungen:
20+
21+
### Teil 1: Übersichtsseite
22+
23+
Fügen Sie in der index.html folgende Elemente ein:
24+
25+
- Eine Hauptüberschrift mit dem Titel der Seite (z. B. “Meine Nachrichten”).
26+
- Eine unsortierte Liste, in der jeder Eintrag ein Hyperlink zu einem Artikel ist. Nutzen Sie relative Links, z. B. `artikel1.html`, für die Verknüpfungen.
27+
- Geben Sie jedem Listeneintrag einen Titel für einen Artikel
28+
29+
### Teil 2: Artikel-Seite
30+
31+
- Erstellen Sie mindestens eine zweite Datei z. B. `artikel1.html`.
32+
- Fügen Sie folgende Inhalte in die Datei ein:
33+
- Eine Überschrift, die den Titel des Artikels wiedergibt.
34+
- Eine Unterüberschrift mit einer kurzen Zusammenfassung
35+
- Einen Absatz mit einem Beispieltext.
36+
- Ein Bild, auf welches man klicken kann, um zurück zur index.html Seite zu gelangen.
37+
38+
### Teil 3: Stilisieren Sie den Inhalt mit zusätzlichen Elementen
39+
40+
Ergänzen Sie in beiden Dateien:
41+
42+
- Hervorhebungen im Text.
43+
- Einen horizontalen Trenner zwischen verschiedenen Abschnitten.
44+
- Eine nummerierte Liste, die thematisch zum Artikel passt
45+
- Fügen Sie in der `artikel1.html` eine Tabelle mit Rahmen hinzu
46+
47+
### Teil 4: Theoretische Fragen
48+
49+
- Welche Technologie kann man nutzen, wenn man möchte, dass neue Artikel auf der Seite automatisch erscheinen?
50+
- Die Buchsteben _HT_ in HTML und HTTP stehen für **H**yper**t**ext. In welchem Bezug stehen HTML und HTTP?
51+
- Was sind mögliche Folgen, wenn man das charset nicht im `<head>` der HTML-Datei angibt?
52+
- Informieren Sie sich über das `alt`-Attribut des `img`-Elements. Warum ist es sinnvoll, das `alt`-Attribut zu verwenden?
53+
54+
## Hinweise
55+
56+
- Sie können den Lorem Ipsum Generator zur Erstellung von Beispieltext nutzen: [loremipsum.de](https://loremipsum.de/)
57+
- Testen Sie regelmäßig Ihre Seite im Browser, um sicherzustellen, dass alle Links und Inhalte korrekt angezeigt werden.

Material/Slides/04_HTML.md

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: "Vorlesung Webengineering I - HTML"
33
topic: "Webengineering_1_4"
4-
date: 2025-01-23
4+
date: 2026-02-03
55
author: "Lukas Panni"
66
theme: "Berlin"
77
colortheme: "dove"
@@ -136,7 +136,6 @@ plantuml-format: svg
136136
## Elemente: Zeilenumbruch + Trennlinie
137137

138138
- `<br>` (br = break)
139-
140139
- Zeilenumbruch, nachfolgende Elemente in nächster Zeile
141140

142141
- `<hr>` (hr = horizontal ruler)

0 commit comments

Comments
 (0)