Projektmappe

Einfühlsam. Klar. Persönlich.

Wenn Struktur, Text und Technik Eltern und Kinder abholen.

Website Projekt Beispiel für einen Relaunch (Technik, Design & Inhalt)
Website Projekt Beispiel für einen Relaunch (Technik, Design & Inhalt)
Projekt: Von Onepager zur Website – Relaunch in Technik, Design & Text
Branche:  Lernförderung / Lese-Rechtschreib-Schwäche
Kunde: Andrea Erz

Ausgangslage, Anforderungen & Ziele

Testimonial Andrea Erz - Kundenstimme

Ausgangssituation: Technisch schwer, inhaltlich überfordernd
Die bisherige Website der Kundin bestand aus einem Onepager, der auf Basis von Bootstrap (einem technischen Framework für einfache Webseitenlayouts) erstellt wurde. Sie war für die Kundin selbst schwer zu pflegen, inhaltlich überladen und vermittelte nicht, worin der konkrete Nutzen ihres Angebots bestand. Wichtige Informationen wie Kurszeiten oder Kursstruktur ließen sich weder schnell erfassen noch regelmäßig aktualisieren – ein echtes Problem im Tagesgeschäft.

Wunsch: Persönlicher, klarer und elternfreundlich
Hinzu kam: Die persönliche Komponente fehlte. Die Kundin wünschte sich einen Auftritt, der ihrer Haltung, ihrem Einfühlungsvermögen und der individuellen Förderung von Kindern gerecht wird – und dabei Eltern niedrigschwellig anspricht.

Umsetzung: Relaunch in Technik, Design & Inhalt
Die Kundin beauftragte mich mit dem Relaunch ihrer Website – in Technik, Design und Inhalt. Ziel war eine klare Struktur, persönliche Ansprache, einfache Pflegbarkeit – und die inhaltliche Aufbereitung auf Basis echter Elternfragen. Umgesetzt wurde:

  • eine neue Seitenstruktur mit Startseite, Angebotsseite, Über-mich und Kontakt
  • eine Umstellung auf WordPress & Elementor, damit Inhalte – insbesondere Kurszeiten – selbst gepflegt werden können, was Zeit spart und Sicherheit schafft
  • die Integration eines WhatsApp-Kontaktbuttons für eine einfache, mobile Kontaktaufnahme
  • ein visuelles Konzept basierend auf dem neuen Flyer der Kundin, den sie gemeinsam mit der Grafikerin Andrea Michalowski (www.arts&design.de) entwickelt hatte.
  • eine klar strukturierte Angebotskommunikation und der gezielte Aufbau emotionaler Nähe zur Zielgruppe

Projekt­informationen

Ziel:

  • Klare, verständliche Darstellung des Angebots – auf Augenhöhe mit Eltern
  • Abbau typischer Unsicherheiten durch strukturierte Informationen und FAQ und klare Angebotsstruktur
  • Persönlicher Zugang über eine authentische Über-mich-Seite mit Einblicken in Haltung & Motivation
  • Pflegeleichte Umsetzung der Seiten, insbesondere für wechselnde Kurstermine
  • Übertragung des bestehenden Flyers in ein konsistentes Webdesign
  • Suchmaschinenfreundliche Texte auf Basis bestehender Keywordliste (z. B. „LRS Kurs Ulm“)

Meine Leistungen:

  • Strategische Beratung zur Angebotsstruktur & Nutzerführung
  • Konzeption der Seitenstruktur (Startseite, Angebot, Über mich, Kontakt)
  • Entwicklung der Über-mich-Seite auf Basis eines strukturierten Workbooks
  • Textentwicklung für alle Seiten – klar, empathisch und zielgruppengerecht
  • SEO-Integration auf Basis der Google-Ads-Keywordliste
  • Designübertragung aus dem bestehenden Flyer – Farben, Icons, Bildsprache
  • Aufbau der Kurstermine mit zentraler Pflege und dynamischer Ausgabe
  • Integration eines WhatsApp-Kontaktbuttons
  • Einrichtung grundlegender Sicherheitsfunktionen (Firewall, Login-Schutz etc.)

Technik:

  • CMS: WordPress
  • Pagebuilder: Elementor &  Ultimate Addons für Elementor
Website Projekt Andrea Erz - Mobil-Ansicht

Projektdetails - Umsetzung

Nach der strategischen Planung und inhaltlichen Strukturierung folgte die praktische Umsetzung des Projekts – mit dem Ziel, Technik, Design und Inhalt so aufeinander abzustimmen, dass Eltern sich schnell zurechtfinden, Vertrauen aufbauen und problemlos Kontakt aufnehmen können.

Die Umsetzung erfolgte in enger Abstimmung mit der Kundin und auf Basis der erarbeiteten Inhalte, des bestehenden Corporate Designs und den Anforderungen an eine pflegeleichte Lösung.

Design-Prozess

Statt bei null zu starten, konnte ich auf ein bestehendes visuelles Konzept zurückgreifen. Das neue Corporate Design mit neuem Flyer – in frischem Grün und Blau, mit Buchstaben-Icons und einer kindgerechten, gleichzeitig klaren Gestaltung – bildete die visuelle Grundlage für das Webdesign.

Folgende Elemente wurden übernommen und webtauglich umgesetzt:

  • die Farbwelt und Bildsprache
  • Grafiken, z. B. Initialbuchstaben als wiederkehrende Designelemente
  • Störer-Elemente wie Megafone mit Sprechblasen zur inhaltlichen Hervorhebung
  • die im Flyer verwendete Hausschrift, um einen konsistenten visuellen Eindruck zu wahren
  • professionelle Porträtfotos der Kundin – eingebunden in runde Rahmen, um Persönlichkeit und Nähe zu unterstreichen

Designpartnerin:
Das Corporate Design & der Flyer wurden von Andrea Michalowski (www.artsanddesign.de) gestaltet – modern, farbstark und zielgruppengerecht.

Layout & Contentprozess

Die Inhalte der Website wurden entwickelt auf Basis eines intensiven Workbook-Prozesses, den die Kundin durchlief und aus denen die Texte erstellt wurden
Ziel war nicht nur das „richtige Formulieren“, sondern vor allem ein Verständnis dafür, was Eltern wirklich wissen wollen, bevor sie sich für einen Kurs entscheiden. Wichtige Fragen im Prozess:

  • Was versteht die Zielgruppe auf den ersten Blick?
  • Welche Informationen benötigen und erwarten die Eltern?
  • Was kann Unsicherheiten nehmen?
  • Wo braucht es Vertrauen – und wie erzeugen wir es?

Klarheit im Inhalt – strukturiert, persönlich und überzeugend
Die Inhalte der Website wurden so entwickelt, dass sie Eltern einen schnellen Überblick geben, Vertrauen aufbauen und gleichzeitig alle relevanten Informationen strukturiert zugänglich machen.
Die Texte sind bewusst klar und reduziert formuliert – persönlich, aber nie überladen oder werblich. Im Fokus stehen die Bedürfnisse der Zielgruppe: verständliche Antworten, transparente Abläufe und eine direkte Ansprache auf Augenhöhe.

Website Projekt AE Layoutprozess "Angebotsstruktur für mehr Vertrauen"

Auf der Angebotsseite wurde der Kurs detailliert erklärt: Was macht ihn besonders? Wie läuft er ab? Für wen ist er geeignet?
Ein ergänzender FAQ-Bereich greift häufige Fragen direkt auf – z. B. zu Dauer, Zielgruppe, Kosten oder Fördermöglichkeiten – und begegnet möglichen Unsicherheiten bereits vor der Kontaktaufnahme.

Darüber hinaus sorgen persönliche Geschichten und Rückmeldungen aus dem Kursalltag für Nähe und Authentizität – ohne plakativ zu wirken, sondern eingebettet in den natürlichen Seitenfluss. Inhaltliche Umsetzung:

  • Reduzierte, klare Sprache – persönlich, aber nicht platt
  • Klarer Ablauf auf der Angebotsseite mit: Was bekomme ich? Wie läuft’s ab? Für wen ist das geeignet?
  • FAQ-Bereich zur Einwandbehandlung
  • Testimonials & persönliche Geschichten aus den Kursen

Nutzerführung & Kontaktfreundlichkeit
Die Navigation wurde bewusst reduziert: wenige Menüpunkte, klare Scrollstrecken und gezielte Call-to-Actions führen Besucher*innen durch das Angebot. Ein besonderes Augenmerk lag dabei auf der Kontaktseite, die nicht nur Formular und E‑Mail enthält, sondern auch einen WhatsApp-Button – DSGVO-konform eingebunden und ideal für mobile Endgeräte.

Neben der übersichtlichen Kontaktseite und dem mobilen WhatsApp-Button wurde auch die E-Mail-Kommunikation professionalisiert:
Statt einer privaten Gmail-Adresse nutzt die Kundin nun eine E-Mail-Adresse unter eigener Domain – ein kleiner, aber entscheidender Schritt in Sachen Vertrauensaufbau und Seriosität.

Website Projekt AE Technikprozess "Template Kurstermine + WhatsApp-Button"

Technische Umsetzung & Pflegeleichtigkeit
Die Seite wurde mit dem Pagebuilder Elementor  umgesetzt und so strukturiert, dass Inhalte – insbesondere Kursinformationen – zentral gepflegt und automatisch an mehreren Stellen ausgespielt werden. Das spart der Kundin nicht nur Zeit, sondern sorgt auch für konsistente Kommunikation. Technische Maßnahmen:

  • Zentrale Kursdatenpflege mit globalem Widget
  • Sicherheitskonfiguration (Firewall, Login-Schutz, Limit Login Attempts etc.)
  • Integration der Google-Ads-Keywordliste („LRS Kurs Ulm“, „Lese-Rechtschreib-Schwäche“, u. a.)
  • Bildoptimierung + Alt-Texte
  • semantisch saubere Struktur (H-Überschriften, sprechende URLs, klare Meta-Tags)

Ergebnis & Wirkung
Entstanden ist eine Website, die Vertrauen aufbaut, Eltern Orientierung bietet – und die Werte der Kundin einfühlsam sichtbar macht. Sie lässt sich einfach pflegen, spricht die Zielgruppe emotional und strukturell an – und stärkt die Sichtbarkeit der LRS-Trainerin im regionalen Umfeld.

Besonders hervorzuheben:
Die Über-mich-Seite, die erstmals einen persönlichen Einblick in die Motivation und Haltung der Trainerin gibt – auf Basis des gemeinsam entwickelten Workbooks.

Testimonial Andrea Erz - Kundenstimme
Website Projekt AE Mobil-Ausschnitt „Hero-LRS-Kurs“-Teil
Website Projekt AE Mobil-Ausschnitt „Kurs-Methode“-Teil
Website Projekt AE Mobil-Ausschnitt „Kundenfeedback“-Teil
Website Projekt AE Mobil-Ausschnitt „Uber-Mich-Geschichte“-Teil
Website Projekt AE Mobil-Ausschnitt „Kurs-FAQ“-Teil
Website Projekt AE Mobil-Ausschnitt „Uber-Mich-Persönlichkeit“-Teil
Website Projekt AE Mobil-Ausschnitt „LRS-Fakten“-Teil

Lust auf Klarheit – auch für dein Projekt?

Du willst, dass dein Angebot verstanden wird – und dich endlich mit deiner Website wohlfühlen?

Dann melde dich gern.
Nadine Möller - Webdesignerin

Weitere Auszüge aus meiner Projektmappe

Website Projekt Beispiel für einen inhaltlichen Relaunch

Projektart: Relaunch (Technik & Inhalte) einer Business-Website

Branche: Grafikdesign /Design-Dienstleistungen & Firmenschulungen

Zum Projekt von Andrea Michalowski>>

WordPress Cookie Plugin von Real Cookie Banner