Kennt ihr diese Websites, die man sich auf dem Smartphone ansieht oder auf dem Tablet, wo die Texte gut lesbar sind und sich die Bilder sauber anordnen? Sich die Website der Größe des Bildschirmes anpasst und immer etwas anders aussieht wie wenn man sich die Website am PC anschaut?
Dann seid ihr auf einer responsiven Seite gelandet.
Was heißt „responsive“?
Responsive bedeutet frei übersetzt „reagierend“.
D.h. die Website reagiert jeweils auf das mobile Ausgabe-Gerät wie z.B. einem Smartphone (iPhone, Samsung & Co.) oder einem Tablet (iPad & Co.) und verändert sein Aussehen entsprechend.
Warum sollte Deine Seite responsive sein?
1. Bessere Lesbarkeit
- Eine responsive Seite ist, egal ob auf dem Smartphone, am Tablet oder am PC, immer gut zu lesen.
- Der Platz für den Text wird maximal ausgenutzt, Randbereich oder Sidebars rutschen meist unter den Haupt-Content Bereich und füllen dort den Platz voll aus.
- Der Text ist so groß dass er nicht erst herangezoomt werden muss.
- Die Bilder passen sich der Bildschirmgröße an.
2. Schöneres Nutzer-Erlebnis
2014 nutzten über 54% der deutschen Bevölkerung das Internet mobil. Sprich über die Hälfte nutzte ein mobiles Gerät wie Smartphone oder Tablet um im Internet z.B. auf Websites zu gehen. Tendenz steigend.
Nicht nur das. Die mobilen Geräte sind immer griffbereit und meist in Dauernutzung. Hier mal schnell nach einer Telefonnummer suchen, hier mal eben ein Buch kaufen und hier noch schnell in der S-Bahn einen Blogartikel lesen.
Bevor sich dieser Trend durchsetzte war es ganz normal dass man auf Websites ging und diese genauso aussahen wie am PC. Um die Texte zu lesen musste man meist die Seite mit dem Finger aufzoomen und hatte dann auch nur einen Ausschnitt der Website im Blick. Schön war es nicht wenn man die Seite dann nach rechts und nach links verschieben musste um zu sehen was in der Sidebar steht oder um zur Navigation zu kommen. Um nicht zu sagen bisweilen war es auch recht fummelig bis man endlich einen Menü-Punkt erwischt hat.
Ganz anders bei einer responsiven Website.
- Auf einen Blick ist alles Wesentliche zu erkennen.
- Die Navigation reagiert auf die Bildschirmgröße und versteckt sich meist hinter einem kleinen Icon dass gut zu bedienen ist und so nicht viel Platz für sich beansprucht.
- Die einzelnen Menüpunkte lassen sich ordentlich anklicken.
- Verlinkungen sind durch den gut lesbaren Text besser anzutippen.
- Die Bedinung, auch das Ausfüllen von Kontaktformularen, ist um einiges nutzerfreundlicher geworden.
Damit ist der „mobile“ Personenkreis schon längst zu einem nicht zu unterschätzenden geworden, dem man es so einfach wie möglich machen sollte sich auf der eigenen Website zu orientieren und durch eine responsive Website eine angenehme Benutzerführung zu ermöglichen.
3. Google liebt responsive Websites
Last but not least hat eine responsive Website auch einen wichtigen Einfluss auf das Ranking bei Google und kann damit einen entscheidenden Wettbewerbsvorteil für Euch bedeuten.
Das liegt vor allem daran dass, wie bereits oben beschrieben, immer mehr Menschen mobil im Internet unterwegs sind und Google diese mobile Kompatibilität einer Website positiv bewertet.
Wovon ihr Euch bei einer responsiven Website verabschieden dürft
Ganz klar. Eine responsive Ansicht am PC sieht ganz anders aus als die selbe Website am Smartphone.
Diesen „Knick“ gilt es zu verstehen. Eine responsive Website folgt einzig und allein der Usability des Nutzers.
D.h. jetzt nicht dass aus der Farbe Blau am PC die Farbe Grün am Smartphone wird.
Das heißt nur dass die einzelnen Elemente sich anders anordnen werden, die Schriften sich der Größe anpassen werden, die Navigation z.B. hinter einem Icon verschwindet und z.B. die Sidebar unter den Haupttext rutscht.
Alles andere wie Logo, Farben, Typo, Inhalte, Bilder und die meisten Funktionen bleiben davon unberührt.
Mein Fazit
Nutzt die Chance Euch vom Wettbewerb abzuheben (denn nicht responsive Websites gibt es noch zu Hauf,…).
Werdet mobil und bringt mehr Spaß in das Lesen Eurer Seiten und Blog-Beiträge.
Tip am Rande
Ob Eure Website responsive ist lässt sich meist direkt mit dem eigenen Browser testen. Einfach mal den Browser etwas kleiner ziehen. Ändert sich die Ansicht? Dann ist sie responsive. Zeigt sich rechts und unten am Browser ein Scrollbalken und die Seite hat sich nicht verändert, dann ist die Seite meist nicht responsive.
Allerdings gibt es auch Seiten die responsive sind, dies sich aber wirklich nur am Smartphone zeigt und das Browserverkleinern an der Stelle nichts bringt.
Einen Online Schnell-Tester findet ihr auch hier unter be-responsive.de/website-check
Und nun Viel Spaß mit Eurem Programmierer der Euch hier bestimmt gerne mit Rat und Tat zur Seite steht.