Bootstrap: Das sollten Sie über das beliebte Framework mit HTML, CSS und JS für die Entwicklung von Web-Projekten wissen

Responsives Webdesign mit Bootstrap

Ein großes Plus von Bootstrap ist die Möglichkeit, eine Website responsiv zu gestalten. Je nachdem ob das Endgerät ein Smartphone, ein Tablet oder ein PC ist, ändert sich die Darstellung. Bootstrap verfolgt dabei den Mobile-First-Ansatz, bei dem die Darstellung auf ein Mobil-Endgerät optimiert ist.

Navigationselemente wie Navigationslisten oder -leisten werden in einer Klasse zusammengefasst. Die Navigationselemente werden je nach Bildschirmgröße anders angezeigt.

Häufig gibt es auf Mobilgeräten einen Menübutton. Durch einen Klick auf diesen werden alle Navigationselemente in einem Dropdown-Menü sichtbar. Ist der Bildschirm größer, so sind alle Elemente nebeneinander sichtbar.

Durch die Einbindung von Bootstrap reagiert der Text ebenfalls dynamisch auf die Größe des Bildschirms, wodurch die Zeilen kürzer oder länger werden. Auch Bilder können durch die Zuweisung von Bootstrap-Klassen responsiv gestaltet werden und ihre Größe dynamisch verändern.

Das JavaScript-Plugin von Bootstrap basiert auf der JavaScript-Bibliothek jQuery und bietet Funktionen wie Dialogfenster, Tooltips und Karussells an. Häufig wird zusätzlich zu Bootstrap noch jQuery eingebunden.

jQuery ist die JavaScript-Bibliothek schlechthin. Durch eine geschickte Kombination von beiden Frameworks lässt sich mit wenig Aufwand eine tolle, moderne Website errichten.