Website programmieren lernen: der Fahrplan mit Zeitbudget und Meilensteinen
Welche Technik in welcher Reihenfolge, wie viele Lernstunden jede der vier Etappen kostet und woran Sie merken, dass eine Etappe wirklich geschafft ist.
Wer sich entschließt, eine Website programmieren zu lernen, steht vor einer anderen Herausforderung als jemand, der sich nur generell informiert. Die monatlichen 110 Suchanfragen für diesen exakten Begriff in Deutschland zeigen, dass es hier nicht um die grundlegende Orientierung geht. Die Frage ist nicht mehr, ob man den Weg wählt, sondern wie der Fahrplan aussieht: Welche Technik wird in welcher Reihenfolge gelernt, wie lange dauern die einzelnen Etappen realistisch, woran wird der eigene Fortschritt messbar und ab welchem Moment rechnet sich der eigene Lernweg im Vergleich zu einem Baukasten?
Der folgende Text ordnet diese Lernschritte und gibt einen realistischen Fahrplan an die Hand. Er baut keine Website mit, enthält keine Schritt für Schritt Anleitung und ersetzt keine Beratung zur Sprachauswahl.
Warum das Zeitbudget vor der Technikliste kommt
Die meisten Lernvorhaben scheitern nicht am Stoff, sondern an der fehlenden Struktur. Ohne definierten Endpunkt fühlt sich jeder Lernabend nach zu wenig an, und irgendwann bleibt der Abend ganz aus. Zwei Regeln helfen, das Vorhaben erfolgreich zu steuern, bevor die erste Zeile Code entsteht.
Rechnen Sie in Lernstunden, nicht in Wochen. Wochen hängen vom Alltag ab, reine Stunden nicht. Wer sechs Stunden pro Woche einplant, braucht für 60 Lernstunden zehn Wochen. Wer drei Stunden schafft, braucht zwanzig. Beides ist in Ordnung, solange die Zahl vorher feststeht und das Budget stimmt.
Definieren Sie den Meilenstein vor der Etappe. Eine Etappe ist nicht beendet, wenn ein Kurs abgehakt ist, sondern wenn eine bestimmte Aufgabe ohne Vorlage gelingt.
Die vier Etappen im Überblick
Der Fahrplan teilt den Lernweg in vier Abschnitte. Jeder hat einen klaren Meilenstein und ein Zeitbudget.
| Etappe | Meilenstein: das gelingt am Ende ohne Vorlage | Budget in Lernstunden |
|---|---|---|
| 1. Struktur und Darstellung | Eine dreiseitige Website aus dem Kopf aufbauen, sauber gegliedert, auf dem Handy lesbar | 40 bis 80 |
| 2. Verhalten im Browser | Ein Formular prüfen, Inhalte nachladen, einen Fehler in der Konsole selbst finden | 60 bis 120 |
| 3. Werkzeuge und Veröffentlichung | Jede Änderung nachvollziehbar sichern, zurückrollen, die Seite unter eigener Adresse erreichbar machen | 15 bis 30 |
| 4. Vertiefung | Eine Anforderung umsetzen, die in keinem Kurs vorkam | ab 80, nach oben offen |
Die Stundenspannen sind Planungsgrößen für den Eigengebrauch. Sie geben an, wie viel Zeit Sie realistisch einplanen müssen.
Etappe 1: Struktur und Darstellung
HTML und CSS bilden die Grundlage. Diese Technologie ist kein bewegliches Ziel. HTML5 wurde am 28. Oktober 2014 vom W3C als Recommendation verabschiedet. Seither wird HTML von der WHATWG als Living Standard gepflegt. Was Sie hier lernen, bleibt also dauerhaft gültig, es kommt nur gelegentlich etwas Neues hinzu.
Ein brauchbarer Einstieg kostet nichts. Microsoft stellt beispielsweise ein kostenloses Einstiegsmodul bereit, in dem ein erstes Webprojekt in Visual Studio Code aus einer Webseite, einer CSS Datei und einer JavaScript Datei aufgebaut wird. In der Community r/learnprogramming werden freeCodeCamp und Codecademy als Einstiegsressourcen für die Webentwicklung empfohlen.
Der Meilenstein ist bewusst anspruchsvoll formuliert: drei Seiten, aus dem Kopf, ohne offenes Tutorial daneben. Wer das schafft, hat die Etappe hinter sich, auch wenn der Kurs noch Kapitel offen hat.
Etappe 2: Verhalten im Browser
Hier wird aus der reinen Darstellung echte Interaktion. Diese Etappe ist die längste, und das ist normal. Es ist die erste Phase, in der Sie echte Programmierlogik lernen und nicht nur Struktur beschreiben.
Der Meilenstein liegt weniger im Schreiben als im Lesen. Wer einen Fehler in der Browser Konsole selbst findet und behebt, ohne die Meldung einfach zu kopieren und in einer Suchmaschine einzugeben, hat den entscheidenden Sprung gemacht. Ab diesem Punkt wird das Lernen deutlich schneller, weil Sie sich nicht mehr bei jedem kleinen Problem blockieren.
Etappe 3: Werkzeuge und Veröffentlichung
Diese Etappe ist die kürzeste und wird trotzdem oft übersprungen. Sie umfasst den Editor, die Versionsverwaltung und den Weg vom eigenen Rechner ins Netz.
Git wurde 2005 von Linus Torvalds für die Versionsverwaltung des Linux Kernels entwickelt und ist heute Standard. Der praktische Nutzen für das eigenständige Lernen ist stark unterschätzt: Sie können jeden Stand wiederherstellen. Das nimmt die Angst vor Experimenten, und Experimente sind der eigentliche Lernstoff. Fünfzehn bis dreißig Stunden reichen aus, um sich eine Arbeitsweise anzueignen, die Sie danach jahrelang begleitet.
Etappe 4: Vertiefung
Ab hier gibt es keinen gemeinsamen Weg mehr. Das Handbuch “Webseiten programmieren und gestalten” des Rheinwerk Verlags deckt neben HTML und JavaScript auch PHP, UX und Barrierefreiheit im Web ab. Diese Breite zeigt das Problem: Sie können nicht alles gleichzeitig vertiefen.
Wählen Sie nach Bedarf, nicht nach Interesse. Wer Daten speichern muss, geht in Richtung Serverlogik. Wer eine öffentliche Seite betreibt, geht in Richtung Barrierefreiheit und Ladezeit. Die Frage nach der passenden Programmiersprache klärt sich dabei von selbst, sie ist eine Folge des Bedarfs und kein eigener Lernschritt.
Woran der Fortschritt messbar wird
Vier Indikatoren sind belastbarer als abgehakte Kapitel in einem Kurs.
Referenz statt Tutorial: MDN Web Docs wird von Mozilla betrieben und dokumentiert HTML, CSS und JavaScript als Referenz für Webentwicklerinnen und Webentwickler. Wenn Sie anfangen, dort gezielt eine Eigenschaft nachzuschlagen, statt ein Video zum ganzen Thema zu suchen, arbeiten Sie bereits wie Profis.
Zeit bis zur Lösung: Notieren Sie bei jedem Fehler, wie lange Sie gebraucht haben. Die absolute Zahl ist egal, der Trend über acht Wochen ist die eigentliche Fortschrittsmessung.
Nachbau ohne Vorlage: Bauen Sie einmal pro Etappe etwas, das Sie schon einmal mit Anleitung gebaut haben, diesmal ohne Anleitung. Was fehlt, ist Ihre offene Baustelle.
Die fremde Anforderung: Können Sie etwas umsetzen, das in keinem Ihrer Kurse vorkam? Das ist der Übergang von “gelernt” zu “kann ich”.
Ab wann sich der Lernweg gegenüber einem Baukasten trägt
experte.de unterscheidet fünf Wege zur eigenen Website, von HTML von Hand geschrieben bis zum Homepage Baukasten. Dieser Text vergleicht die Methoden nicht, er beantwortet nur die Frage, ab wann sich die investierten Lernstunden gegenüber der einfachsten Variante rechnen.
Der Kipppunkt liegt selten beim Geld und fast immer bei der Wiederholung. Drei Fragen entscheiden:
- Wie oft ändert sich etwas? Eine Seite, die einmal steht und dann fünf Jahre liegt, rechtfertigt keine 200 Lernstunden. Eine Seite, an der Sie monatlich arbeiten, rechnet sich nach dem ersten Jahr.
- Wie viele Projekte kommen noch? Die Etappen 1 bis 3 zahlen Sie einmal. Ab dem zweiten Projekt fallen nur noch die reinen Bauzeiten an.
- Gibt es eine Anforderung, die kein Standardwerkzeug abbildet? Sobald die Antwort ja lautet, ist die Frage ohnehin entschieden.
Wer alle drei Fragen verneint, sollte das Lernen nicht abbrechen, aber es ehrlich als Interesse verbuchen und nicht als Investition.
Drei Umwege, die das Budget sprengen
Die Werkzeugrecherche vor dem ersten Ergebnis: Editor, Erweiterungen und Terminal Konfiguration gehören in Etappe 3, nicht in die erste Woche.
Die Tutorial Endlosschleife: Zwei Kurse zum selben Thema sind kein Fortschritt, sondern eine Vermeidungsstrategie. Der Meilenstein pro Etappe ist genau dagegen gebaut.
Die Sprachrecherche: Wochenlang zu vergleichen, was man lernen sollte, kostet Stunden aus Etappe 1 und liefert keinen einzigen Meilenstein.
Was am Ende des Fahrplans steht
Nach den vier Etappen sind Sie nicht fertig, und das ist kein Mangel. Sie sind an dem Punkt, an dem Sie eine Anforderung in Arbeitsschritte übersetzen, den nötigen Stoff gezielt nachschlagen und einschätzen können, wie lange etwas dauert.
Diese letzte Fähigkeit ist die wertvollste. Sie ist auch der Grund, warum der Fahrplan mit einem Zeitbudget beginnt und nicht mit einer Technikliste.
