Archiv

Webdesign-Blog

24. September 2016

Hospiz Aurich responsive

Auch die Seiten des Hospiz Aurich e.V., erstellt im Februar 2012, wurden jetzt weiter modernisiert und an die heute gängigen mobilen Geräte wie Tablets und Smartphones angepasst.

Webdesign Essen - Unterseite von hospiz-aurich.de auf dem PC

Das Layout ähnelt in seinen Grundzügen dem bisherigen, allerdings ist es nun zeitgemäß großzügiger und vereinfacht angelegt. Sämtliche Kopfbilder, seinerzeit langwierig über iStockPhoto.com ausgesucht und lizenziert **, blieben dabei erhalten. Man sieht diese nun in höherer Qualität und über die gesamte Seitenbreite vergrößert, was ihre Wirkung deutlich erhöht.

Auch die Seitenstruktur ist zumindest ähnlich geblieben, die zweite Spalte rechts mit über PHP aus einer Datenbank ausgelesenen Termine entfällt. Die Schrift ist um eine Stufe größer, das kleine Zusatzmenü im Seitenkopf liegt jetzt halb-transparent im Bild. Auch den im Kopfbild liegenden grauen Querbalken mit der Seitenüberschrift und das ebenfalls über dem Bild liegende Logo gibt es noch, Besucher, welche die alten Seiten kannten, sollten sich also leicht zurechtfinden.

 

Optimale Anzeige auf verschiedenen Geräten

Vollständig neu ist wie gesagt die Anpassung an die mobilen Geräte, im Folgenden ein paar Beispiele und Erklärungen:

Unterseite von hospiz-aurich.de auf einem Notebook

Notebook

Die Darstellung auf dem Notebook ist nahezu unverändert zur PC-Ansicht auf einem großen Bildschirm. Die Höhe des Seitenkopfes ist geringfügig reduziert, mehr Veränderungen gibt es in dieser Stufe nicht.

Unterseite von hospiz-aurich.de auf einem Tablet

Tablet

Am Tablet verwandelt sich sich das Menü in eine anklickbare Box, umgangssprachlich auch oft als „Burger-Menü“ bezeichnet, welche ebenfalls über dem Kopfbild liegt. Teils entfallen Design-Elemente aus Platzgründen.

Unterseite von hospiz-aurich.de auf einem Smartphone (Handy)

Smartphone (Handy)

Am Handy ist alles nochmal verkleinert, bis auf einen kleinen Abstand rechts und links entfallen alle Seitenränder. Die zu lange Seitenüberschrift in der grauen Box oben wird durch Auslassungszeichen abgekürzt.

Soweit möglich werden alle heute gängigen Techniken wie die automatische Silbentrennung im Browser eingesetzt, um möglichst viel Text anzeigen zu können.

Bildoptimierung und Content Management (CMS)

Dank neuer Plugins und gewachsener Erfahrung in der Bildoptimierung konnte ich einige Bilder nochmals gegenüber der Fassung aus 2012 optimieren; beispielsweise ist der Himmel über den Sonnenblumen (siehe Screenshots) jetzt blauer, das Gelb der Sonnenblumen kräftiger.

Auf Wunsch der Inhaber haben diese nun eine nahezu vollständige Kontrolle über die Seiteninhalte, hierfür kommt wieder das bewährte Joomla als Content-Management-System zum Einsatz.

Durch die neuen Techniken gehen wir davon aus, dass auch die Suchmaschinen die Arbeit honorieren werden. Der SEO-Score stieg um ca. 10%.

 

Anmerkungen

** Die meisten auf hospiz-aurich.de verwendeten Aufnahmen wurden für das Hospiz lizenziert; bisher konnte mir noch niemand die Frage beantworten, ob ich mit einem Screenshot einer Seite, welches solche für Dritte lizenzierte Aufnahmen zumindest teilweise zeigt, das Urheberrecht verletze.

Da ich mir wie gesagt im Zweifel darüber bin, verwende ich vorsichtshalber nur Screenshots von Seiten, welche das von Dr. Freyland selber aufgenommene Sonnenblumen-Bild zeigen. Falls ein Jurist mitliest: es würde mich interessieren, wie die Rechtslage bei solchen „Arbeitsproben“ ist.