🏴 EINLEITUNG
Du weißt nicht genau, wie du die Inhalte deiner Website optimal auf allen elektronischen Geräten anzeigen kannst?
In diesem Artikel erfährst du, was Responsive Design ist und wieso du es für dein Business brauchst.
🔍 PROBLEM
Es gibt unzählige elektronische Geräte.
Und auf all diesen unterschiedlich großen Bildschirmen, ob Tablet, Handy oder Laptop, muss deine Website ins Auge stechen und überzeugen. Das ist nicht gerade einfach.
Also: Wie schaffst du das? Musst du jetzt für jedes Handymodell, Tablet und Laptop ein eigenes kostspieliges Design erstellen lassen?
💡 LÖSUNG
Nein, zum Glück nicht.
Mithilfe von Responsive Design musst du im Grunde nur drei Designs für deine Website erstellen, die sich dann auf alle Modelle von Mobiltelefonen, Tablets und Laptops übertragen lassen.
So sparst du immens viel Zeit und Geld.
Übrigens: Du brauchst noch eine ansprechende, professionelle Website, die auf allen elektronischen Geräten optimal angezeigt wird?
Kein Problem. Wir sind für dich da. Schau einfach mal auf unserer Seite vorbei!
🧠 3 TIPPS FÜR TOLLES RESPONSIVE DESIGN
Was ist Responsive Design?
Mithilfe von Responsive Design stellst du sicher, dass deine Website auf die meisten unterschiedlichen Bildschirmgrößen angepasst ist.
Ziel ist dabei natürlich immer eine positive User Experience, denn deine Website soll deinen Kunden schließlich optimal angezeigt werden.
Wie das geht?
Mithilfe sogenannter fluid grids und flexiblen Bildern. Diese sorgen dafür, dass sich dein Design dem Browser anpasst und ermöglichen außerdem fließende Übergänge zwischen verschiedenen Geräten.
Neben den unterschiedlichen Bildschirmgrößen spielen nämlich auch die verschiedenen Browser eine große Rolle bei der Darstellung deiner Website.
Die wichtigsten Browser haben mittlerweile ihre eigenen Design-Versionen für Mobilgeräte und Desktops. Davon abgesehen musst du aber natürlich die unterschiedlichen Renderzeiten sowie ggf. Updates der verschiedenen Browser im Blick behalten.
Was musst du beim Responsive Design beachten?
Mittlerweile gibt es einfach zu viele unterschiedliche Geräte. Ein Standarddesign reicht heutzutage nicht mehr aus.
Was solltest du also tun?
Finde zunächst heraus, welche Geräte und Browser deine Zielgruppe verwendet, damit du dich für ein individualisiertes Layout entscheiden kannst. Am besten wirfst du einen Blick in Google Analytics.
Du weißt noch nicht, wie du dich in dem ganzen Zahlenwirrwarr von Google Analytics zurechtfinden sollst?
Dann lerne hier, wie du Google Analytics zu deinem Vorteil nutzen kannst.
Erstelle mindestens drei Designgrößen, welche an deine Zielgruppe angepasst sind:
- unter 600 Pixel für Handys
- 600-900 Pixel für große Mobiltelefone und Tablets
- über 900 Pixel für Laptops und Computer
Aber Vorsicht: Natürlich kann sich das Konsumverhalten deiner Kunden jederzeit ändern.
Ein Beispiel:
Bisher hat deine Zielgruppe hauptsächlich den Laptop genutzt, um auf deine Website zu gelangen. Nach einem Rebranding erregst du allerdings die Aufmerksamkeit einer jüngeren Zielgruppe, die hauptsächlich per Handy surft und über Pinterest auf deine Website kommt. In so einem Fall solltest du deine Designarten ergänzen und an die neue Zielgruppe anpassen.
Es ist also wichtig, dass du deine Analysedaten regelmäßig überprüfst und Designarten ggf. ergänzt, aktualisierst oder entfernst.
Beachte:
Wenn deine Zielgruppe viele unterschiedliche Geräte benutzt, überleg dir, ob fluid scaling für dich sinnvoll sein könnte. Damit erzielst du oft eine bessere User Experience.
User Experience & Interaktion
Überlege dir, wie Nutzer mit deiner Website interagieren werden. Bedenke dabei, dass jeder Nutzer ein anderes Gerät und einen anderen Browser verwendet.
Außerdem solltest du dir folgende Fragen stellen:
- Was wird auf mobilen Geräten anders dargestellt als auf dem Desktop?
- Wie können Menü und Navigationsleiste optimal auf mobilen Geräten angezeigt werden?
- Welche Funktionen und Schaltflächen sind für deine Zielgruppe und deren Interaktion mit deiner Seite wichtig?
- Wo sind zum Beispiel Buttons oder andere Interaktionsfelder gut sichtbar?
Du willst noch mehr zu dem Thema User Experience erfahren?
Inhalt vor Design
Der Inhalt deiner Website ist der Kern deines Unternehmens und der wichtigste Baustein für deine Online-Präsenz.
Überlege deshalb, wie dieser auf anderen Bildschirmen aussieht und durch verschiedene Browser unterschiedlich dargestellt werden könnte.
Orientiere dich außerdem daran, welche Geräte die Mehrheit deiner Hauptzielgruppe verwendet – nicht an den neuesten Handys und Laptops.
Bilder
Bilder sind ein Muss für eine ansprechende Website.
Aber was solltest du beachten?
Achte auf die Skalierung und Flexibilität deiner Bilder. Sie müssen sich an verschiedene Bildschirme anpassen und gleichzeitig für den User gut sichtbar sein.
Denn wer will schon ein Bild auf seiner Website, das er gar nicht erkennen kann?
Und? Wie sieht es bei dir aus? Du hast keine Zeit, dich um die Erstellung einer eigenen Website und eines Responsive Design zu kümmern?
