Sie benötigen eine neue Homepage? Wir erstellen eine kostenlose Preview vorab ... Einfach anrufen "  02941 - 270 150          

Responsive Webdesign

Responsive Webdesign bedeutet die Anpassung des Inhalts und des Layouts einer Website an das Ausgabegerät. 

Diese Anpassung ermöglicht es, eine Webseite auf verschiedenen Endgeräten unterschiedlich auszugeben, so dass die Inhalte für den Nutzer optimal dargestellt werden.

Wir zeigen Ihnen auf dieser Seite, wie Sie mit dem Blue Creator CMS auch Probleme lösen, die sich beim Responsive Webdesign ergeben.


Responsive Webdesign ist der Oberbegriff für ein sehr komplpexes und wichtiges Themengebiet, das sich permanent weiterentwickelt.

Ziel des Responsive Webdesign ist eine hohe Benutzerfreundlichkeit der Webseite. 

Die Benutzerfreundlichkeit der Webseite hängt neben der Darstellung aber auch von der Nutzbarkeit und Geschwindigkeit bzw. der Ladezeit ab.

Das folgende Beispiel beschreibt eine typisches Problem vieler Webseiten, die über Responsive Webdesign verfügen, aber nicht dafür optimiert sind.


Praxisbeispiel:

Situation:

Auf einer Webseite befindet sich ein Bild. Das Bild hat eine Größe von 845,9 kB bei 1024x768 Pixeln.

Wenn diese Webseite auf einem Smartphone angezeigt wird, stehen auf dem Gerät aber nur 480 Pixel in der Breite zur Verfügung. 

Der Browser lädt das Bild und skaliert das Bild herunter, so dass es vollständig darstellt wird, ohne abgeschnitten zu werden.

Das Bild muss vom Webserver auf das Smartphone heruntergeladen werden. Dieser Ladevorgang für das Bild ist abhängig von der Internetgeschwindigkeit.

Bei einer optimalen Verbindung mit UMTS / 3G / LTE 7000 dauert das Herunterladen 1 Sekunde, mit Edge sogar 30 Sekunden.


Problem:

Die Bilddatei wird erst vom Browser herunterskaliert. Durch die Ladezeit des zu grossen Bilds, wird unnötiger Traffic erzeugt und der User bricht den Ladevorgang vielleicht sogar ab, weil die Webseite nicht schnell genug angezeigt wird.


Lösung:

Das Blue Creator CMS optimiert Bilder schon automatisch, sobald sie auf den Webserver geladen werden. Das Beispiel-Bild ( MS Windwos Desert.jpg ) verliert durch diese erste Optimierung 72%. Die Dateigröße des optimierten Bilds beträgt 234,4 kB und wird dadurch schon fast 4 mal schneller geladen.

Doch damit nicht genug. Auf einem Smartphone wird das Bild nur mit einer maximalen Breite von 320 Pixeln angezeigt. Deshalb generiert das Blue Creator CMS das Bild auf dem Server mit einer Breite von 320 Pixeln. Das Bild hat dann eine Dateigröße von ca. 40 kB.


Ergebnis: Das Bild wird immer mit so wenig Datenvolumen wie nötig ausgeliefert. Das Bild aus dem Beispiel wurde im ersten Schritt um 72% Dateimenge verringert. 

Im zweiten Schritt, wurde es für die Darstellung auf dem Smartphone optimiert und erreicht so eine Datenersparnis von über 95% und kann 20 mal schneller geladen werden, als das ursprüngliche Bild aus diesem Beispiel.   



Wir werden auf dieser Seiten in Kürze eine ausführliche Beschreibung aller relevanten Maßnahmen zur Umsetzung des Responsive Webdesign mit Blue Creator bereitstellen.



COPYRIGHT 2016  BLUE CREATOR GmbH. ALL RIGHTS RESERVED1