Bootstrap vs. Materialdesign auswählen [geschlossen]


180

Ich werde ein neues Projekt mit AngularJS (Full Stack) starten. Mein Projekt muss reaktionsschnell sein und ich werde Vorlagen von Grund auf neu erstellen.

Ich brauche also einen Rat, ob ich Bootstrap 3 (mit eckigen Anweisungen) oder Materialdesign für Layouts wählen soll.

Ich würde mich sehr freuen, wenn jemand die Vor- und Nachteile von beiden auflisten kann.



1
Bootstrap hat eine mächtige Community hinter sich. Das Rastersystem verfügt über weitere Funktionen. Das Materialdesign bestimmt, wie Sie Benutzeroberflächen und Stile entwickeln. Es hat moderne UI-Elemente. Sie können mehr hier lesen tutorialzine.com/2015/07/comparing-bootstrap-with-mdl
Farshid Saberi

2
Wenn Sie IE8 / 9 unterstützen müssen, funktioniert das Materialdesign nicht, da es das Flexbox-Rasterlayout verwendet. Ich würde sogar JETZT mit eckigem UI-Bootstrap gehen, da es viel ausgereifter ist als Materialdesign, das viele Fehler aufweist ...
Pascal

Die Entwicklungsumgebung kann ebenfalls eine Überlegung sein. In Visual Studio 2015 ist Bootstrap ausgereift und wird gut unterstützt. Ich fand das nicht so für Materialien und benutze es derzeit noch nicht. Würde mich interessieren, ob andere, die VS2015 verwenden, diese Schlussfolgerung haben.
CYoung

Ich möchte darauf hinweisen, dass die Inline-Stile von MD ein Schmerz sind. Ich möchte auch nicht die beiden mischen müssen, wenn BS das meiste hat, was ich brauche. Ich mag MD sehr, werde aber warten, bis es reifer wird und die Inline-Stile entfernt werden (die ich irgendwo gelesen habe, an denen sie gearbeitet haben, obwohl ich sie jetzt nicht finden kann).
Steveareeno

Antworten:


153

Soweit ich weiß, können Sie alle genannten Technologien einzeln oder zusammen verwenden. Es liegt an dir. Ich denke, Sie betrachten das Problem aus dem falschen Blickwinkel. Material Design ist genau die Art und Weise, wie bestimmte Elemente der Seite entworfen, verhalten und zusammengesetzt werden. Material Design bietet eine hervorragende Benutzeroberfläche / UX, basiert jedoch eher auf dem grafischen Layout (HTML / CSS) als auf JS (Ereignisse, Interaktionen).

Auf der anderen Seite sind AngularJS und Bootstrap Front-End-Frameworks, die Ihre Entwicklung beschleunigen können, indem sie Ihnen das Schreiben von Tonnen von Code ersparen. Sie können beispielsweise eine Webanwendung mit AngularJS erstellen, jedoch ohne Materialdesign. Oder Sie können eine einfache HTML5-Webseite mit Material Design ohne AngularJS oder Bootstrap erstellen. Schließlich können Sie eine Web-App erstellen, die AngularJS mit Bootstrap und mit Material Design verwendet. Dies ist das beste Szenario. Alle Technologien unterstützen sich gegenseitig.

  1. Bootstrap = responsive Seite
  2. AngularJS = MVC
  3. Material Design = großartige UI / UX

Sie können fantastische Materialdesignkomponenten für AngularJS überprüfen :

https://material.angularjs.org


Geben Sie hier die Bildbeschreibung ein

Demo: https://material.angularjs.org/latest/demo/ Geben Sie hier die Bildbeschreibung ein


4
Dies könnte auch eine nützliche Site sein: materialup.com/resources , die einen Überblick über Material Design Frameworks gibt, inkl. fezvrasta.github.io/bootstrap-material-design
Mathias Conradt

3
@MathiasConradt erste URL existiert nicht mehr. Ich denke du
meintest

11
Das ist keine sehr genaue Beschreibung ... Sowohl Material als auch Bootstrap bieten ein ansprechendes Design und eine großartige Benutzeroberfläche / UX. MD scheint eher auf mobile Zuschauer zugeschnitten zu sein.
Vladimir

2
Es ist wichtig, das Materialdesign vom eckigen Material zu unterscheiden . Materialdesign ist eine Designsprache , eckiges Material ist nur eine UI-Komponentenbibliothek, die MD verwendet. Ich bin sicher, Sie können Bootstrap-Themen und -Erweiterungen finden, die Materialdesign verwenden.
Jens

1
Ich möchte @Jens oben wiederholen. Ich möchte das Aussehen und die UI-Effekte von Material haben und gleichzeitig die Flexibilität und Vertrautheit von Bootstrap zur Verfügung haben. Ich denke, es ist eine Frage der Wahl.
Yousof K.
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.