Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Entwicklung & Design

Bootstrap für Designer: Bootsnipp liefert Design-Bausteine

(Foto: ZERGE_VIOLATOR / flickr.com, Lizenz: CC-BY)

„Lass uns noch schnell ein Drei-Level-Dropdown einbauen!“ Sätze wie diesen haben viele von uns schon mal gehört – gerade beim Prototyping. Bootsnipp könnte dieses Problem lösen, denn dort findet ihr schnell einzelne Design-Bausteine für eure Bootstrap-Projekte oder eure Prototypen.

Bootsnipp könnt ihr euch als Baukasten für Bootstrap vorstellen, der euch eine Auswahl an unzähligen einzelnen „Modulen“ anbietet, die alle auf Bootstrap basieren. Das bedeutet, dass ihr diese einzelnen „Module“ relativ einfach in eure Website einbauen könnt – ohne zu viel schlechten Code zu übernehmen.

Die einzelnen Snippets haben teilweise sogar unterschiedliche Themes, aus denen ihr auswählen könnt. Somit ist es möglich, selbst mit rudimentären HTML-Kenntnissen eine Website mit Bootstrap zu gestalten.

bootstrap-bootsnip
Bootsnipp lässt euch schnell ein Bootstrap-Projekt bauen. (Screenshot: t3n)

Bootsnipp ist nicht unbedingt „overstyled“

Für Entwickler ist es störend, wenn Code-Strukturen schon über ein CSS-Styling verfügen, denn das macht es schwer, den spezifizierten Code-Block wieder generisch zu machen, damit er wiederverwendet werden kann. Das Problem fällt hier weg, denn durch die gemeinsame Bootstrap-Codebasis kann der CSS-Code des Themes vollständig gelöscht werden, ohne die Funktionalität zu verlieren, denn sie wird vom Bootstrap-Framework sichergestellt.

Bootsnipp präsentiert sich dabei sehr übersichtlich und stellt die einzelnen Snippets in einer Galerie dar. Die einzelnen „Module“ können dann live getestet werden, was sehr praktisch ist. Genauso ist es möglich, sich den Code im vorhinein anzusehen, ohne das „Modul“ zuerst runterladen und dann einbauen zu müssen.

Fazit: Bootsnipp für Bootstrap

Entwicklung auskennt, ist mit Emmet trotzdem noch schneller, hat dabei aber natürlich kein fertiges CSS-Styling. Allerdings ist nicht davon auszugehen, dass sich die rudimentären Bootsnipp-Themes in ein bestehendes Layout beziehungsweise Design ad hoc einbauen lassen.

Finde einen Job, den du liebst

Bitte beachte unsere Community-Richtlinien

7 Reaktionen
Gregory

Stimme Oliver bezüglich Emmet zu.

Emmet sehe ich Editor-Plugin, welches mir erlaubt schneller und effizienter Code zu schreiben.

Bootsnipp hingegen ist für mich ein Schaukasten von vordefinierten UI-Komponenten oder Beispielen für die Verwendung von Twitter Bootstrap.

Antworten
Mario Janschitz

Ich vergleiche nicht sondern treffe eine Aussage. Von daher weiß ich nicht was ihr mir sagen wollt :)

Antworten
Oliver H.

Bin schon ewig begeisterter Bootsnipp-User. Natürlich macht es nicht immer Sinn, die Snippets 1:1 zu übernehmen. Aber schon der Blick auf den verwendeten Code erleichtert die eigene Programmierung.

Der Vergleich mit Emmet hinkt aber etwas. Das ist, als ob man Photoshop mit einer Tastatur vergleicht. Macht zusammen beides Sinn, ist aber grundverschieden. ;)

Antworten
Mario Janschitz

Nein ist es nicht. Mit Emmet kann ich die Struktur genauso schnell (wenn nicht schneller) schreiben, als Code von einer Website zu laden. Bei Emmet muss man natürlich wissen, was man macht. Oder übersehe ich etwas?

lg

Antworten
Oliver H.

Doch, ist es wohl. :) Bei Emmet muss ich mir aber über die Strukturen erst Gedanken machen, Bootsnipp bietet mir diese an.

Bootstrap verhält sich zu Foto wie Emmet zu Fotografieren.

Mario Janschitz

Aus dem Text: „Wer sich mit Bootstrap und Entwicklung auskennt, ist mit Emmet trotzdem noch schneller...“

Melde dich mit deinem t3n-Account an oder fülle die unteren Felder aus.

Abbrechen