Warum Bootstrap so beliebt ist!

Bootstrap ist ein Frontend-Framework, mit dem Webentwickler verschiedene geräteübergreifende Webseiten erstellen können. Dazu stellt das Open-Source-Projekt verschiedene HTML- und CSS-basierte Designvorlagen sowie optionale JavaScript-Erweiterungen bereit. Twitter plante zunächst, Bootstrap als internes Tool für Unified Design zu verwenden, veröffentlichte das Framework jedoch im August 2011 auf der Open-Source-Hosting-Plattform GitHub und wurde schnell zu einem der beliebtesten Projekte mit zehntausenden von Forks (Weiterentwicklungen).

Das macht Bootstrap so einfach!

Dank HTML- und CSS-Vorlagen muss eine gute Idee für eine neue Webseite nicht von Grund auf neu entwickelt werden. Ihr könnt Out-of-the-Box-Inhalte wie ein Baukasten verwenden und in eure HTML-Dokumente integrieren. Dadurch entfällt viel ansonsten sehr mühsame CSS-Konfiguration, was euch viel Arbeit erspart.

Hierdurch sind unter anderem folgende Elemente möglich:

Codebeispiel für Buttons mit Bootstrap:

Ausgabe:

Eine weitere wichtige Komponente ist das Bootstrap-Grid-Layout, welches es vereinfacht, den Abstand und die Platzierung der einzelnen Webseiten-Elemente zu bestimmen. Dazu wird das Layout in 12 Spalten aufgeteilt. Beim Anordnen von Elementen in einem Layoutraster könnt ihr zwischen verschiedenen Bildschirmgrößen unterscheiden – egal ob Desktop-PC, Handy, Tablet oder Kleinbild-PC. Mit Bootstrap seid ihr bestens auf responsives Webdesign vorbereitet.

<div class="container">
    <div class="row">
        <div class="col-md"> One of six columns</div>
        <div class="col-md"> One of six columns</div>
        <div class="col-md"> One of six columns</div>
    </div>
    <div class="row">
        <div class="col-md"> One of six columns</div>
        <div class="col-md"> One of six columns</div>
        <div class="col-md"> One of six columns</div>
    </div>
</div>

Ausgabe:

​

Mit optionalen JavaScript-Plug-ins, die auf dem JavaScript-Framework jQuery basieren, lässt sich die Palette an Elementen noch um ein vielfaches erweitern.

Diese Faktoren, zusammen mit der Tatsache, dass es sich um ein Open-Source-Projekt handelt, machen Bootstrap zu einem der beliebtesten Webdesign-Frameworks, und das verdient es auch.

Photo by Kevin Ku on Unsplash