Auf dem Weg hierher hast du wahrscheinlich schon den einen oder anderen Fehler gemacht - das ist völlig normal und gehört zum Programmieren dazu! In diesem Kapitel schauen wir uns die häufigsten Fehler noch einmal gesammelt an, und wie man sie systematisch findet.

Die fünf häufigsten Anfängerfehler

Eine Zusammenfassung der Fehler, vor denen in diesem Tutorial bereits gewarnt wurde:

1. Vergessene schließende Tags (Kapitel 4): Ein <p> ohne </p>, oder Tags in falscher Reihenfolge geschlossen.
2. Fehlende oder falsche Anführungszeichen bei Attributen (Kapitel 13): href=https://... statt href="https://...".
3. Falsche Datei- oder Ordnernamen bei relativen Pfaden (Kapitel 14 und 17): Groß-/Kleinschreibung oder Tippfehler bei src/href.
4. id statt class benutzt, wenn ein Wert mehrfach vorkommt (Kapitel 35): führt zu ungültigem HTML, wenn dieselbe id zweimal vergeben wird.
5. label nicht korrekt mit for/id verknüpft (Kapitel 28): das Label ist dann zwar sichtbar, aber technisch nicht mit dem Feld verbunden.

Den Quellcode im Browser ansehen

Ein extrem nützliches Werkzeug, das du wahrscheinlich noch nicht kennst: Fast jeder Browser zeigt dir den tatsächlichen HTML-Code einer beliebigen Webseite an, wenn du mit der rechten Maustaste klickst und "Seitenquelltext anzeigen" (oder "Untersuchen"/"Element untersuchen") auswählst. Das ist großartig, um zu verstehen, wie andere Webseiten aufgebaut sind - probiere es an deinen Lieblingsseiten aus!

Systematisch nach Fehlern suchen

Wenn deine Seite nicht so aussieht wie erwartet, gehe systematisch vor:

1. Erst speichern, dann neu laden: klingt banal, aber ein vergessener Speichern-Klick ist die häufigste Ursache für "meine Änderung wirkt nicht".
2. Von oben nach unten lesen: Öffne den Seitenquelltext und lies deinen HTML-Code Zeile für Zeile - stimmt jede öffnende Klammer mit einer schließenden überein?
3. Den zuletzt geänderten Teil zuerst prüfen: Wenn etwas kaputt gegangen ist, ist es meistens die zuletzt hinzugefügte oder geänderte Zeile.
4. Rückgängig machen und schrittweise wiederholen: Wenn du gar nicht mehr weiterweißt, mach mit Strg+Z die letzten Änderungen rückgängig und füge sie in kleineren Schritten wieder hinzu, mit Speichern und Testen nach jedem Schritt.

Ein Online-HTML-Validator

Es gibt kostenlose Webseiten, die deinen HTML-Code automatisch auf Fehler überprüfen - zum Beispiel den offiziellen W3C-Validator (validator.w3.org). Du kannst dort entweder eine Datei hochladen oder Code direkt einfügen, und bekommst eine Liste möglicher Probleme zurück, oft mit genauer Zeilenangabe.