Fallstudie: Praxiswebsite für Kardiologie & Innere Medizin in Stralsund

01 Ausgangssituation & Zielsetzung

Für eine Gemeinschaftspraxis für Kardiologie und Innere Medizin in Stralsund durften wir die komplette Website konzipieren, gestalten und technisch umsetzen. Ziel war es, eine moderne, vertrauensvolle und gleichzeitig funktionale Website zu entwickeln, die sowohl die Praxis optimal repräsentiert als auch Patient:innen klar durch alle relevanten Informationen führt.

Zu Beginn des Projekts stand ein intensiver Austausch mit der Praxis. Gemeinsam haben wir definiert, welche Inhalte auf der Website abgebildet werden sollen und welche Informationen für Patient:innen wirklich relevant sind. Daraus entstand eine klare Struktur mit den Bereichen „Über uns“, „Aktuelles“, „Leistungen“, „Terminbuchung inklusive Anleitung“, Hinweise zur Terminvorbereitung sowie einer Kontaktseite. Vorgaben zu Design oder Gestaltung gab es zu diesem Zeitpunkt nicht – entsprechend lag die konzeptionelle und visuelle Ausarbeitung vollständig bei uns.

02 Designstrategie & visuelle Ausrichtung

Auf Basis dieser Freiheit haben wir ein Design entwickelt, das sich bewusst an der Wirkung medizinischer Marken orientiert: ruhig, klar und vertrauensvoll. Die Farbwahl fiel auf ein tiefes Blau, das im Gesundheitsbereich für Seriosität und Sicherheit steht. In Kombination mit viel Weißraum entstand ein cleanes, modernes Erscheinungsbild, das Inhalte strukturiert und leicht erfassbar macht. Als Schriftart kam „Outfit“, eine moderne Sans-Serif-Schrift, zum Einsatz. Sie bietet eine sehr gute Lesbarkeit auf allen Geräten, wirkt gleichzeitig professionell und zugänglich und unterstützt damit genau die Wirkung, die für eine Praxiswebsite entscheidend ist.

03 Domain-Wahl

Parallel dazu wurde die passende Domain definiert. Die Wahl fiel auf „herz-und-innere.de“, da sie die beiden Fachbereiche der Praxis direkt widerspiegelt und gleichzeitig klar verständlich sowie suchmaschinenrelevant ist. Die Domain wurde von uns registriert und technisch eingerichtet.

04 Hero Section: Erster Eindruck mit regionalem Bezug

Ein zentraler Bestandteil der Website ist die sogenannte Hero Section – also der erste sichtbare Bereich beim Aufrufen der Seite. Hier sollte laut Wunsch der Praxis ein regionaler Bezug hergestellt werden. Wir erhielten dafür ein selbst aufgenommenes Bild aus Stralsund. Da die Qualität des Bildes noch nicht optimal war, haben wir es umfassend bearbeitet: Perspektive und Bildwirkung wurden optimiert, die Lichtstimmung angepasst (unter anderem durch eine verstärkte Sonnenuntergangsatmosphäre) und die Auflösung erhöht, sodass ein scharfes und hochwertiges Ergebnis entstand. Mehr Infos zur Bildbearbeitung

Anschließend wurde das Bild so in die Website integriert, dass der Text klar lesbar bleibt – durch eine dezente Aufhellung sowie eine saubere Trennung zwischen Inhalt und Hintergrund. Im ersten Entwurf ergänzten wir die Hero Section zusätzlich um drei Informationsboxen im unteren Bereich, um zentrale Inhalte direkt sichtbar zu machen. Der Text wurde so platziert, dass er sich klar vom Hintergrund abhebt und sofort Orientierung gibt.

05 Header & Logo-Optimierung

Beim Header ergab sich eine besondere Herausforderung: Das Logo der Praxis lag ausschließlich analog auf Papier vor. Wir haben dieses digitalisiert und für die Webnutzung optimiert. Dabei wurden insbesondere die Linien des Herzsymbols bewusst verstärkt (siehe Header), damit es auch in kleineren Darstellungen klar erkennbar bleibt.

Analog

Digital

06 Header

Zusätzlich wurde ein auffälliger „Termin buchen“-Button im Header integriert, um Nutzer:innen direkt zur wichtigsten Aktion zu führen.

07 Aktuelles: Klare Informationshierarchie

Der Bereich „Aktuelles“ wurde bewusst einfach gehalten. Ziel war es, aktuelle Informationen schnell erfassbar darzustellen. Die einzelnen Beiträge unterscheiden sich visuell in ihrer Größe, wodurch eine klare Gewichtung nach Relevanz entsteht und Nutzer:innen intuitiv erkennen, welche Inhalte besonders wichtig sind.

08 Über uns: Ein digitaler Rundgang durch die Praxis

Im „Über uns“-Bereich lag der Fokus darauf, die Praxis persönlich und vertrauensvoll darzustellen. Neben einem einleitenden Text wurden mehrere Bilder der Praxis eingebunden. Da mehr Bildmaterial vorlag, als sich sinnvoll nebeneinander darstellen ließ, haben wir uns für eine Carousel-Lösung entschieden. Dadurch entsteht für Besucher:innen eine Art Rundgang durch die Praxis, ohne dass die Seite überladen wirkt. Das Ergebnis ist ein ruhiges, hochwertiges Erscheinungsbild, das die Praxis authentisch widerspiegelt.

09 Bildbearbeitung

Alle Bilder wurden von uns zusätzlich nachbearbeitet, um sie optisch zu vereinheitlichen, aufzuhellen und an den Gesamtstil der Website anzupassen.

Vorher Nachher

Empfangsbereich

Vorher Nachher

Behandlungsraum

Vorher Nachher

Warteraum

10 Terminbuchung: Integration von Doctolib

Ein besonders wichtiger Bestandteil der Website war die Terminbuchung. Die Praxis arbeitet mit dem externen System Doctolib, wodurch Termine nicht direkt über die Website, sondern über eine externe Plattform gebucht werden. Das bringt erklärungsbedürftige Abläufe mit sich. Um hier Klarheit zu schaffen, haben wir eine eigene Section entwickelt, die den Buchungsprozess Schritt für Schritt erklärt. Diese ist visuell strukturiert aufgebaut und kombiniert verständliche Anleitung mit einem klaren Call-to-Action, der direkt zur Terminbuchung führt.

11 Terminvorbereitung: Klare Patientenführung

Ergänzend dazu wurde eine weitere Section erstellt, die zeigt, was Patient:innen zum Termin mitbringen sollen. Diese Informationen wurden in übersichtlichen Cards dargestellt, sodass sie schnell erfassbar sind und Rückfragen in der Praxis reduziert werden.

12 Leistungen: Flexibles Layout statt starrem Raster

Die Darstellung der Leistungen stellte eine gestalterische Herausforderung dar, da die Texte unterschiedlich lang waren. Ein klassisches Raster hätte hier unruhig gewirkt. Deshalb haben wir ein variables Layout entwickelt, bei dem die Container unterschiedliche Größen haben. Dadurch entsteht eine dynamische, aber dennoch strukturierte Darstellung. Unterstützt wird das Ganze durch passende Icons, die die jeweiligen Leistungen visuell vereinfachen und die Orientierung erleichtern.

13 Kontaktbereich: Alle Informationen auf einen Blick

Der Kontaktbereich wurde so aufgebaut, dass alle wichtigen Informationen sofort sichtbar sind. Auf der linken Seite werden sämtliche Kontaktdaten übersichtlich dargestellt, inklusive Öffnungszeiten in Tabellenform, sodass diese auf einen Blick erfassbar sind. Auf der rechten Seite befindet sich eine integrierte Google Maps Ansicht, die die direkte Navigation zur Praxis ermöglicht.

14 Footer

Der Footer wurde übersichtlich und funktional aufgebaut und bildet den strukturierten Abschluss der Website. Ziel war es, alle relevanten Informationen gebündelt darzustellen, ohne die visuelle Ruhe zu stören.
Er enthält die wichtigsten Praxisinformationen inklusive Anschrift, eine kompakte Navigation zu allen zentralen Seiten sowie die gesetzlich notwendigen Links wie Impressum und Datenschutzerklärung.
Durch die klare Aufteilung in mehrere Bereiche und den dunkleren Blauton fügt sich der Footer harmonisch in das Gesamtbild ein und bleibt trotz des Umfangs gut erfassbar.

15 Feedback

Nach Fertigstellung des ersten Entwurfs erhielten wir ausführlicheres Feedback.

Hinweis: Die folgende Darstellung ist kein wörtliches Zitat, sondern eine sinngemäße Zusammenfassung des erhaltenen Feedbacks.

16 Umsetzung des Feedbacks

Die visuelle Gestaltung wurde als gelungen wahrgenommen, allerdings gab es Optimierungsbedarf in der Struktur. Einige Inhalte waren doppelt vorhanden, der Einstieg wirkte noch zu unpersönlich und einzelne Elemente erschienen redundant. Auf Basis dieses Feedbacks haben wir die Website gezielt überarbeitet.

13 Umsetzung des Feedbacks

Die Hero Section wurde angepasst, indem der Hintergrund stärker in Blau gehalten wurde, der Container um den Text entfernt und unnötige Elemente reduziert wurden. Der Text selbst wurde überarbeitet, um die Seite einladender und persönlicher wirken zu lassen. Zusätzlich wurde die gesamte Seitenstruktur überarbeitet: Statt einer Onepager-Lösung entstand eine Website mit mehreren Unterseiten. Leistungen und Terminbuchung wurden auf eigene Seiten ausgelagert und sind nun klar über die Navigation erreichbar. Auch der Footer wurde entsprechend angepasst und vereinfacht.

17 Feedback

Nach Umsetzung aller Änderungen wurde die Website erneut präsentiert. Dieses Mal waren alle Punkte umgesetzt. Die Rückmeldung war durchweg positiv, sodass die Website final freigegeben und veröffentlicht werden konnte.

18 SEO Optimierung

Neben Design und Struktur wurde die Website auch technisch sauber umgesetzt. Dazu gehörten unter anderem suchmaschinenoptimierte Seitentitel und Meta-Beschreibungen, eine korrekte Zeichencodierung (UTF-8), ein responsives Viewport-Setup sowie die Steuerung der Indexierung über Meta-Robots. Zusätzlich wurden Open-Graph-Daten integriert, um die Darstellung in sozialen Netzwerken zu verbessern. Für Suchmaschinen wurde strukturierte Daten in Form von Schema.org-Markup implementiert, wodurch Informationen wie Fachrichtung, Adresse und Kontaktdaten besser verstanden und eingeordnet werden können. Auch Favicons wurden eingebunden, um die Wiedererkennbarkeit der Website zu erhöhen.

Kurz: Die Website wurde nicht nur visuell umgesetzt, sondern auch technisch so aufgebaut, dass sie im Netz sichtbar wird und langfristig gefunden werden kann.

12 Launch & Sichtbarkeit

Nach dem Launch wurde die Website mit der Domain verknüpft, die komplette Struktur eingerichtet und alle Inhalte hochgeladen. Darüber hinaus wurden Impressum und Datenschutzerklärung erstellt und integriert.

Damit die Website auch tatsächlich gefunden wird, haben wir die Indexierung bei Google angestoßen, eine Sitemap erstellt und eingereicht sowie die Website mit dem Google-Profil der Praxis verknüpft und dort zusätzlich Bilder hinterlegt. Die Performance wird seitdem über die Google Search Console überwacht.

Wichtig ist dabei: Sichtbarkeit entsteht nicht sofort. Faktoren wie Relevanz, Inhalte, Nutzerverhalten und die allgemeine Autorität einer Website entwickeln sich über Zeit. Genau deshalb endet unsere Arbeit nicht mit dem Launch. Wir begleiten Projekte auch danach weiter und behalten die Entwicklung im Blick, um bei Bedarf gezielt optimieren zu können.

13 Fazit

Dieses Projekt zeigt vor allem, wie wichtig die Zusammenarbeit im gesamten Prozess ist. Eine gute Website entsteht nicht einfach auf Anhieb, sondern durch Austausch, Feedback und gezielte Anpassungen. Wir nehmen uns die Zeit, das Projekt wirklich zu verstehen, gehen auf individuelle Anforderungen ein und entwickeln Lösungen, die genau zur Praxis passen. Statt mit vorgefertigten Baukastensystemen zu arbeiten, wird jede Website von Grund auf individuell gestaltet und Schritt für Schritt gemeinsam weiterentwickelt.

Gleichzeitig wird deutlich, dass die Arbeit an einer Website nicht mit dem ersten fertigen Design abgeschlossen ist. Sichtbarkeit, technische Pflege und kontinuierliche Optimierung spielen eine entscheidende Rolle für den langfristigen Erfolg. Genau aus diesem Grund arbeiten wir bewusst mit einem monatlichen Modell statt mit einer einmaligen Zahlung – damit die Website nicht nur erstellt, sondern auch nachhaltig weiterentwickelt und betreut wird.

18 Kundenfeedback