Projektbericht: Moderne Weblösung für medizinisches Vertrauen

Für eine etablierte Hausarztpraxis in Chemnitz wurde ein Webprojekt entwickelt, das Seriosität, Übersichtlichkeit und technische Präzision vereint. Der Fokus lag auf einfacher Pflege, optimierter Benutzerführung und einem Design, das Vertrauen schafft.

Herausforderung

Die bisherige Webpräsenz war statisch, schwer wartbar und weder mobilfreundlich noch visuell ansprechend. Patient:innen fanden Informationen nur mühsam, wichtige Inhalte wie Öffnungszeiten, Kontakt oder Leistungen waren nicht schnell zugänglich.

Ziele

• Modernes, vertrauenswürdiges Webdesign mit klarer Struktur
• Interaktive Informationsblöcke im Grid-Stil (z. B. Öffnungszeiten, Leistungen)
• Schneller Zugriff auf Kontakt & Termine
• Leichte Pflege durch modulare Komponentenstruktur
• Barrierefreiheit, Darkmode und gute Lesbarkeit

Tech-Stack & Architektur

• Astro für Performance und komponentenbasiertes Markup
• Tailwind CSS + DaisyUI für flexible Gestaltung mit Theme-Switch
• React für Modals & dynamische Komponenten
• Markdown für einfache Inhaltsverwaltung (z. B. FAQ, Rechtliches)
• ImageMagick + WebP zur Bildoptimierung
• Docker + CI/CD für stabile Deployments

Umsetzung

🧩 Bento-Grid mit interaktiven Tiles

Das Herzstück der Seite bildet ein 15x9 Grid, in dem alle Inhalte modular als Kacheln (Tiles) umgesetzt sind – inklusive Animationen, Darkmode-Unterstützung und verschiedenen Alignments pro Tile.

🗓️ Modals mit React & DaisyUI

Viele Informationen – z. B. Leistungen, Öffnungszeiten oder Urlaubszeiten – werden in Modals ausgelagert. Diese lassen sich direkt in der Kachel per Button öffnen und schließen sich elegant via dialog.showModal().

🧑‍⚕️ Team- & Selfie-Präsentation

Die Praxis zeigt ihr Team visuell mit hochwertigen Bildern, überlagert von leicht transparentem Text-Overlay und passendem SVG-Hintergrund, abgestimmt auf das gewählte Theme.

💬 Kontaktformular mit Web3Forms

Ein schlankes, responsives Formular wird über einen Modal eingeblendet. Die Verarbeitung erfolgt DSGVO-konform über Web3Forms, ohne eigenes Backend – ideal für kleinere Praxen.

🌗 Darkmode & Design-Details

Der ThemeToggle erlaubt den Wechsel zwischen einem Hell- und Dunkelmodus. Hintergrund-SVGs, Typografie, Buttons und Icons passen sich dynamisch an das Theme an.

Ergebnis

Die neue Praxis-Website vereint technologische Klarheit mit vertrauensbildendem Design. Patient:innen finden Informationen schneller, und das Team spart Zeit durch digitale Entlastung. Die Seite fühlt sich modern an – ohne überladen zu wirken.

„Unsere neue Website zeigt nicht nur, wer wir sind – sondern erleichtert unseren Patient:innen den Alltag.“
— Dr. Max Mustermann

Fazit

Ein Webprojekt für Praxen, das zeigt: Auch im Gesundheitsbereich kann gutes Webdesign funktional, ästhetisch und effizient zugleich sein. Ideal für alle, die digital erreichbar sein wollen – mit Stil und Struktur.