Bootstrap ist ein CSS-Framework mit einem Raster für Layouts und fertigen Komponenten wie Navigation, Buttons, Formularen und Dialogfenstern. Entwickelt haben es Mark Otto und Jacob Thornton bei Twitter, veröffentlicht wurde es 2011.
- Bootstrap
Ein CSS-Framework, das ein responsives Raster und fertig gestaltete Oberflächenbausteine mitbringt.
Beispiel: „Die erste Version des Kundenportals stand dank Bootstrap in zwei Wochen, gestaltet wurde danach.“Abgrenzung zu Tailwind CSS: Bootstrap liefert fertige Bausteine mit eigener Optik. Tailwind liefert nur Hilfsklassen, aus denen du die Bausteine selbst zusammensetzt.
Wie Bootstrap aufgebaut ist
Im Kern steht ein Raster mit zwölf Spalten. Klassen wie col-md-6 legen fest, dass ein Element ab mittlerer Bildschirmbreite die Hälfte der Zeile einnimmt und darunter die volle Breite; mehr dazu unter Grid-System.
Darauf setzen die Komponenten auf. Für Klappmenüs, Dialoge und Karussells bringt Bootstrap eigenes JavaScript mit, das seit Version 5 ohne jQuery auskommt.
Wofür Bootstrap gut ist
Für alles, was schnell funktionieren und ordentlich aussehen soll, ohne eigene Gestaltung: Verwaltungsoberflächen, interne Werkzeuge, Prototypen. Die Komponenten sind gut dokumentiert, und fast jeder Entwickler hat schon damit gearbeitet.
Über Variablen in Sass lassen sich Farben, Abstände und Schriften anpassen, sodass Bootstrap auch für ein eigenes Erscheinungsbild taugt.
Warum Bootstrap-Seiten sich ähneln
Weil viele Projekte die Voreinstellungen kaum verändern. Um 2015 sahen deshalb viele neue Websites gleich aus, mit demselben Navigationsbalken und denselben Buttons.
Wer eine Marke ins Netz bringen will, muss Bootstrap deshalb gründlich umgestalten oder greift zu einem Werkzeug ohne eigene Optik. Ungenutzte Komponenten lassen sich beim Bauen weglassen, damit die CSS-Datei nicht unnötig groß wird.