Wenn etwas nicht funktioniert

Ein Rettungskapitel. Jeder Programmierer steckt manchmal fest – sogar die Besten. So gehst du vor.

Zuerst das Wichtigste

Wenn etwas nicht funktioniert, ist es nicht deine Schuld und du hast nichts kaputtgemacht. Feststecken ist ein völlig normaler Teil des Programmierens. Profi-Programmierer kämpfen jeden Tag mit Bugs – der einzige Unterschied: Sie haben gelernt, sie ruhig zu jagen.

Die goldene Regel: genau lesen

90 % aller Bugs im Code sind Tippfehler. Computer sind unglaublich pingelig:

<h1> funktioniert, <hl> nicht (die Eins vs. ein kleines L)
index.html funktioniert, index. html nicht (ein Leerzeichen zu viel)
Jedes öffnende Tag <p> braucht sein schließendes </p>

Vergleiche deinen Code Buchstabe für Buchstabe mit dem Code in der Lektion. Meist findest du den Fehler innerhalb einer Minute.

Häufige Stolpersteine und wie du sie behebst

„Es öffnet sich nur als Text, nicht als Seite”

Deine Datei heißt wahrscheinlich nicht index.html, sondern etwas wie index.html.txt. In VS Code lösche die Datei und erstelle eine neue – der Name muss genau auf .html enden.

„Ich habe den Code geändert, aber auf der Seite hat sich nichts geändert”

Zwei häufigste Ursachen:

Du hast vergessen zu speichern – drücke Strg+S (Cmd+S auf dem Mac). Eine ungespeicherte Datei hat in VS Code einen Punkt neben dem Namen statt einem X.
Du hast vergessen, die Seite zu aktualisieren – drücke F5 im Browser.

„Auf der Seite stehen komische Zeichen statt Umlauten”

In der Kopfzeile deiner Datei fehlt die Zeile <meta charset="UTF-8">. Füge sie zwischen <head> und </head> ein – sie sagt dem Browser, welchen Zeichensatz dein Text nutzt.

„Das Bild wird nicht angezeigt, nur ein kaputtes Bildsymbol”

Prüfe den Dateinamen in deinem Code – er muss genau gleich sein wie der Dateiname im Ordner, inklusive Endung (photo.jpg ist nicht dasselbe wie photo.JPG oder photo.jpeg).
Das Bild muss im gleichen Ordner wie deine index.html liegen (oder im Ordnerpfad, den du im Code geschrieben hast, wie images/photo.jpg).

„Plötzlich ist die halbe Seite fett / riesig / blau”

Irgendwo fehlt ein schließendes Tag. Zum Beispiel fehlt bei <strong> das </strong>, deshalb bleibt alles bis zum Ende fett. Finde, wo die Seltsamkeit anfängt, und füge das fehlende schließende Tag hinzu.

Wenn du immer noch feststeckst

Mach eine Pause. Ernsthaft. Fünf Minuten aus dem Fenster starren, und der Bug findet sich oft von selbst. Auch Profis machen das.
Lies den kaputten Teil laut vor. Klingt albern, aber es funktioniert – laut Vorlesen lässt dich Dinge bemerken, die deine Augen übersehen.
Bitte um ein zweites Paar Augen. Ein Elternteil, Geschwister, Freund – sie müssen nicht programmieren können, sie müssen nur deinen Code mit der Lektion vergleichen.
Fang einen kleinen Teil neu an. Wenn alles zu viel ist, lösche den letzten Teil, den du hinzugefügt hast, prüfe, dass die Seite wieder funktioniert, und füge ihn dann wieder hinzu – diesmal langsamer.

💡

Merke dir: Jeder Bug, den du behebst, macht dich zu einem besseren Programmierer. Debugging ist keine lästige Pflicht, sondern eine Superkraft, die du gerade aufbaust.