Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

Die Basics des Responsive Webdesign

    Die Basics des Responsive Webdesign

Responsive Webdesign. (Grafik: Verge)

Je schneller die Zahl der mobilen Internetnutzer steigt, desto dringender wird die Frage, wie sich Website-Inhalte auf verschiedenen Endgeräten optimal darstellen lassen. Ein möglicher Lösungsansatz ist Responsive Webdesign – die wichtigsten Basics zeigt eine neue Infografik.

Responsive Webdesign: Grundvoraussetzung für die mobile Kommunikation

Nach den Analysten von Morgan Stanley wird die Zahl der mobilen Internetnutzer die der Desktop-Surfer noch vor Ende 2014 endgültig übersteigen. Auch in Deutschland ist der Trend eindeutig: Schon 2013 lag die Zahl der Internetnutzer, die von mobilen Endgeräten aus auf das Netz zugreifen, bei 51 Prozent – im Vergleich zu nur 37 Prozent im Vorjahr. In der Altersgruppe der 16–24-Jährigen stieg der Anteil der mobilen Internetnutzer innerhalb eines Jahres sogar von 59 auf 81 Prozent.

Wer das Internet nutzt, um seine Zielgruppen zu erreichen – und dabei nicht nur auf vorhandene Infrastrukturen wie Facebook setzt – sollte auf diese Entwicklung reagieren. Denn eine Seite, die aufgrund langer Ladezeiten und endlosem Scrolling für mobile Nutzer zur Tortur wird, konvertiert nicht – oder zumindest wesentlich schlechter als das Desktop-Pendant.

Einen Ausweg verspricht seit einiger Zeit das Responsive Webdesign, ein Gestaltungsprinzip, mit dessen Hilfe der Inhalt einer Website sich flexibel an die Gegebenheiten des jeweiligen Bildschirms beziehungsweise Endgerätes anpasst.

Infografik zeigt die Basics des Responsive Webdesign auf einen Blick

Einen Überblick darüber, wie genau Responsive Webdesign funktioniert und warum es sinnvoll ist, den eigenen Webauftritt entsprechend zu überarbeiten, liefert die folgende Infografik. Wer sich die wichtigsten Basics schnell noch einmal vor Augen rufen möchte oder einen Kunden oder Geschäftspartner vom Nutzen der Darstellungsform überzeugen muss, findet hier eine anschauliche Hilfestellung.

Zum Vergrößern der Grafik einfach auf den unten stehenden Ausschnitt klicken.

Ihr wollt selbst eine Website in Responsive Webdesign umsetzen? Dann findet ihr in unserer Artikelreihe Responsive Webdesign hilfreiche Tipps.

Responsive_Webdesign_Basics_Ausschnitt
Die Basics des Responsive Webdesign. (Grafik: Verve)

via blog.hubspot.com

Finde einen Job, den du liebst zum Thema Webdesign

5 Reaktionen
Jan
Jan

Naja, die Frage ist wieviel Traffic von Smartphones durch Websites im Browser generiert wird ... So einige Statistiken geben ja an, dass auf einem Smartphone eigentlich nur gezockt und Facebook gemacht wird. Natürlich wird dabei mal ne Website im Facebook Website Viewer aufgemacht, aber ob das wirklich rockt und der Responsive Website Views bringt?! Ich bin gespannt, wie das Rennen Site VS App schlussendlich enden wird.

Jedenfalls kenne ich schon so einige Menschen, die noch nicht einmal wissen, dass ihr Smartphone einen Browser hat :)

Antworten
Moe
Moe

Und was ist mit Apps, die eigentlich komplett in H5 erstellt werden? Ich denke eher, dass sich da was verschmilzt und klar tippt ein Nutzer lieber auf ein Icon, als eine URL eingeben zu müssen(Das ist ja sooo 200x :p )

Antworten
jan
jan

h5 Apps sind schlussendlich ja auch nur Apps. Wie sieht es da eigentlich aus mit Responsive Apps? Wie läuft das da? Muss jede App nach einen neuem Update angepasst werden? Gibt es da auch Mediaqueries?

... Da sieht man auch schon ein Problem bei Apps: Konsole, Tv, Mikrowelle, Wearables: Da muss noch eine standasierter App-Standard her :)

Isaac
Isaac

Wäre hier auch mal eine feine Sache bei etwa 12" Inhalt auf einem 27" Monitor - natürlich links klebend ;)

Antworten
Kai
Kai

Somit ist rechts mehr Platz für Werbung :)

Antworten

Melde dich mit deinem t3n-Account an oder fülle die unteren Felder aus.

Abbrechen