Responsives Webdesign mit Bootstrap

Die Basis-Website ist so programmiert, dass sie auf allen Smartphones, Tablets und PC-Monitoren optimal angesehen und bedient werden kann. Die Inhalte passen sich automatisch an die Display-Größe an.

Um die Basis-Website und damit auch Ihre eigene Website responsiv zu machen, verwenden wir Bootstrap, das verbreitete CSS-Framework.

Die Basis des responsiven Designs mit Bootstrap ist ein 12-spaltiges Raster. Über spezielle CSS-Klassen wird für jedes Modul festgelegt, über wie viele Spalten seine Texte und Bilder laufen sollen. Beispielsweise belegt ein Textelement auf dem PC-Monitor nur 9 Spalten, auf dem Smartphone aber alle 12.

Bootstrap realisiert die unterschiedlichen Gerätegrößen über 6 verschiedene Ansichten, die über Breakpoints gekennzeichnet sind. Wird das Mindestmaß einer Ansicht unterschritten, springt die Ausgabe auf das Layout für die nächstkleinere Ansicht.