Vereinsseite mit KI selber bauen — das vollständige Handbuch

Ein vollständiger Weg vom leeren Ordner bis zur fertigen Seite im Netz — gebaut mit einer KI als Handwerker und Ihnen als Bauherr. Am Ende ändern Sie jede Zeile selbst, ohne jemanden zu fragen. Dieses Handbuch ist für Menschen geschrieben, die mit dem Rechner umgehen können, aber noch nie programmiert haben.

Was in diesem Handbuch steht

1. Das Prinzip: Sie beschreiben, die KI baut
2. Was Sie brauchen — vier Bausteine
3. Webspace: FTP oder SSH, mit konkreten Tarifen
4. Einrichten an einem Abend
5. Die Ordnerstruktur
6. Der erste Auftrag an die KI
7. Wie man mit einer KI spricht
8. Aufbau einer Vereinsseite
9. Inhalte selbst pflegen
10. Hochladen und veröffentlichen
11. Recht: Impressum bis Schriften
12. Wenn etwas kaputt ist
13. Sicherung und Sicherheit
14. Lernplan über vier Wochen
15. Zwölf Fallen
16. Prompt-Bibliothek zum Kopieren

1. Das Prinzip: Sie beschreiben, die KI baut

Eine Webseite ist am Ende nichts weiter als ein Ordner mit Textdateien. Eine Datei je Seite, eine Datei für das Aussehen, ein Ordner mit Bildern. Dieser Ordner liegt auf einem Server, und ein Browser liest ihn vor. Mehr ist es nicht.

Der entscheidende Punkt: Sie müssen diese Dateien nicht schreiben können — Sie müssen sie lesen können. Das ist ungefähr der Unterschied zwischen ein Auto bauen und die Motorhaube aufmachen und sehen, wo das Öl fehlt. Das Zweite lernt man in wenigen Wochen.

Die KI baut. Sie sagen, was gebaut werden soll, Sie schauen sich das Ergebnis an, Sie sagen, was noch nicht stimmt. Nach drei, vier Runden sitzt es. Und weil Sie jedes Mal sehen, welche Datei sich geändert hat und warum, lernen Sie beim Zuschauen.

Warum reine Dateien und kein Redaktionssystem

Ein Redaktionssystem nimmt Ihnen das Tippen ab und gibt Ihnen dafür eine Datenbank, laufende Aktualisierungen, Sicherheitslücken und ein System, das Sie nicht mehr verstehen. Für eine Vereinsseite mit acht bis fünfzehn Seiten ist das der falsche Handel. Reine Dateien sind schneller, halten zehn Jahre ohne Pflege, brauchen wenig Speicher und lassen sich mit einer KI in Minuten ändern. Und wenn Ihr Server morgen ausfällt, kopieren Sie den Ordner auf einen anderen — fertig.

2. Was Sie brauchen — vier Bausteine

Zusammen rund 25 bis 30 Euro im Monat, davon gut zwei Drittel für die KI.

Dazu kommt nichts. Kein fremdes System, keine Lizenz, keine Erweiterung, kein Wartungsvertrag. Wenn Sie die KI nach einem Jahr nicht mehr brauchen, kündigen Sie das Abo und die Seite läuft trotzdem weiter — sie besteht ja nur aus Dateien.

Claude Code oder Codex?

Claude Code läuft im Terminal, arbeitet direkt im Ordner und erklärt auf Nachfrage sehr geduldig. Stark, wenn Sie viel in normaler Sprache beschreiben und wenig Fachbegriffe kennen. Im Pro-Abo enthalten, teilt sich das Kontingent mit dem normalen Chat.

Codex gibt es im Terminal und als Oberfläche im Browser. Sehr gut darin, viele Dateien auf einmal umzubauen. Im Plus-Abo enthalten. Wer ohnehin ChatGPT nutzt, spart sich ein zweites Abo.

Nehmen Sie eins. Nicht beide. Zwei KI-Werkzeuge, die parallel in denselben Dateien arbeiten, überschreiben sich gegenseitig — das ist der häufigste Anfängerfehler.

3. Webspace: FTP oder SSH

Es gibt zwei Wege, wie Ihre Dateien vom Rechner auf den Server kommen.

FTP ist wie ein Kopierbefehl. Links sehen Sie Ihre Dateien, rechts die auf dem Server, und ziehen sie hinüber. Funktioniert bei jedem Anbieter, auch beim günstigsten Tarif. Die KI kann das nicht selbst erledigen — sie baut, Sie laden hoch.

SSH ist eine echte Kommandozeile auf dem Server. Damit können Sie dort Befehle ausführen: kopieren, sichern, prüfen, das Fehlerprotokoll des Servers lesen. Und — das ist der eigentliche Gewinn — die KI kann diesen Weg mitbenutzen, wenn Sie es erlauben. Aus ich baue, Sie laden hoch wird ich baue und lade hoch, Sie schauen darauf.

Konkrete Tarife mit SSH-Zugang

Was Sie nach der Bestellung bekommen

Fünf Angaben liegen dann in Ihrem Kundenbereich. Notieren Sie sie an einem Ort, den nur Sie sehen — nicht in einer Chatnachricht, nicht in einer Mail:

• Servername, etwa hosting123456.anbieter.net
• Benutzername
• Passwort
• SSH-Port, meistens 22
• Pfad zum Webordner, meistens httpdocs oder html

Diese fünf Angaben sind alles, was die KI später braucht, um für Sie hochzuladen.

4. Einrichten an einem Abend

Sechs Schritte. Wer zügig liest und tippt, ist in gut einer Stunde durch.

Schritt 1 — Editor installieren

Visual Studio Code herunterladen und installieren. Beim ersten Start die deutsche Sprachdatei annehmen, wenn sie angeboten wird.

Schritt 2 — Ordner anlegen

Legen Sie auf dem Rechner einen Ordner an, etwa Dokumente/vereinsseite. In VS Code dann Datei, Ordner öffnen, diesen Ordner wählen. Alles Weitere passiert in diesem einen Ordner.

Schritt 3 — Terminal öffnen

In VS Code über Terminal, Neues Terminal. Unten erscheint ein Feld mit einem blinkenden Strich. Das ist die Kommandozeile. Sie ist nicht gefährlich — sie tut nur, was man ihr sagt, und sie sagt es Ihnen vorher, wenn Sie fragen.

Schritt 4 — KI-Werkzeug installieren

Für Claude Code zuerst Node.js installieren, dann im Terminal eintippen:

npm install -g @anthropic-ai/claude-code

Danach claude tippen und Eingabe drücken. Beim ersten Start melden Sie sich mit Ihrem Abo an. Für Codex läuft es fast gleich, nur mit dem Paket von OpenAI.

Schritt 5 — Zugangsdaten hinterlegen

Legen Sie im Ordner eine Datei .env an und schreiben Sie die Serverdaten hinein. Diese Datei bleibt auf Ihrem Rechner und wird nie hochgeladen.

SERVER=hosting123456.anbieter.net
BENUTZER=ihr-benutzername
ZIELORDNER=/httpdocs

Das Passwort gehört nicht in diese Datei. Dafür gibt es den nächsten Schritt.

Schritt 6 — Schlüssel statt Passwort

Einmal im Terminal ausführen, danach tippen Sie nie wieder ein Passwort:

ssh-keygen -t ed25519
ssh-copy-id [email protected]

Beim ersten Befehl dreimal Eingabe drücken, beim zweiten einmal das Serverpasswort eingeben. Ab jetzt öffnet ssh ihr-benutzername@servername die Verbindung ohne Nachfrage. Wenn Ihnen das zu viel ist: überspringen Sie es, arbeiten Sie erst mit FTP und holen Sie es später nach.

5. Die Ordnerstruktur

Wer weiß, wo was liegt, findet auch, was kaputt ist.

vereinsseite/
  index.php          Startseite
  verein.php         Über uns
  termine.php        Termine
  vorstand.php       Wer macht was
  beitritt.php       Mitglied werden
  kontakt.php        Kontakt
  impressum.php      Pflicht
  datenschutz.php    Pflicht
  inc/
    kopf.php         Logo und Menü, einmal für alle Seiten
    fuss.php         Fußbereich, einmal für alle Seiten
    termine.txt      Termine als schlichte Liste
  css/
    stil.css         Das gesamte Aussehen
  img/               Bilder
  schriften/         Selbst abgelegte Schriften
  .env               Zugangsdaten, bleibt auf Ihrem Rechner

Warum .php und nicht .html? Wegen der Datei inc/kopf.php. Sie enthält das Menü. In jeder Seite steht oben eine einzige Zeile, die diese Datei hereinholt. Ändern Sie das Menü, ändern Sie es an einer Stelle statt an fünfzehn. Das ist der wichtigste Trick des ganzen Handbuchs, und er kostet Sie keine Zeile Programmierung — Ihr Webspace kann PHP von Haus aus.

<?php include 'inc/kopf.php'; ?>

6. Der erste Auftrag an die KI

Ein langer, genauer Auftrag zu Beginn spart zwanzig kurze Korrekturen danach. Starten Sie claude im Ordner und geben Sie den folgenden Text ein. Passen Sie vorher die Angaben in eckigen Klammern an.

Auftrag 1 — Grundgerüst

Du baust mit mir zusammen die Webseite für einen Verein.
Ich bin keine Programmiererin, aber ich will verstehen,
was du tust. Erkläre mir nach jeder Änderung in zwei
Sätzen, welche Datei sich geändert hat und warum.

Der Verein:
- Name: [Vereinsname]
- Ort: [Ort]
- Zweck: [in einem Satz]
- Mitglieder: [ungefähre Zahl]
- Farben: [zwei Farben, oder: schlag mir welche vor]

Bau mir das Grundgerüst:
- Startseite, Über uns, Termine, Vorstand, Mitglied
  werden, Kontakt, Impressum, Datenschutz
- Kopf und Fuß als PHP-Include in inc/, damit ich das
  Menü nur an einer Stelle pflegen muss
- Eine einzige CSS-Datei css/stil.css
- Mobil zuerst, dann Bildschirm
- Ohne fremde Bibliotheken, ohne Rahmen von außen
- Schriften lege ich selbst in schriften/ ab, keine
  Einbindung von fremden Servern
- Echte Umlaute, UTF-8, Sprache Deutsch

Baue erst die Dateien mit Platzhaltertext. Die Inhalte
liefere ich danach. Fang an und zeig mir am Ende die
Liste der angelegten Dateien.

Nach zwei bis drei Minuten steht das Gerüst. Öffnen Sie die Dateien in VS Code und schauen Sie hinein — auch wenn Sie nur die Hälfte verstehen. Nach drei Tagen sind es sechzig Prozent.

Ansehen, bevor es hochgeht

Sie wollen die Seite sehen, ohne sie zu veröffentlichen. Ein Befehl im Terminal genügt:

php -S localhost:8000

Dann im Browser http://localhost:8000 aufrufen. Falls PHP auf Ihrem Rechner fehlt, sagen Sie der KI: Ich habe kein PHP lokal, richte mir bitte den einfachsten Weg ein, die Seite vorab anzusehen. Sie erledigt das.

7. Wie man mit einer KI spricht

Das ist die eigentliche Fähigkeit. Der Rest ist Technik.

1. Ein Auftrag je Runde. Nicht mach die Termine schöner und bau ein Formular ein und ändere die Farben. Drei Dinge, drei Runden. Sonst wissen Sie bei einem Fehler nicht, welche Änderung schuld war.
2. Sagen Sie, was Sie sehen, nicht was Sie vermuten. Auf dem Handy ragt die Überschrift rechts aus dem Bild ist brauchbar. Das CSS ist kaputt ist eine Vermutung und führt in die Irre.
3. Nennen Sie die Datei. In termine.php ist besser als auf der Terminseite. Die KI arbeitet mit Dateinamen.
4. Lassen Sie sich erklären. Erklär mir in drei Sätzen, was diese Zeile macht kostet nichts und ist der schnellste Lernweg, den es gibt.
5. Sagen Sie Nein. Wenn ein Vorschlag etwas einbaut, das Sie nicht wollten — Bewegungseffekte, ein fremdes Werkzeug, ein Bezahlfeld —, sagen Sie: Nimm das wieder raus, das brauche ich nicht. Die KI schlägt gern mehr vor als nötig.
6. Prüfen Sie nach jeder Runde im Browser. Nicht drei Änderungen sammeln und dann schauen.

Der wichtigste Satz überhaupt

Hängen Sie ihn an jeden Auftrag, bei dem Sie unsicher sind:

Bremse

Bevor du etwas änderst: sag mir in Stichpunkten, welche
Dateien du anfassen willst und was du jeweils vorhast.
Dann warte auf mein Ja.

Dieser Satz allein verhindert die meisten Momente, in denen man hinterher denkt: Was hat sie da jetzt gemacht?

8. Aufbau einer Vereinsseite

Was Sie weglassen können: Bildergalerien mit dreihundert Fotos vom Sommerfest — die pflegt nach dem zweiten Jahr niemand mehr. Nachrichtenbereiche, die dann leer stehen. Einen internen Bereich mit Anmeldung, solange niemand danach gefragt hat. Zähler, Wetterfelder und Besucherstatistiken auf der Seite selbst.

Die Termine sind das Herz

Bei fast jedem Verein ist die Terminseite der Grund, warum überhaupt jemand die Adresse eintippt. Bauen Sie sie so, dass Sie sie in dreißig Sekunden pflegen können. Dieser Auftrag macht genau das:

Auftrag 2 — Termine ohne Programmieren pflegen

Bau die Terminverwaltung so um, dass ich alle Termine in
einer einzigen Datei inc/termine.txt pflege, eine Zeile
je Termin, Felder mit Semikolon getrennt:

Datum;Uhrzeit;Titel;Ort;Beschreibung

termine.php liest diese Datei, sortiert nach Datum,
zeigt nur kommende Termine und blendet vergangene
automatisch aus. Die nächsten zwei Termine erscheinen
zusätzlich auf der Startseite.

Schreib mir zwei Beispielzeilen als Vorlage in die Datei
und erklär mir in drei Sätzen, wie ich eine neue Zeile
anlege.

Ab da pflegen Sie Termine, indem Sie eine Textzeile schreiben. Kein Programmieren, keine KI nötig, kein Passwort für ein Verwaltungssystem. Das kann auch die Schriftführerin.

9. Inhalte selbst pflegen

Text ändern

Datei in VS Code öffnen, den Text zwischen den spitzen Klammern suchen, überschreiben, speichern, hochladen. Die spitzen Klammern selbst bleiben stehen. Das ist alles, was Sie für neunzig Prozent aller Änderungen wissen müssen.

Bild tauschen

Neues Bild in den Ordner img/ legen, gleicher Name wie das alte, hochladen, fertig. Vorher verkleinern: ein Bild für das Netz braucht selten mehr als 1600 Pixel Breite und 300 Kilobyte. Die KI baut Ihnen auf Wunsch ein kleines Skript, das das automatisch erledigt.

Neue Seite anlegen

Auftrag 3 — Seite ergänzen

Leg eine neue Seite chronik.php an, gleicher Aufbau wie
verein.php, Überschrift Chronik, Platzhaltertext.
Ergänze sie im Menü in inc/kopf.php an vorletzter Stelle
und trag sie in die sitemap ein. Sonst nichts ändern.

Farbe oder Schrift ändern

Alles Aussehen sitzt in css/stil.css, und dort ganz oben in einem Block, der die Farben mit Namen versieht. Ändern Sie dort einen Wert, ändert sich die ganze Seite.

Auftrag 4 — Farbblock beschriften

Schreib mir in css/stil.css hinter jede Farbvariable
einen kurzen deutschen Kommentar, wo diese Farbe auf der
Seite auftaucht. Ändere die Werte nicht.

10. Hochladen und veröffentlichen

Weg A — mit einem FTP-Programm

1. Ein FTP-Programm installieren, etwa FileZilla.
2. Servername, Benutzer, Passwort eintragen, Port 22, Verbindungsart SFTP. Ohne SSH im Tarif: Port 21 und FTP über TLS.
3. Links Ihre Dateien, rechts der Server. Rechts in den Webordner wechseln, links markieren, hinüberziehen.
4. Die Datei .env übertragen Sie nie.

Weg B — ein Befehl über SSH

Auftrag 5 — Übertragung einrichten

Bau mir ein Skript hochladen.sh, das den Ordner per rsync
über SSH auf den Server überträgt. Die Zugangsdaten liest
es aus .env. Ausgeschlossen bleiben: .env, .git,
schriften/quellen, alles was mit einem Punkt beginnt.

Vor dem Übertragen zeigt es mir eine Liste, was sich
ändern würde, und fragt einmal nach. Erklär mir danach in
drei Sätzen, was das Skript tut und wie ich es aufrufe.

Ab da lautet Ihr Veröffentlichungsvorgang: Skript aufrufen, Liste anschauen, bestätigen. Zehn Sekunden.

11. Recht: Impressum bis Schriften

Der Teil, den man nicht der KI allein überlässt. Vier Punkte, die abgemahnt werden.

Impressum

Auch ein Verein braucht eines, auf jeder Seite mit einem Klick erreichbar. Hinein gehören: vollständiger Vereinsname wie im Register, Anschrift, vertretungsberechtigter Vorstand mit Namen, Registergericht und Registernummer, Mailadresse. Bei einem eingetragenen Verein außerdem der Zusatz e. V.

Datenschutzerklärung

Sie muss zu dem passen, was Ihre Seite tatsächlich tut. Eine Erklärung, die Werbenetzwerke und Besucherauswertung beschreibt, obwohl Sie nichts davon einsetzen, ist genauso falsch wie eine fehlende.

Auftrag 6 — Datenschutz aus dem tatsächlichen Bestand

Geh alle Dateien durch und liste mir auf, welche Daten
diese Seite tatsächlich verarbeitet: jede Verbindung nach
außen, jedes Formular, jede Datei, die etwas speichert,
jedes Bild und jede Schrift von einem fremden Server.

Danach erst schreibst du mir einen Entwurf der
Datenschutzerklärung, der genau diesen Bestand abbildet
und nichts darüber hinaus. Markiere jede Stelle, die ich
prüfen lassen sollte, mit PRUEFEN.

Den Entwurf lassen Sie gegenlesen. Vereinsrechtsberatung gibt es bei Landessportbünden und Vereinsverbänden zu geringen Beiträgen, oft im Mitgliedsbeitrag enthalten.

Schriften niemals von fremden Servern laden

Wenn Ihre Seite eine Schrift direkt von einem fremden Server holt, wird bei jedem Besuch die Adresse des Besuchers dorthin übertragen. Genau dafür sind Vereine und kleine Betriebe abgemahnt worden. Die Lösung ist einfach: Schrift herunterladen, in den Ordner schriften/ legen, von dort einbinden.

Auftrag 7 — Schriften nach innen holen

Prüfe die ganze Seite auf Verbindungen zu fremden
Servern: Schriften, Karten, Skripte, Bilder, Symbole.
Liste sie auf. Danach hol alles davon in unseren Ordner
und binde es von dort ein. Am Ende darf beim Aufruf der
Seite kein einziger fremder Server angesprochen werden.
Zeig mir zum Nachweis die Liste vorher und nachher.

Kontaktformular und Fotos

Ein Formular, das eine Mail an den Verein schickt, ist zulässig — es braucht aber einen Hinweis, wohin die Daten gehen, und ein Häkchen zur Kenntnisnahme der Datenschutzerklärung. Speichern Sie nicht, was Sie nicht brauchen, und verlangen Sie keine Pflichtfelder, die niemand auswertet.

Bei Bildern von Personen brauchen Sie deren Einwilligung, bei Kindern die der Eltern, und zwar schriftlich. Bilder aus dem Netz sind fast nie frei verwendbar, auch wenn sie in einer Suche auftauchen. Eigene Fotos sind der sichere Weg.

12. Wenn etwas kaputt ist

Weiße Seite, halbe Seite, Fehlermeldung — immer derselbe Ablauf.

1. Nicht klicken, sondern lesen. Steht eine Meldung auf der Seite, markieren und vollständig kopieren. Auch wenn sie wie Kauderwelsch aussieht: für die KI ist sie die halbe Lösung.
2. Zurückdenken. Was war die letzte Änderung? In neun von zehn Fällen liegt es genau dort. Deshalb: immer nur eine Sache auf einmal ändern.
3. Den Fehlersuch-Auftrag schicken (unten).
4. Weiße Seite ohne Meldung? Das ist fast immer ein PHP-Fehler, den der Server versteckt. Sagen Sie der KI: Die Seite ist weiß, keine Meldung. Zeig mir, wie ich die Fehleranzeige einschalte und wo das Fehlerprotokoll auf dem Server liegt. Danach steht die Meldung da.

Auftrag 8 — Fehlersuche

Die Seite [Adresse] zeigt folgendes Bild:
[was Sie sehen, in einem Satz]

Die Meldung lautet wörtlich:
[Meldung einfügen]

Meine letzte Änderung war: [was Sie gemacht haben]

Finde die Ursache. Sag mir zuerst, was kaputt ist und
warum, bevor du etwas reparierst. Rate nicht — wenn du
mehr Angaben brauchst, sag mir genau, was ich nachsehen
soll.

13. Sicherung und Sicherheit

Versionsverwaltung als Zeitmaschine

Ein Werkzeug namens Git merkt sich jeden Stand Ihrer Dateien. Sie können jederzeit zu jedem früheren Stand zurück. Es klingt nach Fachwelt, ist aber genau drei Befehle:

git add .
git commit -m "Termine für September ergänzt"
git log --oneline

Der erste sammelt ein, der zweite legt den Stand mit einer Notiz ab, der dritte zeigt alle Stände. Zurück geht es mit einem vierten, den Ihnen die KI im Ernstfall nennt.

Auftrag 9 — Zeitmaschine einrichten

Richte mir in diesem Ordner Git ein. Leg eine .gitignore
an, die .env und alle Zugangsdaten ausschließt. Mach den
ersten Stand. Schreib mir danach eine Datei
SICHERUNG.md, in der in einfachem Deutsch steht:

1. Wie ich einen Stand sichere
2. Wie ich sehe, was sich seit dem letzten Stand
   geändert hat
3. Wie ich auf einen früheren Stand zurückgehe

Drei Befehle, keine Fachbegriffe ohne Erklärung.

Sicherung außer Haus

Der Ordner liegt auf Ihrem Rechner und auf dem Server. Beides kann ausfallen. Kopieren Sie den Ordner einmal im Monat auf einen Stick oder in einen Speicherdienst. Das dauert eine Minute und ist der Unterschied zwischen einem Ärgernis und einem verlorenen Jahr.

Was Sie nie tun

• Zugangsdaten in einen Chat tippen — auch nicht in den mit der KI.
• Die Datei .env hochladen.
• Fremden Code aus dem Netz einfügen, ohne die KI zu fragen: Was macht das und was greift es an?
• Auf dem Server direkt in einer Datei herumbessern. Immer auf dem Rechner ändern und hochladen — sonst haben Sie zwei Fassungen und wissen nicht mehr, welche gilt.

14. Lernplan über vier Wochen

Der letzte Punkt in Woche vier ist ernst gemeint. Löschen Sie in einer Datei absichtlich eine schließende Klammer, rufen Sie die Seite auf, sehen Sie sich die Meldung an, reparieren Sie sie. Diese eine Übung nimmt mehr Angst als drei Wochen Lesen.

15. Zwölf Fallen

1. Zu große Aufträge. Fünf Wünsche in einem Auftrag geben ein Ergebnis, dessen Fehler Sie nicht mehr zuordnen können.
2. Blind übernehmen. Wenn die KI etwas vorschlägt, das Sie nicht verstehen, fragen Sie nach, bevor Sie es einbauen. Immer.
3. Zwei KI-Werkzeuge gleichzeitig. Sie überschreiben sich gegenseitig. Eins reicht.
4. Umlaute als ae, oe, ue. Immer echte Umlaute in UTF-8. Wenn im Browser Fragezeichen oder seltsame Zeichen erscheinen, ist es ein Kodierungsproblem — die KI löst das in einer Runde.
5. Bilder direkt aus der Kamera. Vier Megabyte je Foto machen die Seite auf dem Handy unbenutzbar. Vor dem Einbauen verkleinern.
6. Nur am großen Bildschirm prüfen. Zwei Drittel Ihrer Besucher kommen mit dem Handy.
7. Sicherung aufschieben. Git in Woche eins einrichten, nicht in Woche fünf, wenn schon etwas verloren ist.
8. Auf dem Server direkt bearbeiten. Führt zu zwei Fassungen, die auseinanderlaufen.
9. Fremde Server im Hintergrund. Schriften, Karten und Symbole von außen sind das häufigste Abmahnrisiko.
10. Zu viel bauen. Ein Bereich, den niemand pflegt, ist schlimmer als kein Bereich.
11. Erfundene Inhalte stehen lassen. KI füllt Lücken gern mit plausibel klingenden Sätzen. Lesen Sie jeden Text, der nach außen geht, einmal ganz — besonders Zahlen, Namen und Jahreszahlen.
12. Nach dem Hochladen nicht prüfen. Dass etwas lädt, heißt nicht, dass es stimmt.

16. Prompt-Bibliothek zum Kopieren

Handy prüfen

Prüfe alle Seiten auf Darstellung bei 360 Pixel Breite.
Liste mir auf, was überläuft, was zu klein ist und was
sich nicht antippen lässt. Erst die Liste, dann warte auf
mein Ja, dann reparieren.

Ladezeit

Sag mir, wie groß jede Datei ist und wie schwer die
Startseite insgesamt lädt. Nenne die drei größten
Brocken und was ich dagegen tun kann, ohne dass die Seite
schlechter aussieht.

Auffindbarkeit

Ergänze für jede Seite einen passenden Titel und eine
Beschreibung in gutem Deutsch mit echten Umlauten, keine
Schlagwortlisten. Leg eine sitemap.xml und eine
robots.txt an. Ergänze die Angaben für einen Verein
[Vereinsname, Ort] als strukturierte Daten.

Barrierefreiheit

Prüfe die Seite auf Lesbarkeit: Kontraste, Schriftgrößen,
Beschreibungstexte für alle Bilder, Bedienbarkeit nur mit
der Tastatur, sinnvolle Reihenfolge der Überschriften.
Liste die Funde nach Wichtigkeit. Erst berichten, dann
warten.

Kontaktformular

Bau ein Kontaktformular in kontakt.php: Name,
Mailadresse, Nachricht, Häkchen zur
Datenschutzerklärung. Versand per PHP-Mail an
[Mailadresse]. Schutz gegen automatische Einsendungen
ohne fremden Dienst. Keine Speicherung der Daten auf dem
Server. Erklär mir danach in drei Sätzen, was mit einer
Nachricht passiert.

Übergabe an den Nachfolger

Schreib mir eine Datei ANLEITUNG.md in einfachem
Deutsch, die jemand ohne Vorkenntnisse versteht: welche
Datei wofür zuständig ist, wie man einen Termin einträgt,
wie man einen Text ändert, wie man ein Bild tauscht, wie
man hochlädt. Mit Beispielen aus unserer echten Seite,
nicht allgemein.

Wenn Sie den Faden verloren haben

Fass zusammen: Welche Dateien gibt es in diesem Ordner,
wofür ist jede zuständig, und was haben wir in den
letzten Runden geändert? Antworte in einer Tabelle, so
knapp wie möglich.

Wann Sie trotzdem jemanden fragen

Dieses Handbuch macht Sie in vier Wochen so weit, dass Sie Ihre Seite allein bauen und pflegen. Drei Dinge bleiben trotzdem sinnvoll auszulagern:

• Die rechtliche Prüfung. Impressum und Datenschutzerklärung lässt man einmal von jemandem lesen, der dafür haftet. Danach ändert sich daran jahrelang nichts.
• Der erste Umzug. Wenn eine bestehende Adresse übernommen wird und die alten Seitenadressen weiterleiten sollen, ist der erste Durchgang fummelig. Der zweite nicht mehr.
• Der Moment, in dem Sie feststecken. Wenn Sie zwei Abende an derselben Sache sitzen und nicht weiterkommen, ist eine Stunde mit jemandem, der darüberschaut, die bessere Investition als der dritte Abend.

Alles andere — Texte, Bilder, Termine, Farben, neue Seiten, Fehler beheben — machen Sie selbst. Genau dafür ist dieses Handbuch geschrieben.

Zum Mitnehmen: das komplette Handbuch als PDF, 18 Seiten, zum Ausdrucken und Weitergeben im Verein.