Frontend Frameworks für Webdesigner und Entwickler

Seit geraumer Zeit geistern in Bezug auf Frontend Frameworks vor allem zwei Namen durchs Netz: Bootstrap und Foundation. Doch was sind eigentlich Frontend Frameworks und worum handelt es sich bei den genannten Namen? In diesem Artikel möchte ich euch Frontend Frameworks etwas näher bringen und erklären, wann sie Sinn machen oder eher Unsinn sind.

Was ist ein Frontend Framework?

Frontend Frameworks sind, wie bei Frameworks üblich, eine Sammlung an verschiedenen vordefinierten Funktionen oder in diesem Fall Stilen. Sie sind beliebt bei Entwicklern und Webdesignern, weil sie die Entwicklung von modernen und ansprechenden Webseiten erleichtern. Denn dank der Frameworks sind viele Bereiche, die sonst immer wieder neu für jede Seite angepasst und definiert werden müssten, standardisiert worden.

Dazu gehören typische Grid-Systeme, mit denen man die Struktur der Webseite aufzubauen kann sowie grundlegende Stile für Buttons, Meldungen, Boxen, Tabellen, Dropdown-Navigationen, Breadcrumb-Navigationen, Slider, Off-Canvas-Navigationen, Lightboxen / Content- Overlay-Boxen oder Dialoge sowie Texte, Überschriften und vieles mehr.

Also alles Bereiche, die für fast jede Webseite ohnehin definiert werden müssten. Mithilfe von responsiven Frontend Frameworks lassen sich ebenfalls relativ einfach „Mobile First“ Webseiten aufbauen und strukturieren. Neben den genannten Funktionen und vordefinierten Stilen bietet jedes Frontend Framework noch seine eigenen kleinen Goodies, Möglichkeiten oder Erweiterungen.

Da es also durchaus Unterscheide zwischen den Frameworks gibt, muss jeder Webdesigner genau das Framework finden, das zu seinem Stil, seiner Arbeitsweise und seinem ganz persönlichem Geschmack passt. Ein grundlegendes „dieses ist besser als jenes“ gibt es daher nicht wirklich, dazu aber später mehr.

Warum sind Frontend Frameworks sinnvoll?

Frontend Frameworks sind vor allem bei großen Webseiten, der Arbeit im Team und auch als generelle Vorlage für neue Webseiten jeglicher Größe sinnvoll. Durch die vielen Funktionen der Frameworks wird dem Entwickler oder Frontend-Designer ein großes Stück Arbeit abgenommen, das in der Regel bei jeder Webseite aufs Neue anfällt.

Da sich bei den meisten Frameworks die enthaltenen Komponenten über Download-Konfiguratoren einstellen lassen, kann sich jeder Entwickler genau die Komponenten zusammenstellen, die er für das aktuelle Projekt benötigt, nicht mehr und nicht weniger.

Bei der Arbeit im Team oder Übergabe eines Projekts von einem an einen anderen Entwickler können Frontend Frameworks auch eine hilfreiche Rolle spielen. In der Regel hat jeder Entwickler seinen eigenen Schreibstil und eine eigene Vorliebe für die Benennung von bestimmten Klassen, IDs oder Elementen. Durch ein Frontend Framework werden viele Bereiche standardisiert und vereinheitlicht.

Unterm Strich kann also jeder Nutzer von Twitters Frontend Framework Bootstrap auch relativ schnell den Code einer anderen Webseite überschauen, die ebenfalls auf Bootstrap basiert. Da sich viele Klassennamen und Funktionen in den unterschiedlichen Frameworks auch einfach sehr ähnlich sind, ist dies teilweise auch frameworkübergreifend möglich.

Ein weitere Situation in der entsprechende Frameworks eine große Hilfe sein können, sind z.B. WordPress-Themes oder auch Themes bzw. Vorlagen für jedes andere Content-Management-System. Stellt euch vor, ihr könntet jetzt auf Anhieb ein Theme für WordPress kaufen oder irgendwo herunterladen und, insofern dieses auf Bootstrap oder Foundation basiert, hättet ihr sofort die entsprechenden Klassen im Kopf, mit denen das Theme an eure Bedürfnisse angepasst werden kann, und zwar ohne euch vorher den vielleicht eigenwilligen Code des Entwicklers anschauen zu müssen.

Ein weiterer und in dieser Liste letzter Vorteil, den ich nennen möchte, ist die browser- und betriebssystem- übergreifende Kompatibilität der Frameworks. In der Regel sind alle Funktionen, die aus den Frameworks kommen, Cross-Browser-kompatibel und funktionieren auf allen gängigen Systemen und Browsern.

Es ist also relativ unwahrscheinlich, dass ihr große Fehlerbehebungen durchführen müsst, wenn eure Seite auf einem der Frameworks basiert.

Welche Nachteile hat die Nutzung von Frontend Frameworks?

Die Frage, die mir im Zusammenhang mit Frontend Frameworks am häufigsten gestellt wird, bzw. der Grund, warum Entwickler nicht darauf setzen wollen, ist in der Regel: „Ich nutze keines der Frontend Frameworks, weil die Seiten alle gleich aussehen und man sofort erkennt, dass sie auf irgendeinem Framework basieren“. An dieser Stelle kann ich euch beruhigen, denn dieser Zweifel ist kein Nachteil. Alle gängigen Frameworks lassen sich sehr gut anpassen, und wenn Webseiten der Grundstruktur bzw. dem Basis-Design des Frameworks sehr ähnlich sehen, dann kann dies verschiedene Gründe haben, …

Diesen Artikel erschien exklusiv für das Commag von PSD-Tutorials.de, wenn du ihn gerne bis zum Ende lesen möchtest, kannst du dir das Commag kostenlos und ohne Registrierung auf PSD-Tutorials.de herunterladen. Du findest den Artikel ab Seite 13 ff.

Ich wünsche dir viel Spaß mit dem kompletten Artikel „Frontend Frameworks für Webdesigner und Entwickler“ und den weiteren großartigen Artikeln im Commag.