Glorreiche Sieben Tipps für eine gute Praxiswebseite

Einfach zu benutzen

Das wichtigste Merkmal einer guten Website ist, dass Nutzer ihr Ziel zügig, fehlerfrei und zufriedenstellend erreichen können. Nicht das coole Design einer Seite macht sie erfolgreich, sondern ihre Benutzerfreundlichkeit – auch Usability genannt.

Responsive

Eine Webseite für alle Anzeigegeräte

Zahnarztempfehlungen von Freunden möchte man oft sofort überprüfen, beispielsweise auf dem Smartphone während eines geselligen Beisammenseins. Um Zahnarzttermine für die Familie zu vereinbaren, ruft man die Sprechzeiten mit dem iPad im Wohnzimmer auf, statt umständlich den PC im Arbeitszimmer hochzufahren.

Damit die Webseite auf jedem Gerät gut zu betrachten ist, wird sie responsive programmiert, d. h. sie passt sich an die Bildschirmgröße an. Dabei reicht es nicht, nur die Bild- und Textgrößen dem Anzeigegerät anzupassen. Auch das Layout und die Reihenfolge der Inhalte müssen angepasst werden. Hier sind zwei Beispiele für die vielen Responsive-Anpassungen, die ich auf meinen Zahnarztwebseiten vornehme:

Anpassen von Bildkarusells bzw. Slideshows für das Smartphone

Titelbild bzw. Slider/Diaschau

Querformatige Titelbilder oder Bildkarussells sind auf Titelseiten von Webseiten sehr beliebt. Diese sehen im panoramaartigen Format auf dem Desktop toll aus. Auf dem Smartphone hingegen werden sie zu einem schmalen, schwer erkennbaren Bildstreifen.
Deshalb sollte auf dem Smartphone eine Alternative mit hochformatig beschnittenen Motiven bereitgestellt werden.

Der Bildwandler des Desktopmonitors im Querformat wird durch einen schmaler beschnittenen Bildwandler auf dem Smartphone ausgetauscht.
Die darunter angefügten Text- und Bildspalten werden neu zusammengestellt.

Sehgewohnheiten bei der Bild /Text Reihenfolge berücksichtigen

Reihenfolge von Inhalten auf dem Smartphone

In der zweispaltigen Seitenansicht wirkt der Text am Seitenanfang oft besser, wenn das Bild rechts positioniert ist. In der einspaltigen Smartphoneansicht rutscht das Bild hingegen nach hinten. Auf dem Smartphone sieht es allerdings besser aus, wenn mit einem „Titelbild” begonnen wird. Durch die passende Codierung (column-reverse) wird das Bild nach vorne geholt.

Desktop zwei Spalten — Seite ist zweispaltig in der Desktop-Darstellung

Ohne

Mobil falsche Reihenfolge — Seite wird einspaltig auf dem Smartphone. Die rechte Spalte rutscht nach unten.

Mit Codierung column-reverse

Mobil richtige Reihenfolge — Passendere Ansicht mit Bild vorne als Titelbild.

Reihenfolge von Inhalten bei wechselseitiger Bild und Textspalte

Um die Abwechslung von Bild und Text beizubehalten, muss die Reihenfolge der Spalten durch die passende Codierung „column-reverse” geändert werden.

Ohne

Mit Codierung column-reverse

Usability

Kontaktinfos optimieren

Die Basisinformationen wie Anschrift, Telefonnummer, E-Mail-Adresse, Sprechzeiten und Anfahrtsbeschreibung sollen zügig von überall auf der Seite einsehbar sein.

Hat der potenzielle Patient einen guten Eindruck von der Praxis gewonnen, möchte er einen Termin vereinbaren und wissen, wie er dorthin kommen und wo er parken kann oder wo die nächste Haltestelle liegt.

Der neue Patient sucht nach diesen Informationen auf der Praxiswebsite. Dem Stammpatienten reicht wahrscheinlich der schnelle Blick auf die Google-My-Business-Seite der Praxis. Deshalb ist es wichtig, diese Google-Seite zu übernehmen und zu pflegen.

Screenshot der Smartphone-Anzeige des Sticky-Menüs mit den Buttons zu den Sprechzeiten, zur Lagekarte und zum Anrufen. — Screenshot der Smartphone-Ansicht des Sticky-Menüs mit den Buttons zu den Sprechzeiten, zur Lagekarte und zum Anrufen.

Terminbuchung zum Aufklappen im Kopf der Seite

Aufklappbarer Detailblock

Unmittelbar unter dem Header läßt sich ein Detailblock öffnen, der die Terminfunktionen aufruft.
Nach Klick auf den Pfeilbutton klappt eine Fläche mit Buttons auf. Über diese können Sie einen Termin per E-Mail, Telefon oder, wenn vorhanden, auch per Onlinefunktion vereinbaren. Direkt daneben finden Sie die Telefonzeiten.

Screenshot Praxis an der Elz - Termin Detail-Block geschlossen mit Pfeil Icon und Icons die Inhalt repräsentieren: Kalender, Telefon und Uhr

Screenshot Praxis an der Elz - Termin Detail-Block geöffnet - zeigt Termin Buttons und Telefonzeiten

Fest verankerte Menü-Buttons zu Anfahrtskarte, Sprechzeiten und zum Telefonieren

„Sticky Menue“

Ein beim Scrollen feststehendes Menü („Sticky“) erleichtert den schnellen Zugriff auf die wichtigsten Kontaktinformationen und -funktionen.

Lagekarte

Google Maps Karte einbinden?

Das direkte Einbinden von „Google Maps“ ist auf Webseiten weit verbreitet.
Ich ziehe jedoch eine selbst gezeichnete Detail- und Übersichtskarte zur schnellen Information vor. Wirklich relevante Details zum öffentlichen Nahverkehr, einprägsame Landmarken oder Gebäude und wichtige Parkmöglichkeiten lassen sich hier besser hervorheben. Außerdem ist das Einbinden inzwischen kostenpflichtig und man benötigt ein Plug-in, um Maps entsprechend der DSGVO einzurichten.

Google Maps Business Seite der Praxis

Zusätzlich biete ich einen Link per Button zur Google-Maps-Business-Seite der Praxis an. Von dort aus lässt sich eine Route zur Praxis leicht planen. Der Button ist datenschutzrechtlich unbedenklich.