Responsive & Adaptive Design

Adaptives Webdesign umfasst eine Vielzahl moderner Konzepte und Technologien und liefert exzellente Nutzererfahrung unabhängig vom eingesetzten Endgerät. Wir bei PulsarFour legen nahezu allen unseren Projekten ein responsives Webdesign (RWD) zugrunde. Wir verzichten auf starre Gitterstrukturen und stellen Medien als skalierbare Größen dar. Durch Einsatz standardisierter CSS Mediaqueries laufen unsere Designs auf allen Bildschirmgrößen. Zusammen mit unseren Kunden arbeiten wir daran, Content besser zu strukturieren und unabhängig von der Darstellungsform wiederverwendbar zu machen.

Unsere Services in diesem Bereich umfassen:

  • Maßgeschneiderte adaptive Webdesigns;
  • Maßgeschneiderte responsive Webdesigns;
  • Modernisierung einer bestehenden Webseite, mit teilweise oder vollständiger Responsiv Umsetzung je nach Geschäftszielen;
  • Entwicklung vollresponsiver Produkte wie maßgeschneiderter Produktkonfiguratoren oder eCommerce Plattformen;
  • Optimierung einer bestehenden responsiven oder adaptiven Webseite in Bezug auf Performance und Usability.

Responsives Design vs. Adaptives Design

Wie können Sie zwischen diesen beiden Designansätzen differenzieren? Für den Benutzer am Endgerät gibt es so gut wie keine Unterschiede. Und doch sind beide Ansätze verschieden:

Adaptive Design

 

  • Hält separaten HTML Code für jeweilige Endgerätetypen vor und passt die Präsentation dynamisch mit CSS an;
  • Verwendet Scripting zur Anpassung an Bildschirmgrößen. Erkennt standardmäßig den Endgertetyp und seine Konfiguration und passt dann das Verhalten der Webseite darauf an;
  • Lädt nur die für das vorliegende Endgerät benötigten Ressourcen, was zu wesentlich kürzeren Ladezeiten beiträgt;
  • Bilder sind an für bestimmte Bildschirmgrößen optimiert, was Dateigrößen und Ladezeiten reduziert;
  • Adaptive Templates werden auf Grundlage bestehender Webseitentemplates implementiert, sodass keine Notwendigkeit besteht das gesamte Frontend einer Webseite zu verändern.

Responsive Design

 

  • Verwendet Mediaqueries zur Bestimmung des Endgeräts;
  • Flexible Bilder und bewegliche Raster werden eingesetzt um genau an die anfragende Bildschirmgröße anzupassen;
  • Alle Assets einer Webseite werden unabhängig vom Endgerät geladen, was zu längeren Ladezeiten führt;
  • Ein einziges Template wird für alle Gerätetypen verwendet;
  • Um eine Webseite responsiv zu machen, muss das komplette Frontend überarbeitet werden.