Für die Physiotherapie-Praxen des Teams Sabine Rollfing, Birgit Schneider und Alexander Klatt in Mainz-Hechtsheim und in Ginsheim-Gustavsburg haben wir zwei TYPO3 Webseiten in Responsive bzw. Fluid Design erstellt.

Responsive Design

Die Homepages der Praxis Frankenhöhe und der Praxis Mainspitze wurden als geräteunabhängige Webseite umgesetzt, die somit auch auf mobilen Endgeräten wie z.B. einem iPhone, iPad oder anderen Smartphones und Tablets optimiert ausgegeben wird. Lästiges Zoomen und horizontales Scrollen gehört damit der Vergangenheit an.

Oberste Prämisse „technisch modern und dennoch kompatibel“

Technisch orientieren sich die Webseiten an dem Grundsatz „Progressive Enhancement“: dieser ermöglicht die fehlerfreie Ausgabe auch in älteren Browsern, die Responsive Design nicht unterstützen. Auf diesem Wege werden ein Höchstmaß an Kompatibilität erreicht und trotzdem die Möglichkeiten der aktuellen Browser und mobilen Geräte in vollem Umfang genutzt.
Hinzu kommt eine optimierte Ausgabe der Webseite durch effizientes Cachhing (Zwischenspeichern) und eine komprimierte Übertragung, was eine bestmögliche Geschwindigkeit zur Folge hat: in Tests wurden somit 94 von möglichen 100 Punkten erzielt (Google Pagespeed auf der Startseite). Ergebnis: Eine performante Webseite nach modernen Standards für nahezu alle Geräte mit Internetzugang.

Erstellung TYPO3 Homepage Responsive Webdesign Physiotherapie Rollfing Schneider Klatt Mainz

Einmal CMS bitte

Bei der technischen Basis fiel die Wahl auf TYPO3, eines der mächtigsten lizenzkostenfreien Open Source Content Management Systeme. Ganz nach dem Paradigma „so viel wie nötig, so wenig wie möglich“ wurden nur eine Hand voll TYPO3-Erweiterungen hinzugefügt und grundlegende Funktionen mit bordeigenen TYPO3-Mitteln umgesetzt. Die Reduzierung auf das Nötigste erleichtert spätere Updates und erhöht die Sicherheit. Die benutzerfreundliche Oberfläche von TYPO3 ermöglicht die komfortable Verwaltung der Homepages beider Praxen in einem „Backend“.

Responsive Design heißt nachhaltig gestalten

Im Gegensatz zu klassischem Webdesign bedeutet Responsive bzw. Fluid Webdesign die Gestaltung der Homepage für verschiedene Geräte- und Auflösungsklassen. Die hohe Auflösung des Retina-Displays eines iPhones erfordert beispielsweise eine angepasste Schriftdarstellung, andernfalls wären Texte schlicht zu klein. Aber auch die Navigation erfordert ein Design, das sowohl die Bedienung mit der Maus als auch Touch-Gesten unterstützt. Zudem sind die meisten Computer-Displays quer-formatig, während iPad und iPhone auch vertikal verwendet werden können. Wir haben letztlich drei Auflösungsklassen mit fließendem Übergang definiert. Versuchen Sie es selbst und öffnen Sie die Seiten Praxis Frankenhöhe & Praxis Mainspitze auf unterschiedlichen Geräten oder skalieren Sie einmal das Browserfenster.

Der Schmetterlings-Effekt

So wie der Flügelschlag eines Schmetterlings laut Chaostheroie am anderen Ende der Welt einen Sturm verursachen kann verhält es sich oftmals auch in der Webentwicklung: ein kleiner Fehler kann – insbesondere bei neuen Technologien – schnell eine sehr deutliche und vor allem ungewollte Wirkung erzielen. Effiziente Workflows und die Versionierung mit GIT erleichtern die Arbeit und schaffen Sicherheit. Den perfekten Workflow wird es hinsichtlich des stetigen Wandels im Web nicht geben, aber das Streben zur Perfektion ist es, was uns in jedem Projekt besser macht.

Harte Fakten

  • TYPO3 4.6.4
  • HTML5, CSS2 und CSS3
  • YAML4 CSS-Framework
  • jQuery 1.7.1 & Modernizr 2.5.3
  • Effiziente Entwicklung mit SASS, Compass und CoffeeScript
  • Kompatibilität: ab Internet Explorer 7, ab Firefox 1.5, ab Safari 3, Google Chrome, Opera, iOS Safari, Android Browser, Konqueror, Camino, u.v.w.

Suchen Sie eine professionelle Webagentur bzw. eCommerce Agentur?

Zögern Sie nicht uns zu kontaktieren!