KI-Coding-Tools für Websites, wie Cursor und Claude Code, sind Assistenten, die Projektdateien lesen, Codeänderungen vorschlagen und Befehle auf Anweisung eines Entwicklers ausführen. In einer Agentur beschleunigen sie repetitive Build-Aufgaben, Refactoring und Debugging, während Menschen weiterhin die Verantwortung für Architektur, Designentscheidungen, Sicherheitsüberprüfungen und die endgültige Abnahme tragen, bevor etwas auf die Live-Website eines Kunden gelangt.
Was sind Cursor und Claude Code?
Cursor ist ein Code-Editor, der auf der Open-Source-Basis von Visual Studio Code aufbaut und von der Firma Anysphere entwickelt wurde. Er fügt KI-Funktionen direkt in den Editor ein: Inline-Vervollständigungen, ein Chat-Panel, das das geöffnete Projekt sehen kann, und einen Agentenmodus, der mehrere Dateien gleichzeitig bearbeitet. Entwickler können zwischen Modellen verschiedener Anbieter wählen.
Claude Code ist das Befehlszeilen-Tool von Anthropic. Es läuft in einem Terminal, liest das Repository und kann Dateien bearbeiten, Tests ausführen und git verwenden, wenn der Entwickler dies erlaubt. Es ist auch innerhalb von Editoren und Desktop-Apps verfügbar. Seine Stärke liegt in der Bearbeitung mehrstufiger Aufgaben, wie z. B. das Verfolgen eines Fehlers über ein Theme und zwei Plugins hinweg, wobei es vor riskanten Aktionen um Erlaubnis fragt.
Beide Tools sind nur so gut wie der Kontext, den sie erhalten. Ein Projekt mit einer klaren Struktur, schriftlichen Konventionen und funktionierenden Tests liefert weitaus bessere Ergebnisse als ein Wirrwarr aus kopierten Schnipseln.
Welche Teile eines Website-Builds beschleunigen sie?
Die Gewinne konzentrieren sich auf Arbeit, die klar definiert, aber mühsam ist. Ein Mensch entscheidet immer noch, was passieren soll; das Tool übernimmt einen Großteil des Tippens und Suchens.
- Scaffolding: Erstellen von Block-Templates, benutzerdefinierten Beitragstypen oder Komponentendateien, die einem bestehenden Muster folgen.
- Refactoring: Umbenennen von Funktionen über Dateien hinweg, Aufteilen eines großen Stylesheets in Komponentendateien, Entfernen von totem Code.
- Debugging: Lesen von Fehlerprotokollen, Finden der Stelle, an der ein Wert falsch läuft, und Vorschlagen einer Korrektur zum Testen.
- Barrierefreiheits-Checks: Hinzufügen fehlender Labels, Alt-Attribute und Fokus-Styles, dann Überprüfung des Kontrasts.
- Datenskripte: Einmalige Importe, URL-Weiterleitungskarten und Inhaltsbereinigungen für Migrationen.
- Dokumentation: Schreiben von README-Notizen für Entscheidungen, damit der nächste Entwickler sie versteht.
Wo treffen Menschen weiterhin die Entscheidungen?
Mehrere Bereiche bleiben fest in menschlicher Hand, egal was das Tool vorschlägt. Informationsarchitektur, das visuelle Designsystem und Markenentscheidungen stammen aus Strategie und Forschung, nicht aus der Codegenerierung. Das gilt auch für jede Entscheidung darüber, welche Daten eine Website sammelt und wohin sie fließen.
Sicherheit ist das klarste Beispiel. Ein Assistent kann einen Formular-Handler schreiben, der funktioniert, aber Nonce-Prüfungen, Eingabebereinigung oder Berechtigungsprüfungen übersieht. Jede Änderung, die Benutzereingaben, Zahlungen oder Authentifizierung betrifft, erhält eine zeilenweise menschliche Überprüfung, egal wie sauber sie aussieht.
Wie Alien Road Cursor und Claude Code in Kundenprojekten einsetzt
Die Discovery steht an erster Stelle und findet ohne KI-Tools statt: Wir vereinbaren Ziele, Seitentypen, Integrationen und Inhaltsquellen mit dem Kunden. Das Ergebnis ist ein schriftliches Briefing und eine Projektkonventionsdatei, die die Ordnerstruktur, Namensregeln und Dinge beschreibt, die niemals geändert werden dürfen. Diese Datei wird später zum Kontext für die Coding-Tools.
Das Setup läuft in einer lokalen Entwicklungsumgebung, typischerweise Docker, niemals direkt auf einem Live-Server. Entwickler verwenden Claude Code oder Cursor für Aufgaben wie das Generieren einer Reihe von Blockmustern aus genehmigten Designs oder das Schreiben des Import-Skripts, das alte Blogbeiträge in eine neue Struktur verschiebt. Eine Migration könnte beispielsweise Hunderte von Beiträgen umfassen, bei denen das Tool das Skript schreibt, aber ein Entwickler führt es zuerst im Dry-Run-Modus aus und prüft eine Stichprobe manuell.
Jede Änderung durchläuft git. Commits sind klein, Nachrichten erklären den Grund, und nichts wird ohne eine menschliche Überprüfung des Diffs gemergt. Die Messung umfasst die Build-Zeit pro Seitenvorlage, bei Tests gefundene Fehler und Core Web Vitals nach dem Start. Kunden erhalten einen kurzen Bericht, der auflistet, was automatisiert, was überprüft und was getestet wurde.
Wie hält man KI-geschriebenen Code zuverlässig?
Das Hauptrisiko ist Code, der richtig aussieht und einen flüchtigen Blick besteht, aber bei Randfällen versagt. Modelle neigen auch dazu, neue Hilfsfunktionen hinzuzufügen, anstatt bestehende wiederzuverwenden, was eine Codebasis langsam aufbläht.
Schreiben Sie die Regeln auf
Beide Tools lesen Projektanweisungsdateien. Claude Code verwendet eine CLAUDE.md-Datei; Cursor unterstützt Regeldateien. Zeichnen Sie die Entscheidungen auf, deren Erlernen Sie Zeit gekostet hat, z. B. warum eine Vorlagendatei nicht gelöscht werden darf oder welche Funktion Pfade verarbeitet. Das Tool vermeidet dann die Wiederholung alter Fehler.
Testen Sie, was wichtig ist
Führen Sie nach jeder Bearbeitung Linting- und Syntaxprüfungen durch, z. B. php -l für PHP-Dateien. Führen Sie eine kurze Liste von URLs, die nach jeder Änderung geladen werden sollen, um auf Fehler zu prüfen. Überprüfen Sie bei Layoutarbeiten Breiten wie 390, 768 und 1440 Pixel, bevor Sie eine Aufgabe als erledigt betrachten.
Beschränken Sie Berechtigungen
Erlauben Sie Lesezugriff und Dateibearbeitungen frei, erfordern Sie aber eine Bestätigung für Befehle, die Daten löschen, Code pushen oder Datenbanken berühren. Fügen Sie niemals Produktions-API-Schlüssel in einen Prompt oder eine Datei ein, die das Tool committen kann.
Was sollte ein Kunde eine Agentur fragen, die diese Tools verwendet?
- Wird jede KI-unterstützte Änderung vor der Bereitstellung von einem namentlich genannten Entwickler überprüft?
- Wo erfolgt die Entwicklung und verlassen Kundendaten diese Umgebung?
- Welche Teile des Codes werden durch Tests oder manuelle Prüfungen abgedeckt?
- Wem gehören der Code und die Anweisungsdateien am Ende des Projekts?
- Wie werden Geheimnisse wie API-Schlüssel aus Prompts und Repositories herausgehalten?
Klare Antworten darauf zeigen, dass die Agentur die Tools als Instrumente behandelt, nicht als Ersatz für Handwerk. Vage Antworten sind ein Warnsignal.
Welche Fehler machen Teams, wenn sie diese Tools zum ersten Mal einsetzen?
Der häufigste Fehler ist, zu viel in einer Anfrage zu verlangen. Ein Prompt wie “baue den Header neu” lädt das Tool ein, Dateien umzuschreiben, die es gar nicht anfassen muss. Kleinere, spezifische Aufgaben, wie das Verschieben des Suchbuttons hinter den Sprachumschalter bei Breiten über 1080 Pixel, erzeugen Änderungen, die ein Prüfer in Minuten kontrollieren kann.
Der zweite Fehler ist das Überspringen der lokalen Kopie. Einen Agenten gegen einen Staging-Server laufen zu lassen, fühlt sich schneller an, aber ein falscher Befehl kann Uploads oder Einstellungen überschreiben. Eine wegwerfbare lokale Umgebung mit einem frischen Datenbankexport beseitigt dieses Risiko und lässt Entwickler zwei Ansätze nebeneinander ausprobieren, bevor sie sich für einen entscheiden.
Wo man diese Woche anfangen kann
Wenn Sie Ihre eigene Website betreiben, beginnen Sie mit einer schreibgeschützten Aufgabe. Installieren Sie eines der Tools auf einer lokalen Kopie des Projekts und bitten Sie es zu erklären, wie das Theme seine Styles lädt oder wo eine bestimmte Funktion lebt. Vergleichen Sie die Antwort mit Ihrem Wissen. Schreiben Sie dann eine einseitige Konventionsdatei für das Projekt. Selbst wenn Sie nie zulassen, dass ein Assistent eine Zeile bearbeitet, wird diese Datei dem nächsten Entwickler Stunden sparen.
Weiterlesen: Webdesign und Entwicklung · Webdesign