Bald ist es so weit: Bootstrap 3 wird veröffentlicht. Ein erster Release Candidate von Bootstrap 3 wurde bereits ende Juli veröffentlicht… Und da hat sich einiges getan! Das frontend Framework hat einen stärkeren Fokus auf Mobile Geräte und das entsprechende Responsive Verhalten erhalten.

Ich selbst bin ein ziemlicher Bootstrap Fan und freue mich schon richtig auf das neue Release! Ich hoffe nur, das meine lieblings-Templates schnell nachziehen 😉

Was hat sich getan?

Auf den ersten Blick schaut eigentlich alles aus wie immer – Das CSS bietet die gleichen großartigen Styles und die Komponenten sind auch vollzählig. Dennoch wurde an beinahe allen Schräubchen gedreht um Bootstrap noch besser zu machen! Dieses Release legt dabei den besonderen Fokus auf die mobilen Geräte…

Neue Features für Mobile Geräte

Auch wenn das Gesamtpaket relativ „gleich“ wirkt, gibt es hier und da Änderungen für den Benutzer:
Zuerst sind mir diese neuen Klassen aufgefallen: .visible-sm, .visible-md und .visible-lg (small, medium und large). Diese werden benutzt um Elemente nur bei bestimmten Bildschirmgrößen darzustellen (anstelle von .visible-phone, .visible-tablet und .visible-desktop). Natürlich gibt es auch entsprechende hidden-* Klassen 😉
Bootstrap unterscheidet nicht länger nach Geräte-Typ (Telefon, Tablet und Desktop) sondern nach Auflösungen: Selbst auf einem Desktop-PC kann das Fenster verkleinert werden, daher sind Klassen-Namen wie „phone“ oder „tablet“ irreführend.
Außerdem gibt es zwei neue praktische Klassen für Druck-ansichten: .visible-print und .hidden-print.

Was allerdings noch viel interessanter ist: Es gibt nicht länger ein „einfaches“ Grid-System, sondern eher ein „dreifaches“. Bootstrap liefert euch dazu folgende Klassen:
.col-* für extra kleine Geräte (z.B. „.col-1„, „.col-6„, …), .col-sm-* für kleine Geräte (z.B. „.col-sm-2„, „.col-sm-8„, …) und letztendlich .col-lg-* für große Geräte.
Dadurch können wir bei verschiedenen Fenster- oder Display-größen unsere Webseite immer optimal darstellen! Eine sehr interessante Idee, muss ich sagen! Das Grid-System bringt natürlich auch wieder Features mit, wie z.B. offsets (erneut „dreifach“), verschachtelung und Spalten-sortierung.

Leicht aufgefrischtes Design

Ganz im Trend setzt Bootstrap 3 eher auf „flache“ Buttons und Effekte im Gegensatz zu den plastischen des 2.x Release. Das bedeutet in der Praxis: Sehr viel weniger (wenn nicht gar keine) Farbverläufe – das sorgt für ein „klareres“ Bild und spart massenhaft styles, da keine gradient Effekte (+ Browser Fallbacks) mehr genutzt werden müssen!

Von Haus aus ohne Icons

Bootstrap 3 verabschiedet sich von den bisher mitgelieferten Glyphicon Sprites, stellt aber gleichzeitig ein neues Repository für die Glyphicon Icon-Font vor! Das bedeutet: Wer die Icons verwenden möchte kann sie einbinden – Gleichzeitig ist es nun aber auch problemlos möglich andere Icon-Sets einzubinden! Sehr vorbildlich!

Weniger Javascript (?)

Es scheint außerdem so, als würde Bootstrap 3 nicht länger das „Typeahead“ Skript mitliefern – Dabei handelt es sich um ein einfaches „autocomplete“ Skript. Ich schätze aber das dürfte kein großer Verlust sein – Da draußen gibt es mehr als genug jQuery Plugins für alle belange!
Ansonsten sieht alles vollzählig aus – Beachtet bitte, das es sich hierbei um ein Release Candidate handelt… Die Komponenten könnten sich also noch leicht verändern.

Bleibt nur noch zu sagen: Ich freue mich auf das neue Release und bin auf die finale Version gespannt. Vor allem wäre eine „Bootstrap 2.x zu 3.0 Migration“ interessant – Hier könnte man am einfachsten die Änderungen herausfinden. Es bleibt also spannend!

Mit diesen Worten möchte ich mich für diese Woche verabschieden und hoffe euch auch nächste Woche wieder begrüßen zu dürfen!
Bis dahin wünsche ich euch eine angenehme Woche und natürlich Happy Coding!