HTML Übungen
HTML Übungen
Aufgaben, Fehleranalyse und Mini-Projekte zur Prüfungsvorbereitung. Diese Seite ist als Lernunterlage, Nachschlagewerk und Prüfungsvorbereitung für die CAP-Ausbildung gedacht.
Lernziele
- HTML-Grundlagen praktisch anwenden
- Fehler in bestehenden Dokumenten finden
- kleine Seiten vollständig und semantisch aufbauen
Erklärung
Übungen sind am wirksamsten, wenn du nicht nur abschreibst, sondern im Browser prüfst und die Struktur mit den DevTools ansiehst. Achte auf valide Elemente, Überschriftenhierarchie, Labels und sinnvolle Linktexte.
Beispiele
<!-- Fehler finden -->
<h3>Meine Seite</h3>
<p>Name<br><br><strong>Über mich</strong></p>
<img src="profil.jpg">
Überlege: Welche Überschrift fehlt? Wo wären echte Absätze besser? Welches Pflichtattribut fehlt beim Bild?
<article>
<h2>Projektkarte</h2>
<p>Beschreibung des Projekts.</p>
<a href="/projekte/cap-lab">Projekt öffnen</a>
</article>
Diese Projektkarte ist eine gute Basis für ein Mini-Projekt.
Typische Fehler
- Nur nach Optik prüfen und die HTML-Struktur ignorieren.
- Alt-Texte und Labels in Übungen weglassen.
- Zu große Aufgaben beginnen, bevor die Grundelemente sitzen.
Best Practices
- Arbeite in kleinen Iterationen: schreiben, öffnen, prüfen, verbessern.
- Nutze die Browser-DevTools, um die erzeugte Struktur zu kontrollieren.
- Erkläre nach jeder Aufgabe kurz, warum du bestimmte Elemente gewählt hast.
Kleine Übung
Mini-Projekt: Erstelle eine persönliche Profilseite mit Navigation, Bild, Kontaktformular, Projektliste und Footer. Verwende nur HTML und achte auf Semantik.
Zusammenfassung
HTML ist dann gut, wenn die Bedeutung der Inhalte klar erkennbar ist. Saubere Struktur, passende Elemente und barrierearme Grundregeln machen Seiten robuster, verständlicher und leichter prüfbar.
Weiterführende Seiten
Zuletzt aktualisiert: 7. Juni 2026