Seit Jahrzehnten scheint es auf die Anforderung „Einen Blog erstellen" nur eine Antwort zu geben: WordPress. Auch ich betreibe unter pro-bi.de einen Blog auf der Basis von WordPress. Dabei ist das CMS-Urgestein für einen privaten Blog eigentlich völliger Overkill: Updates für WordPress selbst wollen installiert sein, daneben auch für das eingesetzte Theme, verwendete Plugins, für PHP, MySQL oder MariaDB... Sicherheitsplugins schaffen oft mehr Probleme, als sie lösen. Ein fehlerhaftes Plugin kann die ganze Seite in den Abgrund reißen. Und Backups sind eine besondere Herausforderung: ein gutes Plugin kostet auch gutes Geld. Von Kontaktformular-Spam, nicht DSGVO-konforme eingebettete Schriftarten und Consent-Bannern möchte ich gar nicht erst anfangen...

Das Experiment: Ein Blog nur mit HTML, CSS und JavaScript

Eine Website mit purem HTML, CSS und JavaScript zu erstellen ist möglich, aber mühselig. Zwar beherrsche ich zumindest die beiden erstgenannten, ein ganzes Projekt damit aber im Texteditor aufzusetzen, schreckt auch mich ab.

Aber in Zeiten von Claude Code, Mistral Vibe oder ChatGPT Work hat sich das Blatt vollkommen gewendet: die KI übernimmt den mühsamen Teil des Codens und als Blog-Autor kümmert man sich ganz um die Texte!

Die Ausgangssituation

Mein Blog pro-bi.de ist eigentlich dem Thema Business-Intelligence gewidmet. Seit einiger Zeit schreibe ich dort aber auch über Themen, die nicht direkt etwas mit BI zu tun haben. Ein zweiter, themenunabhängiger Blog sollte die Lösung sein. Aber mich wieder in die WordPress-Hölle begeben? Nein – diesmal soll es ein simpler Blog sein:

Auch, wenn ich mich monatelang nicht um die Technik kümmere, sollen sich keine Sicherheitslücken auftun. Und ein Backup soll erstellt werden können, indem ich einfach das Projektverzeichnis wegkopiere. Die Möglichkeit für Benutzer, Beiträge zu kommentieren, wäre nice-to-have – möchte ich im ersten Moment aber vernachlässigen, da 80 % aller Kommentare ohnehin Bot-generierter Spam sind.

Ein Ausschnitt aus der Startseite des Blogs rainer-knappe.de
Ein Ausschnitt aus der Startseite des Blogs rainer-knappe.de

Die Umsetzung

Schnell war klar, dass eine einfache, wartungsfreie Lösung nur mit dem altbewährten Dreigestirn aus HTML, CSS und JavaScript zu realisieren ist. In den ersten beiden bin ich eingerostet und JavaScript beherrsche ich nur sehr rudimentär. Also habe ich Claude Code (ich hätte auch Mistral Vibe nehmen können) gebeten, es soll mir einen Prototypen mit Dummy-Beiträgen erstellen. Ich habe nur den Stil, die ungefähre Schriftart und andere Aspekte in natürlicher Sprache beschrieben. Das erste Ergebnis war gleich ansehnlich und mit ein paar Iterationen hatte ich meinen persönlichen Stil gefunden. Dann noch eine Spielerei wie einen Umschalter zwischen Dark- und Lightmode einbauen – auch das hat Claude in wenigen Minuten umgesetzt – ganz ohne Cookies, die Information wird im Browser gespeichert und verlässt diesen nicht.

Der Workflow für die Beitrags-Erstellung

Nachdem das Gerüst stand, stellte sich die Frage: wie kommen dann in Zukunft die Beiträge in den Blog? Auch hier möchte ich keine HTML-Templates ausfüllen. Die Lösung: ich habe mir von Claude ein Markdown-Template erstellen lassen, in das ich die Inhalte eintrage. Das ist sehr viel einfacher und geht schneller, als mit HTML. Auch diesen Beitrag schreibe ich in diesem Moment in eine Kopie dieses Templates. In meinem Projektverzeichnis auf dem lokalen Computer habe ich einen Ordner „Input" erstellt. In diesem Input-Ordner liegt das ausgefüllte Template, das Beitragsbild und alle sonstigen Bilder, die in dem Beitrag sichtbar sein sollen. Im Template selber gebe ich dann nur die Dateinamen an, vergebe noch Tags für die Navigation und schreibe den Beitragstext in einfacher Markdown-Syntax. Wenn alles fertig ist, sage ich Claude: generiere aus dem Input-Ordner bitte den Beitrag und baue ihn in den Blog ein! Dann muss ich die neuen Dateien nur noch per FTP auf den Webserver laden (wobei auch das die KI übernehmen könnte...) und voilà: der Beitrag ist online.

Ein Auszug aus dem Markdown-Template

<!--
ANLEITUNG (diesen Kommentarblock vor dem Ausfüllen löschen oder einfach stehen lassen, wird nicht mit übernommen):

1. Diese Datei kopieren und umbenennen, z. B. Input/mein-neuer-artikel.md
   (die vorlage.md selbst bitte unverändert lassen, damit sie für den nächsten Artikel wieder da ist).
2. Felder unten ausfüllen, Fließtext darunter schreiben.
3. Titelbild und alle im Text verwendeten Bilder direkt in Input/ ablegen
   (keine Unterordner nötig – Input/ wird nach jedem fertigen Artikel wieder geleert).
4. Bilder im Fließtext per Standard-Markdown-Syntax referenzieren:
   ![Bildunterschrift](dateiname.jpg)
   Der Alt-Text wird zur Bildunterschrift (<figcaption>) im fertigen Artikel.
5. Wenn fertig: Claude Code bitten, den Artikel einzubauen. Nach Deployment
   wird Input/ bis auf vorlage.md geleert.
-->

Titel: [Artikeltitel hier]
Datum: [z. B. 2026-08-15]
Tags: [z. B. ki, obsidian, produktivität – kommagetrennt, wie im Tag-Filter auf der Startseite]
Titelbild: [Dateiname des Titelbilds, z. B. titelbild.jpg]
Titelbild-Alt: [kurze Beschreibung des Titelbilds für den Alt-Text]

---

Hier beginnt der Fließtext des Artikels. Normale Absätze einfach als Text schreiben.

## Eine Zwischenüberschrift

Weiterer Fließtext. Für ein Bild an dieser Stelle:

![Beispiel für eine Bildunterschrift](screenshot1.png)

Für ein echtes Zitat:

> Das ist ein wörtliches Zitat, keine allgemeine Hervorhebung.

Für Prompts oder Code-Beispiele:

```
Beispiel-Prompt oder Code hier
```

### Eine kleinere Zwischenüberschrift

Und so weiter bis zum Ende des Artikels.

Nachteile

Ein paar Dinge, die man bei einem Blog ganz selbstverständlich erwartet, hat mein Blog noch nicht. So gibt es beispielsweise kein Kontaktformular (deshalb aber auch keine Honeypots, keine Captchas und so weiter). Auch eine Kommentar-Funktion gibt es noch nicht, das wäre für die Zukunft wirklich wünschenswert. Aber auch hier muss ich noch überlegen, wie ich das umsetze, ohne den Grundsatz „so simpel wie möglich" aufzugeben. Was ich auf keinen Fall möchte: Kommentar-Spam! Und ein kleiner Nachteil ist sicher auch, dass ich alle bestehenden HTML-Seiten anpassen muss, wenn ich mal etwas am Design ändern möchte (so geschehen zum Beispiel erst kürzlich, als ich rechts unten den Nach-Oben-Pfeil eingebaut habe). Aber auch hier kann man natürlich der KI sagen: baue das in alle Seiten ein!

Wenn ihr Kommentare zu meinem neuen Blog-Konzept habt, schreibt es gerne in die Ko... nein, schreibt mir gerne an meine E-Mail-Adresse, die ihr im Impressum findet :)

Disclaimer: Dieser Beitrag wurde komplett von einer realen Person geschrieben.