Archiv

Webdesign-Blog

15. Oktober 2016

Neugestaltung der Webseite Diabetes Münster

Mein diesjähriges Sommer-Großprojekt ist nun abgeschlossen und online gestellt, es handelt sich um die komplette Neugestaltung der Webseiten des Zentrums für Diabetes und Gefäßerkrankungen in Münster.

Webseiten-Neugestaltung Diabetes Münster, Startseite der Praxis

Die ursprünglichen Internetseiten der Arztpraxis waren stark überaltert und nicht an mobile Geräte wie Smartphones und Tablets angepasst. Zwar hat die bisher mit dem Webdesign betreute Firma eine überarbeitete Version vorgeschlagen, das neue Layout fand in den Augen der Verantwortlichen aber keinen Gefallen.

 

Webseite neu gemacht

Nachdem mich Dr. Rose kontaktiert hatte, erstellte ich unverbindlich einen alternativen Layoutvorschlag, welcher ohne größere Änderungen schließlich akzeptiert und in monatelanger Arbeit ausgearbeitet wurde. Das Ergebnis ist seit letzten Montag im Netz zu sehen.

Webseiten-Neugestaltung Diabetes Münster / Startseite des Instituts

Der neue Auftritt ist, wie sein Vorgänger, in drei Bereiche mit jeweils einer speziellen Farbe aufgeteilt:

■ Diabetes-Praxis (Blau)
■ Institut für Diabetesforschung (Lila)
■ Diabetes-Sportstudio (Grün)

Die Farben waren vorgegeben, in den jeweiligen Bereichen sind jetzt die Überschriften, Schaltflächen und Design-Elemente wie Trennstriche jeweils passend gefärbt.

Zentrales Gestaltungselement der Seiten ist eine sich über die volle Fensterbreite erstreckende Bilderzeile. Diese wurde dergestalt angelegt, dass die linke Kante des mittleren Bildes immer mit der linken Kante des Menüs, der Überschrift und des Textes auf einer Linie liegt. Die Bildzeile ist ab 1600 Pixel Bildschirmbreite besonders groß und verkleinern sich stufenweise im Rahmen der jeweils zur Verfügung stehenden Breite.

Webseiten-Neugestaltung Diabetes Münster / Startseite des Sportstudios

Auf der Startseite von Praxis, Institut und Sportstudio laufen die Motive als Bildwechsel durch, auf den Unterseiten geschieht das nicht. Hier können die Bilder aber von Hand mittels der „Touchscreen-Wischtechnik“ und der Maus bewegt werden.

 

CMS

Als neues Content-Management-System löst eine aktuelle Version von Joomla das bisher verwendete Typo3 ab. Für einige Unterseiten habe ich spezielle Joomla-Komponenten über component-creator.com erstellt, welche die Seitenpflege deutlich vereinfachen:

und der aufwändige Trainingsplan auf https://www.diabetes-muenster.de/sportstudio/trainingsplan.html.

Trainingsplan

Dieser stellte durch die Spalten eine besondere Herausforderung da. Jeweils rechts muss in der ersten Spalte die Zeiten stehen, gefolgt von Spalten der Wochentage, je nachdem, wieviel Platz vorhanden ist.

Die Wochentagsspalten dürfen aber nun nicht beliebig verkleinert werden, damit der Text noch lesbar bleibt und nicht zu weit nach unten umgebrochen wird. Also müssen Spalten ggf. nach unten verschoben werden, wobei wieder eine führende Spalte mit den Zeiten notwendig ist.

Trainingsplan Notebook

Notebook

Hier die Ansicht auf einem Notebook, drei Wochentage (Montag, Dienstag und Mittwoch) sind sichtbar.

Trainingsplan Notebook (unten)

Die nächsten Wochentage (Donnerstag und Freitag) mit führender Zeiten-Spalte werden sichtbar, wenn man weiter nach unten scrollt.

Trainingsplan Tablet (Landscape)

Tablet / Landscape

Auf dem Tablet im Landscape-Modus reicht der Platz nur noch für zwei Wochentags-Spalten, also Montag und Dienstag.

Trainingsplan Tablet (Portrait)

Tablet / Portrait

Im Portrait-Modus wird es noch etwas enger, es ist jeweils nur ein Wochentag sichtbar.

Die Anpassung war knifflig, zeigt aber sehr schön, welch‘ tolle Möglichkeiten das responsive Webdesign bietet.

 

SEO

Leider musste ich feststellen, dass die bisher beauftragte Firma einige SEO-Fehler hinterlassen hatte. Unter anderem war auch der berühmte Home-Fehler dabei, hier in Form des unheimlich informativen Eintrags „Startseite“ im Seitentitel.

Auch gab es bisher keinerlei „sprechende URLs“, alles wurde suchmaschinen-unfreundlich über dynamische Parameter gesteuert. Es verwundert also nicht, dass der SEO-Score einen gewaltigen Sprung von bescheidenen 42% auf einen sehr guten Wert von 88% machte.

Dies alles sollte sich mittelfristig durch höheren Positionen in den Suchmaschinen-Ergebnissen bemerkbar machen..