Newsletter

  • Immer informiert über die neusten Trends, Webseiten und Tutorials! Einfach hier für den monatlichen Newsletter anmelden.
  •  Eintragen
  •  Austragen

Login

Umfrage

  • Haben Sie Interesse an Softwaretipps für Webmaster?
  •  
  • ja
  • nein
  •  


Linktipps

Anzeige

 

www.finanzcheck.de

Responsive Design für Webseiten


Smartphones und Tablets laufen heutzutage dem klassischen Computern und Laptops den Rang ab. Immer mehr Menschen nutzen eines der mobilen Endgeräte, wenn sie im Internet unterwegs sind. Webseitenbetreiber stellt dies vor eine große Herausforderung. Schließlich sollen die veröffentlichten Onlineinhalte jedem Benutzer gleichermaßen zur Verfügung stehen. Das ist aufgrund der zahlreichen verschiedenen Displaygrößen der einzelnen Geräte aber gar nicht so einfach. Das Display eines gängigen Smartphones liegt meist im Bereich von 4 oder 5 Zoll, während das Display eines klassischen Computermonitors gerne auch mal über 20 Zoll liegt. Wie lassen sich nun die Webseiten Inhalte auf jeder Displaygröße optimal darstellen? Die Antwort lautet: Responsive Design.


Mithilfe eines Responsive Designs werden Webseiten automatisch an die Displaygröße des Besuchers angepasst. Auf diese Weise bekommt jeder Besucher dieselben Inhalte angezeigt, nur Layout und Design werden individuell auf das Endgerät abgestimmt. Folgende drei Faktoren spielen dabei eine wichtige Rolle:

Keine festen Schriftgrößen


Beim Responsive Design wird auf feste Schriftgrößen verzichtet. Stattdessen kommen prozentuale Werte zum Einsatz, damit sich die Schriftgröße individuell nach Displaygröße skalieren lässt. Wenn bei einem herkömmlichen Design beispielsweise die feste Schriftgröße 14pt verwendet wird, lässt sich diese zwar auf einem großen Computermonitor optimal lesen, auf dem kleinen Handydisplay ist dies allerdings viel zu anstrengend für die Augen. Eine prozentuale Angabe im Verhältnis zur Auflösung erleichtert hier dem Benutzer das Lesen.

Keine festen Bildgrößen


Auch bei Bildern wird beim Responsive Design nicht mit festen Größen für alle Displays gearbeitet. Stattdessen werden in der Regel verschiedene Versionen eines Bildes auf dem Server abgelegt. Je nachdem, mit welchem Endgerät und Display ein Besucher auf die Webseite kommt, wird dann das Bild in entsprechender Größe geladen und angezeigt.

Keine festen Layouts


Grundsätzlich gibt es beim Responsive Design auch keine festen Layouts. Einzelne Designelemente werden je nach Displaygröße verschieden angeordnet, damit ein optimaler Aufbau der Webseite auf jedem Endgerät möglich ist. Dabei wird festgelegt, welche Inhalte am relevantesten für den Besucher sind, um diese dann entsprechend prominent auf der Webseite ausspielen zu können.
23.05.2017
Zurück zur Übersicht
 
Anzeige