Kapitel 10 # Pflegen und erweitern Deine Website ist online. Ab jetzt zählt nicht mehr der große Start, sondern eine kurze Schleife, die sich immer wiederholt. Dieses Kapitel zeigt dir den Rhythmus, mit dem deine Website über Jahre aktuell bleibt, ohne dass du täglich daran denken musst. 10 Min Gilt für jedes AI Website Template ## Die Schleife für jede Änderung Der Start war ein Weg mit vielen einzelnen Schritten, und den gehst du genau einmal. Alles danach ist dieselbe kurze Schleife. Wenn du sie ein paarmal gegangen bist, ist eine Textänderung eine Sache von zehn Minuten. Die Schleife bleibt gleich, egal ob du ein Wort tauschst oder eine ganze Seite anlegst. Halte dich auch bei Kleinigkeiten daran. Genau die Änderung, die zu klein für eine Prüfung wirkt, ist am Ende die, die etwas verschiebt. ### Sag, was anders sein soll Beschreib deiner KI das Ziel, nicht den Weg. Ein Satz genügt meistens, etwa dass auf der Startseite die Beratung vor der Schulung stehen soll. Ein Wunsch pro Runde, dann bleibt nachvollziehbar, welche Änderung welchen Effekt hatte. ### Sieh es dir lokal an Auf deinem Rechner, nicht auf dem Server. Bei einem Template mit dem Ordner `src` startest du die Vorschau mit `npm run dev` und öffnest die Adresse, die im Terminal steht. Bei einem Template ohne Bauschritt genügt `npx serve .` im Projektordner. ### Lass prüfen, was du nicht siehst Ein kaputter Link, eine fehlende Bildbeschreibung, ein vergessener Seitentitel. Das fällt beim Durchklicken nicht auf. Der Skill Qualitätsprüfung findet es. Bei einer kleinen Textänderung reicht ein kurzer Lauf, bei einer neuen Seite nimmst du den vollständigen. Das schreibst du deiner KI Ich habe gerade folgende Änderung gemacht: [kurz beschreiben]. Prüf die betroffenen Seiten auf kaputte Links, fehlende Bildbeschreibungen, fehlende Titel und Beschreibungen und seitlichen Überlauf auf schmalen Bildschirmen. Sag mir außerdem, ob Navigation, Übersichtsdatei und interne Verlinkung noch zusammenpassen. Kopieren ### Bau die Dateien neu Das gilt nur für Templates mit dem Ordner `src`. Ein `npm run build` schreibt den Ordner `dist` neu. Templates ohne Bauschritt überspringen diesen Punkt, dort sind deine geänderten Dateien schon die fertigen. Warum es zwei Arten gibt, steht im Kapitel [Live gehen](https://ai-website.com/de/docs/launch). ### Lade hoch Denselben Weg wie beim ersten Mal. Bei einer Textänderung reicht die geänderte Datei 1:1 an ihren Platz, nach einem Build ist der komplette Inhalt von `dist` die sichere Wahl. Wenn du öfter etwas änderst, lohnt sich das Upload-Skript aus dem Kapitel [Live gehen](https://ai-website.com/de/docs/launch), dann ist Veröffentlichen ein einziger Befehl. ### Sieh auf der echten Adresse nach Zum Schluss dieselbe Seite noch einmal, aber unter deiner Domain und mit geleertem Zwischenspeicher. Erst dann ist die Änderung wirklich draußen. Warum dieser letzte Schritt zählt, steht gleich im nächsten Abschnitt. **Zwei Änderungen, zwei Runden** Wenn du zwei Dinge ändern willst, geh die Schleife zweimal. Das dauert kaum länger und du weißt im Zweifel sofort, welche der beiden Änderungen es war. Bei fünf Änderungen auf einmal suchst du im Dunkeln. ## Mit geleertem Zwischenspeicher nachsehen Browser merken sich Dateien, damit Seiten beim zweiten Besuch schneller laden. Im Alltag ist das gut. Direkt nach einer Änderung ist es verwirrend, weil du deine Adresse aufrufst und den alten Stand siehst. Die neue Fassung liegt längst auf dem Server, dein Browser zeigt sie nur noch nicht. Deshalb gehört zu jedem Hochladen ein Blick mit geleertem Zwischenspeicher. Ohne ihn hältst du eine gelungene Änderung für gescheitert und lädst sie ein zweites und drittes Mal hoch, ohne dass sich etwas bewegt. - **Neu laden mit gedrückter Taste.**Unter Windows `Strg` und `F5`, auf dem Mac `Cmd`, `Umschalt` und `R`. Damit holt der Browser die Seite frisch vom Server. -**Ein privates Fenster.**Der zuverlässigste Weg, weil dort nichts Gespeichertes liegt. Du siehst die Seite dabei so wie ein fremder Besucher, inklusive Einwilligungs-Dialog. -**Das Telefon extra.**Es hat einen eigenen Zwischenspeicher. Ruf die Seite dort ebenfalls im privaten Modus auf.** Bei Templates ohne Bauschritt zählt die Versionsnummer **In einem Template ohne Bauschritt steht hinter Gestaltungs- und Skriptdateien eine Zahl, etwa `style.css?v=12`. Änderst du eine solche Datei, zähl die Zahl hoch, sonst behalten Besucher die alte Fassung wochenlang. Deine KI macht das mit, wenn du sie daran erinnerst. Templates mit Bauschritt regeln es selbst über die Dateinamen. ## Sicherungen: die billigste Versicherung Vor jedem größeren Umbau legst du eine Kopie deines Projektordners an. Das dauert eine Minute und ist die billigste Versicherung, die du bekommen kannst. Größer heißt: eine neue Sektion, ein Farbwechsel, ein Umbau der Navigation, eine Update-Runde. Für einen getauschten Satz brauchst du keine. Benenn die Kopie nach dem Datum und leg sie neben den Projektordner, nicht hinein. Dann findest du sie ohne Nachdenken wieder und lädst sie nie versehentlich mit auf den Server. -**meine-website** *· dein Arbeitsordner* - **meine-website-2026-08-12** *· Sicherung vor dem Umbau* - **meine-website-2026-05-04** *· die Sicherung davor* Wenn du eine Versionsverwaltung wie Git kennst, ist sie der bessere Weg. Sie hält jeden Zwischenstand einzeln fest, zeigt dir zu jeder Zeile, wann sie sich geändert hat, und du kannst einen einzelnen Schritt zurücknehmen statt des ganzen Tages. Wenn du sie nicht kennst, lern sie nicht extra für deine Website. Ein datierter Ordner tut es auch. - **Der ganze Projektordner kommt mit.**Texte, Bilder, Guideline, Wissensordner und Skills. Den Ordner `node_modules` und den Ordner `dist` kannst du weglassen, beide entstehen jederzeit neu. -**Eine Kopie liegt an einem zweiten Ort.**Ein Duplikat direkt daneben hilft gegen einen Fehlgriff, nicht gegen eine kaputte Festplatte. Eine externe Platte oder ein Cloud-Ordner genügt. -**Drei Stände reichen.**Die letzte, die vorletzte und eine vom Livegang. Ältere kannst du löschen, sonst verlierst du den Überblick. Das schreibst du deiner KI Bevor wir anfangen: Sag mir in einem Satz, was du gleich änderst und welche Dateien du dafür anfasst. Ich lege dann eine Sicherung an. Danach arbeite in kleinen Schritten und mach nach jedem Schritt eine kurze Pause, damit ich mitsehen kann. Kopieren** Öffne die Sicherung einmal **Sieh nach dem Kopieren kurz hinein und prüf, ob wirklich alles darin liegt. Eine Sicherung, die man erst im Ernstfall zum ersten Mal öffnet, ist eine Hoffnung. Eine, die du einmal geöffnet hast, ist eine Sicherung. ## Die Guideline mitwachsen lassen In deinem Projekt liegt eine Datei namens `CLAUDE.md`. Sie beschreibt dein Projekt: was es ist, wie es aufgebaut ist, wo welche Inhalte liegen, welche Regeln gelten und was nie zu tun ist. Deine KI liest sie zu Beginn jeder Sitzung. Sie ist der Grund, warum du nicht jedes Mal von vorn erklären musst. Damit ist auch klar, was passiert, wenn sie stehen bleibt. Ändert sich dein Projekt und die Guideline nicht, arbeitet deine KI später gegen einen Stand, den es nicht mehr gibt. Sie sucht Texte in einer Datei, die du umbenannt hast, und schlägt eine Farbe vor, die du längst getauscht hast. Das sieht nach einem Fehler der KI aus, ist aber ein Fehler in der Beschreibung. Diese Änderungen ziehen die Guideline immer mit: - Eine neue Seite oder eine Seite weniger - Eine neue Leistung, eine neue Rubrik oder ein neuer Punkt in der Navigation - Geänderte Farben, Schriften oder Abstände - Ein angebundener Formularversand oder eine eingetragene Mess-Kennung - Ein Inhalt, der von einer Datei in eine andere umgezogen ist - Eine Regel, die du neu für dein Projekt festlegst, etwa die Anrede oder ein Wort, das nicht vorkommen soll Das schreibst du deiner KI Wir haben in dieser Sitzung Folgendes geändert: [kurze Aufzählung]. Geh CLAUDE.md Abschnitt für Abschnitt durch und aktualisiere jede Stelle, die nicht mehr stimmt. Ergänz, was fehlt, streich, was überholt ist, und zeig mir am Ende, was du geändert hast. Kopieren** Wissensordner und Styleguide gehören dazu **Neben der Guideline liegen der Ordner `Wissen` und die Datei `styleguide.html`. Auch sie beschreiben deinen Stand. Tauschst du eine Farbe im Projekt, zieh sie im Styleguide mit, sonst zeigt er nach einem halben Jahr eine Marke, die es so nicht mehr gibt. ## Ein Rhythmus, der sich hält Eine Website verfällt nicht plötzlich, sie veraltet leise. Ein Preis stimmt nicht mehr, ein Foto zeigt einen Raum, den es nicht mehr gibt, eine verlinkte Seite ist umgezogen. Mit drei festen Terminen bleibst du vorn, ohne täglich daran zu denken. Trag sie dir als Serientermin in den Kalender, dann musst du sie dir nicht merken. | Wann | Was du tust | Dauer | | --- | --- | --- | | Jeden Monat | Einen Inhalt nachlegen: einen Beitrag, eine Referenz, ein aktualisiertes Angebot. Danach die Search Console öffnen und ansehen, über welche Suchbegriffe Menschen zu dir kommen. | eine Stunde | | Jedes Quartal | Den vollständigen Prüflauf laufen lassen. Alle Links durchklicken, auch die nach außen. Fotos, Preise und Zeiten gegen die Wirklichkeit halten. Das Kontaktformular einmal echt abschicken. | zwei Stunden | | Einmal im Jahr | Nachsehen, ob Domain und Hosting verlängert und bezahlt sind. Prüfen, ob Impressum und Datenschutz noch zu dem passen, was die Website tut. Preise, Leistungen und Zahlen bestätigen. Alte Beiträge überarbeiten oder entfernen. | ein halber Tag | Das schreibst du deiner KI Vierteljährlicher Prüflauf. Geh die ganze Website durch und gib mir eine Liste nach Dringlichkeit: kaputte interne Links, Links nach außen, die ins Leere führen, Seiten ohne eigenen Titel oder eigene Beschreibung, Bilder ohne Beschreibung, Seiten, die seit dem Start nicht angefasst wurden, und alle Stellen mit Jahreszahlen, Preisen oder Zeiten, die ich bestätigen sollte. Kopieren** Die Search Console ist der ehrlichste Ratgeber **Sie zeigt dir, mit welchen Suchbegriffen Menschen auf deiner Seite landen. Oft stehen dort Fragen, an die du nie gedacht hättest. Genau daraus wird der nächste Beitrag. Wie du aus einem Suchbegriff eine Seite machst, steht im Kapitel [SEO und Sichtbarkeit](https://ai-website.com/de/docs/seo). ## Neue Inhalte nachlegen Neue Inhalte sind der eigentliche Grund, eine Website selbst zu betreuen. Ein Beitrag, eine Referenz, eine Leistung, die dazugekommen ist. Der Text ist dabei der einfache Teil. Vergessen werden die Stellen ringsherum, denn eine neue Seite ist selten nur eine Datei. Diese Punkte gehören jedes Mal dazu: -**Die Navigation.**Menü oben und Fuß unten. Eine Seite, die von keiner anderen Seite aus erreichbar ist, findet niemand. -**Die Übersichtsseite.**Beiträge und Referenzen stehen zusätzlich in einer Liste. Fehlt dort die Karte, ist der Beitrag zwar online und trotzdem unsichtbar. -**Die Übersichtsdatei für Suchmaschinen.**Deine `sitemap.xml` zählt alle Seiten auf. Neue Seite hinein, gelöschte Seite heraus. -**Interne Verlinkung.**Verlink die neue Seite von mindestens einer bestehenden Seite aus, die zum Thema passt, und von der neuen Seite zurück auf deine Leistungen. Das hilft Besuchern und Suchmaschinen gleichermaßen. -**Titel und Beschreibung.**Jede neue Seite bekommt beides eigens. Eine Kopie der Startseite reicht nicht. -**Das Bild.**Lokal im Projekt ablegen, Beschreibung setzen, Breite und Höhe angeben. Bilder von fremden Adressen bindest du nie ein. Das schreibst du deiner KI Leg einen neuen Beitrag zum Thema [Thema] an und nimm einen bestehenden Beitrag als Muster. Zieh alles mit, was dazugehört: Karte in der Übersicht, Eintrag in der Navigation, wenn er dorthin gehört, Eintrag in der sitemap.xml, eigener Titel und eigene Beschreibung. Setz mindestens einen internen Link zur neuen Seite hin und einen von ihr zurück. Sag mir am Ende, welche Dateien du angefasst hast. Kopieren** Erst nachsehen, dann schreiben **Bevor du einen neuen Beitrag anfängst, prüf, ob es schon einen zum selben Thema gibt. Zwei halbe Beiträge zu einer Frage sind schwächer als einer, der sie ganz beantwortet. Den älteren zu überarbeiten bringt oft mehr als ein neuer. Wie Beiträge aufgebaut sind, steht im Kapitel [Texte und Inhalte](https://ai-website.com/de/docs/content). ## Nach Monaten weitermachen Zwischen zwei Sitzungen behält deine KI nichts. Sie kennt dein Projekt nur aus den Dateien, die sie gerade liest. Kommst du nach vier Monaten zurück und stellst sofort eine Aufgabe, arbeitet sie mit dem, was sie zufällig zuerst sieht. Das geht oft gut und manchmal daneben. Der Wiedereinstieg dauert deshalb fünf Minuten länger und spart dir den halben Nachmittag. Erst lesen lassen, dann handeln. ### Lesen lassen Bitte deine KI, die Guideline, den Wissensordner und die Skills zu lesen, und schreib ausdrücklich dazu, dass sie noch nichts ändern soll. Dieser Halbsatz ist der wichtigste des ganzen Wiedereinstiegs. Ohne ihn fängt sie an. ### Zusammenfassen lassen Lass dir in wenigen Sätzen sagen, was dieses Projekt ist, wie es aufgebaut ist und welche Regeln gelten. Lies die Zusammenfassung wirklich. Steht darin etwas, das nicht mehr stimmt, hast du gerade die veraltete Stelle in deiner Guideline gefunden. Die korrigierst du zuerst. ### Dann erst die Aufgabe Jetzt beschreibst du, was du ändern willst. Ab hier gilt wieder die Schleife vom Anfang dieses Kapitels, mit einer Sicherung, wenn ein größerer Umbau ansteht. Das schreibst du deiner KI Ich komme nach längerer Zeit zu diesem Projekt zurück. Lies zuerst CLAUDE.md, den Ordner Wissen und die Skills. Ändere noch nichts. Fass mir dann in zehn Sätzen zusammen, was dieses Projekt ist, wie es aufgebaut ist, wo die Inhalte liegen und welche Regeln gelten. Nenn mir zum Schluss alles, was dir widersprüchlich oder veraltet vorkommt. Kopieren ## Wenn jemand anderes mitarbeitet Irgendwann arbeitet jemand anderes mit. Eine Texterin, ein Fotograf, eine Kollegin, die Beiträge nachlegt. Dein Template bringt dafür alles mit, was sonst mühsam erklärt werden müsste. ### Der Styleguide ist dein Briefing Die Datei `styleguide.html` liegt in deinem Projektordner und öffnet sich mit einem Doppelklick im Browser, ohne Bauschritt und ohne Installation. Sie zeigt deine Farben in hell und dunkel, deine Schrift in allen Größen und die Bausteine, aus denen deine Seiten bestehen. Wer sie einmal gesehen hat, muss nicht mehr raten, wie eine neue Sektion aussehen soll. Damit beantwortest du auch die Frage, die jeder Dienstleister als Erstes stellt. Statt einer Beschreibung deiner Marke schickst du eine Seite, die sie zeigt. ### Was du weitergibst -**Den Projektordner.**Mit Guideline, Wissensordner, Skills und Styleguide. Wer damit anfängt, ist in einer halben Stunde arbeitsfähig, auch ohne dich. -**Eine Abmachung, wer wann ändert.**Zwei Menschen, die parallel im selben Ordner arbeiten, überschreiben sich gegenseitig. Legt fest, wer die aktuelle Fassung hält, oder nutzt eine Versionsverwaltung. -**Einen eigenen Serverzugang.**Wenn jemand für dich veröffentlicht, richte dafür einen eigenen Benutzer beim Hoster ein. Zugangsdaten gehören nie in den Projektordner. Das schreibst du deiner KI Schreib mir eine Übergabe-Datei für jemanden, der neu in dieses Projekt kommt und kein Entwickler ist. Beantworte darin: Was ist diese Website, wo liegen die Texte, wie sehe ich mir eine Änderung an, wie kommt sie auf den Server und welche drei Dinge darf man auf keinen Fall tun. Kurz, in Alltagssprache, als eigene Datei im Projektordner. Kopieren** Domain und Webspace bleiben auf deinen Namen **Domain, Webspace und Postfach laufen über dein Konto und deine Rechnung. Wer für dich arbeitet, bekommt Zugang, nicht Besitz. So bleibt deine Website auch dann vollständig deine, wenn die Zusammenarbeit endet. Nach dem Ende änderst du das Passwort des zusätzlichen Zugangs. ## Sicherheit und Aktualität Deine Website besteht aus fertigen Dateien. Kein Anmeldebereich, keine Datenbank, keine Erweiterungen, die im Hintergrund laufen. Damit fällt fast alles weg, worüber Websites üblicherweise angegriffen werden. Das ist der ruhigste Teil deiner Pflege. Die Bausteine, aus denen gebaut wird, veralten trotzdem. Sie liegen im Ordner `node_modules` und laufen auf deinem Rechner, nicht auf dem Server. Ein Besucher deiner Website kommt mit ihnen nie in Berührung. Deshalb ist eine Meldung über eine veraltete Abhängigkeit hier selten dringend, und du entscheidest in Ruhe. | Die Lage | Das tust du | | --- | --- | | Du arbeitest sowieso gerade am Projekt | Guter Moment. Sicherung anlegen, Update laufen lassen, neu bauen, die Website einmal komplett ansehen. Klemmt etwas, bist du in zwei Minuten wieder auf dem alten Stand. | | Eine Meldung nennt eine Lücke in einem Baustein | Lass deine KI nachsehen, ob sie den Bauschritt auf deinem Rechner betrifft oder das Ergebnis im Browser. Bei einer statischen Website ist es fast immer der Bauschritt, und dann hat es bis zur nächsten Runde Zeit. | | Seit einem Jahr nichts angefasst | Plan eine Update-Runde ein, mit Sicherung und einem ruhigen Nachmittag. Danach gehst du die Seiten einmal komplett durch, weil Bausteine gelegentlich das Aussehen verändern. | | Morgen ist ein Termin, für den die Seite stehen muss | Lass es. Ein Update ändert Bausteine, und Bausteine ändern manchmal Details im Layout. Verschieb es auf die Zeit danach. | | Alles läuft und du änderst nichts | Lass es laufen. Eine Website, die niemand baut, braucht kein Update. Die Dateien auf dem Server altern nicht. | Zwei Dinge hängen tatsächlich am Server. Das Zertifikat für HTTPS verlängert sich in der Regel von selbst, sieh einmal im Jahr nach, ob es das getan hat. Und wenn dein Template ein Kontaktformular mit Versand mitbringt, hält der Hoster die passende Serverversion aktuell. Beides sind Einstellungen im Kundenbereich, keine Arbeit an deiner Website. Das schreibst du deiner KI Sieh nach, welche Abhängigkeiten dieses Projekts veraltet sind. Sortier sie in zwei Gruppen: betrifft nur den Bauschritt auf meinem Rechner, betrifft das Ergebnis im Browser. Sag mir dann, welche du aktualisieren würdest und welche wir stehen lassen, und begründe es in einem Satz. Ändere noch nichts. Kopieren ## Wenn eine Änderung etwas kaputt macht Irgendwann macht eine Änderung etwas kaputt. Eine Sektion sitzt schief, das Menü klappt nicht mehr zu, der Build bricht ab. Das ist normal und hat einen festen Ablauf. Der häufigste Fehler an dieser Stelle ist, sofort weiterzureparieren. Nach drei Versuchen weiß niemand mehr, welcher Stand welcher ist, und aus einer kleinen Sache wird ein Abend. ### Anhalten und beschreiben Ändere nichts weiter. Halt in zwei Sätzen fest, was du zuletzt getan hast und was du siehst. Diese zwei Sätze sind für deine KI mehr wert als jede Vermutung über die Ursache. ### Zurück zur Sicherung Spiel die Kopie zurück und sieh nach, ob damit wieder alles läuft. Jetzt hast du einen Stand, der funktioniert, und den Kopf frei. Hast du keine Sicherung, ist das der Moment, ab dem du sie anlegst. ### In kleineren Schritten erneut Dasselbe Ziel, aber in Teilstücken. Ein Schritt, ansehen, weiter. Meist zeigt sich schon beim zweiten Teilstück, an welcher Stelle es vorher gehakt hat. ### Die Ursache festhalten Wenn du weißt, woran es lag, schreib einen Satz dazu in deine Guideline. Beim nächsten Mal weiß deine KI es vorher, und dieselbe Stelle kostet dich keine zweite Runde. Das schreibst du deiner KI Nach der letzten Änderung ist Folgendes kaputt: [Beschreibung]. Ich habe die Sicherung vom [Datum] zurückgespielt, damit läuft wieder alles. Lass uns dasselbe Ziel in kleinen Schritten erreichen. Schlag mir die Schritte einzeln vor und warte nach jedem, bis ich mir das Ergebnis angesehen habe. Kopieren** Ein paar Stunden im Jahr genügen ** Der Unterschied zwischen einer Website, die nach zwei Jahren noch trägt, und einer, die dann alt wirkt, sind keine großen Umbauten. Es sind ein paar Stunden, verteilt auf feste Termine. Was zwischendurch an Fragen auftaucht, steht im Kapitel [Fragen und Fehlerbehebung](https://ai-website.com/de/docs/faq). --- Canonical page: https://ai-website.com/de/docs/maintain