adaptiv vs. responsive

Sie können eine adaptive App haben, die nicht responsive ist, oder umgekehrt.
Und natürlich kann eine App beides oder keines von beidem sein.

Adaptives Design:

  • Es werden separate Designs für Desktop-Computer, Tablets und Mobilgeräte erstellt
  • Media Queries oder andere Techniken, um das Gerät zu identifizieren etc. Mit Media Queries werden Breakpoints gesetzt.
  • Bessere Leistung, da nur das Layout für erkanntes Gerät geladen wird

Responsive Design:

  • Einheitliches Layout für alle Geräte. Dynamische Anppasung an verschiedenen Bildschirmgrößen
  • Flüssige Raster und flexible Elemente. Skalierung proportional zw. UI-Elementen und Bildschirmabmessungen
  • Schwerpunkt in Verwendung von Media Queries liegt darauf, dass das Layout dynamisch auf verschiedene Bildschirmgrößen reagiert, ohne spezielle Designs für bestimmte Geräte vorzusehen.

Beide Ansätze haben jedoch gemeinsame Ziele:

  • Benutzerfreundlichkeit: eine gute UX, unabhängig vom verwendeten Gerät.
  • Optimierung für verschiedene Geräte: die Benutzeroberfläche auf einer Vielzahl von Geräten und Bildschirmgrößen gut dargestellt wird.

Kurze Einführung in Responsive Design (EN) ca. 6 min.: https://www.linkedin.com/learning/mapping-the-modern-web-design-process/responsive-web-design-as-a-process-14881664?u=36053084