Dieser Artikel ist schon über 2 Jahre alt. Unter Umständen kann das, worüber wir geschrieben haben durchaus veraltet sein! 😉
Responsive Webdesign, was ist das überhaupt? Wie der Name schon sagt, ist das Design dieser Webseiten responsive, also reaktionsfähig: Es verändert sich entsprechend der Eigenschaften des Endgerätes, wie beispielsweise der Bildschirmgröße. Statt mehrerer voneinander getrennter Versionen (Desktop, Mobil, App) existiert somit nur noch eine Website. Das Design wird hierbei nicht mehr statisch festgelegt – Anordnung und Darstellung der einzelnen Elemente wie Navigationen, Spalten und Bilder sind variabel. Dies ermöglicht die optimierte Darstellung auf jedem Endgerät und eine geräteunabhängige Kommunikation.
Gerade in der Zeit der mobilen Internetnutzung ist also Responsive Webdesign ein wichtiges Schlüsselwort. Kaum ein Nutzer surft noch ausschließlich mit dem Computer, sondern ist auch mit dem Smartphone, Tablet oder Notebook mobil unterwegs. Und die Produktpalette mobiler Devices wächst von Jahr zu Jahr an.
Seit Ethan Marotte den Begriff 2010 erstmals einführte, befindet sich die Entwicklung in einem Aufwärtstrend. Mit der mobilen Nutzung steigt auch der Bedarf und das Aufkommen an Responsive Webdesign.
Die technische Basis liefern dabei die Webstandards HTML5, CSS3 und JavaScript. Die Darstellungen in verschiedenen Auflösungen werden über eine Technik namens Media Queries (CSS3) gewährleistet. Die Bildschirmgröße wird als Maßeinheit für den betreffenden Code-Teil verwendet. So können CSS-Definitionen für unterschiedliche Endgeräte ohne großen Aufwand aufgerufen werden. Je nach Auflösung kann sich also das Seitenlayout, die Anordnung und Größe der Elemente und Schrift sowie die Navigation ändern. Dabei muss nicht auf Javascript oder Änderungen im HTML-Code zurückgegriffen werden. Um euch das Ganze noch einmal zu veranschaulichen empfehlen wir dieses Video:
Sie sehen gerade einen Platzhalterinhalt von Standard. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf den Button unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.
Ein paar besonders schöne Beispiele für Responsive Design könnt ihr in unserem Blog finden, genau wie hilfreiche Tools zur Umsetzung der eigenen Website.
Social ABC 2014 | W wie Wikis
Jeder kennt sie, jeder benutzt sie: Wikis. Das wahrscheinlich bekannteste Wiki der Welt, die Wikipedia, wird 2.500 Mal pro Sekunde aufgerufen. Aber was ein Wiki genau ist und dass es neben Wikipedia noch unzählige andere gibt, ist nicht jedem direkt……
Social ABC 2014 | L wie LinkedIn
Sich potenziellen Arbeitgebern präsentieren oder selbst auf die Suche nach neuen Mitarbeitern gehen - hierfür ist das Business-Netzwerk LinkedIn mit über 300 Millionen Mitglieder aus mehr als 200 Ländern bestens geeignet. Nutzer haben hier die Möglichkeit,…
Social ABC 2014 | I wie Infographics
Anschaulich, übersichtlich und klar strukturiert: Infographics (deutsch: Infografiken) sind mittlerweile ein sehr beliebtes Content-Format, um Daten und Zusammenhänge visuell aufzubereiten und zu vermitteln. Und wie sollte es anders sein: Bei der Recherche…
Social ABC 2014 | P wie Pinterest
Leckere Rezepte, tolle Outfits und jede Menge Inspiration: Das alles und noch viel mehr gibt es auf Pinterest. Mit 70 Mio. Mitgliedern hat sich die Sharing-Plattform in den letzten vier Jahren einen Namen unter den Social Networks gemacht und liegt auf Platz…