Responsives Webdesign

Was ist Responsives Webdesign?

Infografik: 31,4 Prozent des Web-Traffics sind mobil | Statista
Infografik: Über 50% des Web-Traffics in Asien sind mobil | Quelle: http://de.statista.com/infografik/1092/anteil-mobiler-geraete-am-internet-traffic/

Beim Responsiven Webdesign handelt es sich um eine technische und gestalterische Möglichkeit, dass mittels HTML5, CSS3 und JavaScript die Inhalte einer Webseite auf allen möglichen Endgeräten (wie z. B. Smartphones, Tablets, Kindle etc.) benutzerfreundlich und übersichtlich wie möglich angezeigt werden können. Durch die unterschiedlichen Grössen und Auflösungen der verschiedenen Endgeräten kann die Ansicht erheblich variieren.

 

Standard Auflösungen von Smartphones, Tablets und PCs:

  • Smartphones: bis 768px
  • Tablets: 768px bis 992px
  • PC: ab 992px

Zukunft der modernen Webseite

Die Statistiken zeigen wie schnell der Markt der mobilen Internetnutzung steigt. Deswegen ist auch das Umdenken beim Gestalten von Webseiten ein absolutes Muss. Es gibt auch die Möglichkeit der strikten Trennung von Mobil- und Desktop-Version einer Webseite, jedoch entsteht dabei ein erhöhter Pflegeaufwand für die Redakteure und Programmierer. Deswegen sollte der responsive Ansatz im Vordergrund stehen, da er im Endeffekt kosteneffizienter und vielversprechender ist. Responsives Webdesign entwickelt sich durch die geräteübergreifende Flexibilität zunehmend zum Standard bei der Gestaltung moderner Webseiten. 

TYPO3 und CSS Framework Bootstrap - be ready for responsive web design

Variables Spalten-System in TYPO3
Bootstrap Beispiel-Template
Bootstrap Beispiel-Template
Bootstrap Beispiel-Template

Mit unserem eingesetzten Content Management System TYPO3 steht dieser Entwicklung nichts im Wege. In Kombination mit dem modularen Framework Bootstrap und der vollständigen Integration eines Grid-Systems in TYPO3 werden die besten Voraussetzungen geschaffen, um sich auch auf dem mobilen Markt sehen zu lassen. Bootstrap unterstützt dabei nicht nur den responsiven Ansatz, sondern bringt von Haus aus schon viele Elemente zur Gestaltung von Texten, Überschriften, Navigationselementen, Formularen etc. mit. Weitere Informationen finden Sie unter: http://getbootstrap.com/components/. Unsere Webseite wurde auch unter zu Hilfenahme von Bootstrap erstellt und ist somit 100% responsiv. Sehen Sie sich einfach www.typo3demo.dimme.ch auf Ihrem Smartphone und/oder Tablet an und schauen Sie was passiert.