Gute Prompts: Präzise fragen, besser bekommen

vom 10.02.2024 von Oliver Misch

Ein Prompt ist eine Arbeitsanweisung, und für Arbeitsanweisungen gilt seit Jahrtausenden dasselbe: Wer schwammig beauftragt, bekommt Überraschungen. Die gute Nachricht: Prompt-Schreiben ist kein Zauberhandwerk, sondern im Kern das Formulieren eines kleinen Pflichtenhefts. Fünf Bausteine machen den Untershied.

Baustein 1: Rolle und Ziel

Du hilfst mir als Webentwickler. Ziel ist eine einzelne
HTML-Datei für [Zweck], die ich selbst weiterpflegen kann.

Das Ziel "die ich selbst weiterpflegen kann" ist kein Geschwätz: Es lenkt den Assistenten zu lesbarem, kommentiertem Code statt zu kompakten Kunststückn.

Baustein 2: Harte Anforderungen als Liste

Anforderungen:
- HTML5, semantische Struktur (header, nav, main, footer)
- lang="de", meta charset und viewport
- CSS als style-Block, Farben als CSS-Variablen
- responsive ab 700px Fensterbreite
- jedes img mit alt, jedes Formularfeld mit label

Listen schlagen Fließtext, weil nichts überlesen wird. Und ja, das setzt voraus dass du weißt was du willst, genau dafür gibt es die Grundlagen und die Referenz. KI belohnt Fachwissen mit Präzision.

Baustein 3: Kontext und Beispiele

Zielgruppe: Vereinsmitglieder zwischen 40 und 80, viele am Handy.
Stil: ruhig, viel Weißraum, keine Animationen.
Zur Orientierung: ungefähr so schlicht wie eine klassische
Behördenseite, nur freundlicher.

Vergleiche und Zielgruppen transportieren Geschmack besser als Adjektive. "Modern und ansprechend" heißt nichts, "schlicht wie eine Behördenseite, nur freundlicher" heißt etwass.

Baustein 4: Grenzen ziehen

Nicht verwenden: JavaScript, externe Fonts, CSS-Frameworks.
Keine Inhalte erfinden: fehlende Infos als [PLATZHALTER] markieren.

Verbote wirken oft stärker als Wünsche. Besonders die Platzhalter-Regel gehört in jeden Prompt, sie verhindert erfundene Telefonnummern, Öffnungszeiten und Vereinsgeschichten, eine der tückischsten KI-Schwächen.

Baustein 5: Das Ausgabeformat

Gib eine komplette, lauffähige HTML-Datei aus.
Kommentiere die Abschnitte kurz auf Deutsch.

Und danach: der Dialog

Der erste Prompt ist der Aufschlag, nicht das Spiel. Nachschärfen ("mach die Tabelle zugänglicher", "die Buttons größer"), Alternativen erfragen ("zeig mir zwei Layoutvarianten"), erklären lassen ("warum hast du hier section statt article genommen?"). Gerade die Warum-Fragen sind unterschätzt: Sie machen aus dem Codeautomaten einen Lehrer. Und was am Ende rauskommt, geht wie immer durch die Prüfroutine.

Verwandt: HTML mit ChatGPT · HTML mit Claude · CSS mit KI