Zum Inhalt springen
Case Study · Frauennetzwerk Limburg an der Lahn

Eine eigene Plattform für ein ganzes Netzwerk — aus einer Hand

Für das Frauennetzwerk „Stadt Land Frau“ entstand eine vollständige digitale Heimat: öffentliche Website, DSGVO-konforme Mitgliederdatenbank mit Self-Service-Portal, eigenes Blog-CMS und ein Instagram-Content-Studio mit KI-Unterstützung — als schlanke PHP-Anwendung ohne ein einziges Framework, lauffähig auf einfachem Shared Hosting.

Rolle · Konzept, Design, Entwicklung Stack · PHP 8.1 · MariaDB · Vanilla JS Hosting · Shared Hosting (STRATO) Zeitraum · 2026
4
Module: Website, Mitglieder, Blog, Content-Studio
21.800
Zeilen Code — PHP, CSS, JS, SQL
16
Datenbanktabellen
0
Frameworks, Build-Tools, externe Abhängigkeiten
≈200 €
Betriebskosten pro Jahr — Webspace, Domain & KI inklusive
Ausgangslage

Ein wachsendes Netzwerk, verstreute Werkzeuge

„Stadt Land Frau“ ist ein Frauennetzwerk in Limburg an der Lahn — mit regelmäßigen Treffen, einer aktiven WhatsApp-Community und wachsender Mitgliederzahl. Die digitale Infrastruktur hielt damit nicht Schritt: Es fehlte eine zentrale Plattform — Mitgliederdaten lebten in Listen und Postfächern, und für Social Media fehlten Prozesse und Werkzeuge komplett.

  • Keine echte WebsiteDer Online-Auftritt bestand aus einem provisorischen One-Pager und PDF-Dokumenten — ohne Blog, ohne Anmeldestrecke, ohne Pflege-Möglichkeit.
  • Keine gemeinsame BasisWebsite, Mitgliederverwaltung und Content-Arbeit existierten nicht als zusammenhängendes System — jede Aufgabe brauchte ein eigenes Werkzeug.
  • Mitgliederdaten ohne SystemKeine zentrale, DSGVO-konforme Verwaltung von Profilen, Einwilligungen und Löschfristen.
  • Social Media als HandarbeitJeder Instagram-Post entstand manuell — ohne Vorlagen, Planungsansicht oder einheitliches Erscheinungsbild.
  • Nicht-technisches TeamAlles musste ohne Terminal, ohne Deployment-Wissen und ohne Agentur-Abhängigkeit betreibbar sein.
Die Lösung

Vier Module, eine Plattform, ein Design

Statt vier Insellösungen entstand eine zusammenhängende Anwendung: Alle Module teilen sich eine Datenbank, ein Login-System, gemeinsame Header/Footer-Includes und ein zentrales CSS-Design-System — beim Wechsel zwischen öffentlicher Seite und Mitgliederbereich gibt es keinen Designbruch. Verwaltet wird alles an einem Ort: einem gemeinsamen Admin-Bereich, der Mitglieder, Blog und Social Media unter einer Oberfläche bündelt.

Öffentliche Website

Schlanke PHP-Seite ohne CMS-Ballast

Die Hauptseite als handgebaute, schnelle PHP-Seite: Hero, Zielgruppen, Leistungsversprechen, Blog-Teaser und Kontaktformular — mobile-first, mit Honeypot-Spam-Schutz statt externem Captcha.

Mitgliederbereich

DSGVO-konforme Datenbank + Self-Service-Portal

Admins verwalten Profile, bis zu vier Bilder pro Mitglied und versionierte Einwilligungen; Mitglieder pflegen ihr Profil selbst — mit passwortlosem Magic-Link-Login, öffentlicher Profilansicht nach Freigabe, eigenem Datenexport und dem Recht auf sofortige Selbst-Löschung.

Blog-CMS

Eigener Blog-Editor im Admin-Bereich

Artikel schreiben, Titelbilder hochladen, Entwürfe verwalten und mit sprechenden URLs veröffentlichen — direkt im vertrauten Admin-Bereich, ohne separates CMS und ohne Cloud-Abhängigkeit.

Content-Studio

Instagram-Werkzeuge mit KI-Unterstützung

  • Content-Kalender mit Status-Workflow (Idee → Geplant → Veröffentlicht)
  • Post-Editor für Carousels in 3:4, 4:5 und 1:1 — gerendert komplett im Browser per Canvas
  • Mitglieder-Slides automatisch aus Profildaten — nur mit erteilter Einwilligung
  • Ideen-Generator über die Claude API, Brand-Guide mit live editierbaren Farben
Einblicke

Die Plattform im Einsatz

Drei vollständige Ansichten der Live-Seite: die komplette Startseite von Hero bis Kontaktformular, ein Blogartikel aus dem eigenen CMS und die „Mitglied werden“-Strecke mit Profil-Formular und Einwilligungen.

stadtlandfrau-limburg.de
Komplette Startseite: Hero, Zielgruppen, „Was dich erwartet“, Zitat-Band, Blog-Teaser und Kontaktformular
Startseite — die komplette Seite von Hero bis Kontaktformular, gebaut aus dem Design-System.
stadtlandfrau-limburg.de/blog/…
Vollständiger Blogartikel mit Titelbild, Fließtext und Bildergalerie — Namen unkenntlich gemacht
Blogartikel — Titelbild, Fließtext und Bildergalerie aus dem eigenen CMS, mit sprechender URL.
mitglieder.stadtlandfrau-limburg.de
„Mitglied werden“-Strecke: Profil-Formular mit Feldern, Foto-Upload, fünf Fragen und Einwilligungen
Mitglied werden — die komplette Anmeldestrecke: Profilfelder, Fotos, fünf Fragen und Einwilligungen.

Aus dem Admin-Bereich

Sechs Ansichten aus Backend und Mitglieder-Portal. Mitgliedernamen, Fotos und E-Mail-Adressen sind aus Datenschutzgründen unkenntlich gemacht.

…/dashboard.php
Admin-Mitgliederliste mit Suche, Statusfilter und Aktionen — Namen unkenntlich gemacht
Mitgliederliste — Suche, Statusfilter, CSV-Export, WhatsApp-Einladungen und Vollständigkeits-Markierung.
…/blog_edit.php
Blog-Editor mit Titel, Slug, Inhalt, Titelbild-Zuschnitt und Statusverwaltung
Blog-Editor — Titel, automatischer Slug, Formatierung, Titelbild mit Zuschnitt, Galerie und Status.
…/brandguide.php
Brand-Guide mit editierbaren Farben, Slide-Vorschau, Typografie und Illustrationen
Brand-Guide — Farben live editierbar mit Slide-Vorschau, Typografie, Illustrationen und Gestaltungsregeln.
…/content_vorlagen.php
Vorlagen-Übersicht mit fertigen Kachel-Sets wie Mitglied der Woche und Blog-Teaser
Vorlagen — fertige Kachel-Sets von „Mitglied der Woche“ bis Blog-Teaser, per Klick in den Post-Editor.
…/onboarding.php
Onboarding-Präsentation, die den geschützten Mitgliederbereich in elf Schritten erklärt
Onboarding — eine eingebaute Präsentation erklärt neuen Mitgliedern den geschützten Bereich in 3 Minuten.
…/login_mitglied.php
Passwortloser Login: Formular zum Anfordern eines Magic-Links per E-Mail
Magic-Link-Login — Mitglieder melden sich ohne Passwort an: Link per E-Mail, 30 Minuten gültig.

Mobile-first, wie versprochen

Dieselben Seiten auf dem Smartphone — echte Aufnahmen in Geräte-Emulation (390 px): Startseite, Beispielprofil und Blog.

Startseite in Smartphone-Ansicht mit Burger-Menü und gestapeltem Layout
Beispielprofil in Smartphone-Ansicht
Blogübersicht in Smartphone-Ansicht
Das Herzstück

Ein Admin-Bereich für alles — umfangreich, aber einfach bedienbar

Mitglieder, Blog und Social Media werden nicht in drei Systemen verwaltet, sondern in einem einzigen Backend mit einem Login. Die Navigation bleibt bewusst flach: sechs Hauptbereiche, klare Beschriftungen, keine verschachtelten Menüs — und jede Funktion ist im eingebauten Handbuch Schritt für Schritt erklärt.

Mitglieder verwalten

  • Liste mit Suche und Statusfilter, Detailansicht, Formular mit allen Feldern und Einwilligungen
  • Profil-Export als PDF und als JSON (DSGVO-Auskunft) auf Knopfdruck
  • WhatsApp-Community: Aufnahme-Wünsche prüfen, Einladungslink per E-Mail oder zum Kopieren
  • Deaktivieren mit 6-Monats-Aufbewahrung oder sofortige Anonymisierung

Blog schreiben

  • Artikel-Liste, WYSIWYG-Editor, Titelbild-Upload mit automatischer Komprimierung
  • Slug wird aus dem Titel erzeugt, bleibt aber editierbar — sprechende URLs inklusive
  • Entwurf und Veröffentlicht als Status, Vorschau vor dem Livegang, Löschen mit Rückfrage
  • Veröffentlichte Artikel erscheinen automatisch als Teaser auf der Startseite — und als Vorlage im Content-Studio

Social Media generieren

  • Content-Kalender als Monatsansicht mit Status-Workflow: Idee → Geplant → Erstellt → Veröffentlicht
  • Mitglieder-Slides: fertige Instagram-Carousels automatisch aus Profildaten, Bildern und Social-Fragen
  • Post-Editor für Text-, Listen-, Zitat-, Event- und CTA-Slides in 3:4, 4:5 und 1:1 — Rendering im Browser per Canvas, Export als PNG/ZIP
  • KI auf Wunsch: Content-Ideen und Captions über die Claude API, direkt im Workflow
  • Brand-Guide im Backend: Farben live editierbar, Bildwelt und Icons zentral verwaltet

Einfach bedienbar, sicher betreibbar

  • Eingebautes Handbuch: jede Funktion im Hilfe-Bereich erklärt, gegliedert nach der Hauptnavigation
  • Onboarding-Präsentation, die neuen Mitgliedern den geschützten Bereich zeigt
  • Mehrere Admin-Konten: der Hauptadmin legt Zugänge an und setzt Passwörter zurück
  • Protokoll-Ansicht: jede Aktion im Backend ist nachvollziehbar dokumentiert
Architektur

Zwei Domains, ein Server, eine Codebasis

Hauptseite und Mitgliederbereich laufen im selben Webspace: Die Hauptdomain zeigt auf den Unterordner web/, die Subdomain auf den Projektordner selbst. Gemeinsame Includes und ein geteiltes Design-System sind dadurch ohne Umwege möglich — jede neue Seite war vor der Domain-Umstellung vollständig unter der Subdomain testbar.

stadtlandfrau-limburg.de
Öffentliche Website · web/ · Blog, Kontakt
mitglieder.stadtlandfrau-limburg.de
Admin + Self-Service-Portal · Magic-Link-Login
beide laden dieselben Shared-Includes
shared/
Ein Header · ein Footer · ein Design-System (design.css) · Brand-Fonts
eine gemeinsame Datenbasis
MariaDB · 16 Tabellen
Mitglieder · Einwilligungen · Audit-Log · Blog · Content-Kalender · Instagram-Posts · Brand-Einstellungen
Sicherheit & Datenschutz

DSGVO nicht als Fußnote, sondern als Fundament

Versionierte EinwilligungenVier Einwilligungstypen mit Version und Zeitstempel — Widerruf jederzeit möglich und protokolliert.
Lückenloses Audit-LogJedes Anlegen, Ändern, Löschen, jeder Login und Export wird nachvollziehbar festgehalten.
Recht auf LöschungSoft-Delete mit 6-Monats-Aufbewahrung, sofortige Anonymisierung und Selbst-Löschung durch das Mitglied.
Passwortloser LoginMagic-Links per E-Mail, 30 Minuten gültig — mit Rate-Limiting und ohne Nutzer-Enumeration.
Härtung auf jeder EbeneCSRF-Schutz, Prepared Statements, bcrypt, sichere Session-Cookies, HSTS, blockierte PHP-Ausführung im Upload-Ordner.
Datenexport auf KnopfdruckDSGVO-Auskunft als JSON-Export pro Mitglied — direkt aus dem Admin-Interface.
Design-System

Eine Marke, in Code gegossen

Farben, Typografie und Komponenten leben als CSS-Design-Tokens in einer zentralen Datei — die Brand-Farben sind sogar aus dem Admin-Bereich heraus editierbar und wirken sofort überall, vom Website-Button bis zum Instagram-Slide.

Brand Orange#DD5513
Dark Red#6F2A21
Pink#FEE5E8
Blue#9FA5D3
Off-White#FFF8F5
Headlines · Lora 500–600
Gemeinsam sichtbar werden
UI & Fließtext · Inter 400/500
Klar, freundlich, lesbar — auf jedem Gerät.
Mitglied werden Mehr erfahren
Ergebnis

Was das Netzwerk davon hat

Minuten statt Stunden
Instagram-Posts entstehen aus Vorlagen und Profildaten in wenigen Minuten — bedienbar von jedem im Team, ganz ohne Vorkenntnisse.
≈ 150–200 € im Jahr
Mehr kostet der Betrieb nicht: Webspace, Datenbank, Domain und verbrauchsbasierte KI-Nutzung. Kein SaaS-Abo, keine Lizenzen, keine Agentur-Retainer.
Team-tauglich ab Tag 1
Eingebautes Handbuch, Onboarding-Präsentation und klare Workflows: Das ehrenamtliche Team betreibt die Plattform komplett selbst.
Stimmen aus dem Netzwerk
„Wir haben zum ersten Mal ein digitales Zuhause, das sich anfühlt wie unser Netzwerk — und das wir komplett selbst pflegen können.“
Liv · Gründerin von Stadt Land Frau
„Vom Mitgliederprofil zum fertigen Instagram-Carousel in wenigen Minuten — das Content-Studio nimmt uns die ganze Fleißarbeit ab.“
Lea · Social-Media-Beraterin des Netzwerks
Learnings

Was diesen Case besonders macht

Boring Tech als FeaturePHP + MariaDB auf Shared Hosting klingt unspektakulär — bedeutet aber: kein Build-Prozess, kein Deployment-Wissen nötig, Upload per FTP genügt. Genau richtig für ein ehrenamtliches Team.
DSGVO als ProduktqualitätEinwilligungs-Logik steuert nicht nur Rechtliches, sondern Funktionen: Das Content-Studio zeigt nur Mitglieder an, die der Social-Media-Nutzung zugestimmt haben.
Ein Design-System zahlt doppeltDieselben Tokens stylen Website, Mitgliederbereich und Instagram-Slides — Markenkonsistenz entsteht automatisch statt durch Disziplin.
KI dort, wo sie Arbeit spartDie Claude-API generiert Content-Ideen und Blog-Teaser — eingebettet in den Workflow des Teams statt als separates Tool, optional und serverseitig angebunden.
Ausblick

Die Plattform wächst mit dem Netzwerk

Die Architektur ist bewusst so angelegt, dass neue Module auf der bestehenden Datenbasis aufsetzen können — ohne Umbau, ohne neue Systeme. Als Nächstes denkbar:

NetzwerkfunktionenKategorien, Tags und eine Mitglieder-Suche, damit sich Frauen nach Themen und Angeboten finden.
Event-ModulTreffen und Vortragsreihen mit Anmeldung direkt auf der Plattform — vom Content-Kalender bis zur Teilnehmerliste.
Newsletter aus dem BackendNeuigkeiten aus Blog und Netzwerk direkt aus dem Admin-Bereich verschicken, ohne externes Tool.
Automatisierte LöschfristenDie 6-Monats-Aufbewahrung deaktivierter Profile läuft künftig per Cronjob vollautomatisch ab.
Zwei-Faktor-AuthentifizierungZusätzliche Absicherung der Admin-Konten für noch mehr Datensicherheit.
Projektverantwortung

Von der Idee bis zum Betrieb — aus einer Hand

Dieses Projekt wurde vollständig in Eigenleistung realisiert: von der Anforderungsanalyse über Konzeption, Design und Entwicklung bis hin zu Datenschutz-Umsetzung, Inhalten und laufendem Betrieb. Alle Entscheidungen — fachlich, gestalterisch und technisch — wurden eigenverantwortlich getroffen und direkt mit dem Netzwerk-Team abgestimmt.

Konzeption & Anforderungsanalyse UI/UX & Design-System Frontend · HTML, CSS, Vanilla JS Canvas-Rendering Backend · PHP 8 Datenbank · MariaDB / SQL Sicherheit & Härtung DSGVO & Datenschutz-Prozesse KI-Integration · Claude API Responsive Design Branding & Content Hosting & Deployment

Umgesetzt von Annette Pfeffer (pieceofpepper.com), die das Netzwerk ehrenamtlich als technische Administratorin betreut und auch die WhatsApp-Community aufgebaut und strukturiert hat.

Projektanfragen:

E-Mail WhatsApp LinkedIn