CONTENT
ARCHITECTURE
Responsive Webdesign
CONTENT
ARCHITECTURE
Responsive Webdesign
CONTENT
ARCHITECTURE
Responsive Webdesign
Responsive Webdesign
Responsive Webdesign passt die Darstellung von Inhalten auf einer Seite an die Abmessungen des Bildschirms des Geräts an. Dies steht in direktem Gegensatz zum nicht responsiven Webdesign, das unabhängig von der Größe des verwendeten Bildschirms die gleichen Eigenschaften beibehält.
Responsive Webdesign ist ein Webentwicklungsansatz, bei dem das Erscheinungsbild einer Website dynamisch verändert wird, je nach Bildschirmgröße und Ausrichtung des Geräts, auf dem sie angezeigt wird. Responsive ist ein Ansatz, um das Problem der Gestaltung für die Vielzahl von Geräten zu lösen, die den Kunden zur Verfügung stehen, von winzigen Handys bis hin zu riesigen Desktop-Monitoren.
Responsive Design verwendet so genannte Breakpoints, um zu bestimmen, wie das Layout einer Website aussehen soll: ein Design wird oberhalb eines Breakpoints verwendet und ein anderes Design unterhalb dieses Breakpoints.
Breakpoints basieren in der Regel auf der Breite des Browsers.
Wozu Responsive Webdesign?
Das Ziel des responsiven Webdesigns ist es, den Nutzern einer Website unabhängig von dem Gerät, mit dem sie auf die Website zugreifen, das gleiche Erlebnis zu bieten.
Wenn ein Benutzer vom Desktop auf sein mobiles Gerät umschaltet, wechseln responsive Websites ohne jegliche Eingabe des Benutzers. Dank des responsiven Webcodes werden Bilder, Textinhalte und andere Elemente je nach Bildschirmgröße verschoben und verändert. Responsive Webdesign verhindert Probleme wie zu klein erscheinenden Text auf mobilen Geräten.
Historie des Responsive Designs
Ursprünglich wurden Websites für eine bestimmte Bildschirmgröße entwickelt, da die Auswahl an Geräten begrenzt war. Im Laufe der Zeit wurden jedoch immer mehr Bildschirmgrößen verfügbar.
Die Entwickler begannen, mit verschiedenen Methoden für die Gestaltung von Websites zu experimentieren, um die Benutzerfreundlichkeit zu verbessern. Die von Glenn Davis erfundene Methode der flüssigen Layouts beispielsweise führte dazu, dass der Inhalt einer Website prozentual angezeigt wurde. Diese flüssigen Layouts konnten je nach Bildschirmauflösung und -größe angepasst werden.
Mit der Weiterentwicklung der Technologie kamen auch neue Geräte wie Laptops, Tablets und Smartphones auf den Markt. Diese neuen Geräte zeigten oft Websites an, die umständlich zu bedienen waren. Zu kleiner Text, zu große Bilder und die Unmöglichkeit, zu scrollen, waren häufige Probleme.
Die Entwickler versuchten, den neuen Größenanforderungen zu begegnen, indem sie Websites speziell für mobile Geräte erstellten. Diese mobilspezifischen Websites hatten zwar ihre Vorteile, aber viele Entwickler stellten fest, dass die Entwicklung und Verwaltung dieser Websites viel Zeit in Anspruch nahm, da sie eine separate Subdomain erforderten.
Die Antwort fand sich schließlich im responsiven Webdesign, einem Begriff, der 2010 von Ethan Marcotte geprägt wurde.
In seinem Artikel „Responsive Web Design“ aus dem Jahr 2010 stellte Marcotte die Frage: „Können wir uns wirklich weiterhin dazu verpflichten, jeden neuen User Agent mit einer eigenen, maßgeschneiderten Erfahrung zu unterstützen? Ab einem gewissen Punkt fühlt sich das wie ein Nullsummenspiel an. Aber wie können wir – und unsere Designs – uns anpassen?“
Seine Antwort bildet die Grundlage für das heutige Webdesign.
„Wir können für ein optimales Seherlebnis entwerfen, aber standardbasierte Technologien in unsere Designs einbetten, um sie nicht nur flexibler, sondern auch anpassungsfähiger an die Medien zu machen, die sie wiedergeben“, so Marcotte. „Kurz gesagt, wir müssen responsives Webdesign praktizieren.“
Ist Responsive Design wichtig?
Responsive Design ist aus einer Reihe von Gründen wichtig, vor allem wegen der Benutzerfreundlichkeit und der Leistung der Website. Erstens sind Texte und Bilder für Benutzer von Mobiltelefonen oder Tablets leichter zu lesen/anzusehen, da der Bildschirm kleiner ist als der eines normalen Desktop-Computers.
Dies ist besonders wichtig, da das Surfen auf mobilen Geräten immer mehr zunimmt und ein großer Teil des Website-Verkehrs über Social-Media-Links abgewickelt wird. Responsive Design ist auch für Nutzer hilfreich, die ein verkleinertes Desktop-Browserfenster oder eine Split-Screen-Ansicht verwenden.
Außerdem signalisiert es den Suchmaschinen, dass die Seite für jede Betrachtungsweise optimiert ist, was die SEO-Leistung steigert. Zu diesem Zweck kündigte Google 2015 an, dass die mobile Reaktionsfähigkeit einer Webseite zu einem Schlüsselfaktor bei der Bestimmung des Suchmaschinen-Rankings werden würde, wodurch das responsive Design zu einer wichtigen Komponente der wichtigsten Leistungsindikatoren einer Website wurde.
Responsive vs. adaptives Design
Adaptives Design bedeutet, eine unabhängige, leichtere und schlankere, für Mobilgeräte optimierte Version einer Website zu erstellen. Beim mobilen Surfen erkennt man dies daran, dass man auf eine mobile Subdomain umgeleitet wird. Der Begriff wurde 2011 in dem Buch „Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement“ geprägt. Obwohl es viele Jahre lang beliebt war, wird es jetzt zugunsten von responsiven Ansätzen eingestellt.
Adaptives Webdesign hat jedoch einige Vorteile. Mobile Websites können sehr spezifisch darauf zugeschnitten werden, was der Designer den mobilen Nutzern zeigen möchte und wie, und sie können immer noch die bessere Wahl für komplexe Websites sein, die eine Menge Feinsteuerung benötigen. Die Herausforderung besteht in der Entwicklungszeit und den Kosten, die für die Erstellung von zwei (oder mehr) separaten Websites anfallen.
Daher ist das responsive Design für kleine und mittlere Unternehmen und Privatpersonen, die ein einheitliches, nahtloses Erlebnis für ihre Nutzer wünschen, wahrscheinlich die bessere Wahl.
BLOG
Digital Dentistry
Digital Dentistry Die digitale Therapie in der Zahnmedizin umfasst die Verwendung von digitalen Technologien und Methoden im Bereich der Zahnmedizin, um die Diagnose, die Behandlung
Digitale Therapie
Digitale Therapie In den letzten Jahren hat sich die digitale Therapie zu einer wichtigen Option für Menschen entwickelt, die auf der Suche nach alternativen Wegen
Digitale Transformation und der disruptive Accelerator
Digitale Transformation und der disruptive Accelerator Laut dem US-Einzelhandelsindex von IBM hat COVID-19 in den Vereinigten Staaten den Wechsel von physischen Geschäften zu digitalen
BLOG
Digital Dentistry Die digitale Therapie in der Zahnmedizin umfasst die Verwendung von digitalen Technologien und Methoden im Bereich der Zahnmedizin, um die Diagnose, die Behandlung