Responsive Web Design – Contra Frontend Frameworks

Frontend Frameworks haben die Entwicklung von Websites maßgeblich verändert. Doch sie bringen Nachteile mit sich, über die man sich im Klaren sein sollte.

Wie man im Artikel „Pro Frameworks“ lesen kann, haben Frontend Frameworks – allen voran Bootstrap und Foundation – in den letzten Jahren die Entwicklung von Websites maßgeblich verändert. Die Implementierung von funktionierenden Prototyp wird durch sie beschleunigt und viele Probleme rund um das Thema Responsive Design können damit vermieden werden.

Doch Frameworks bringen auch Nachteile mit sich, über die man sich im Klaren sein sollte, bevor man sich für deren Einsatz entscheidet.

Overhead

Jede Komponente, die ich in meine Website einbinde, bedeutet einen gewissen Overhead, sowohl was den reinen Download der Daten als auch den Aufbau im Browser betrifft. Frontend Frameworks liefern eine Vielzahl an CSS-Styles aus, die weit über ein Normalisieren hinausgehen, selbst wenn diese nicht benötigt werden. Ähnlich sieht es mit Skripten und anderen Ressourcen aus. Durch ein gezieltes Auswählen von einzelnen Framework Features lässt sich das zwar manchmal reduzieren, aber vor allem auf mobilen Geräten mit beschränkter Leistung und schlechter Internetverbindung muss man bei jedem Overhead abwägen, ob er wirklich notwendig ist.

Keine klare Trennung von Form und Inhalt

Ein Teil des Overheads ergibt sich durch ein Gridsystem, das bei den meisten Frameworks zum Einsatz kommt. Dieses erlaubt eine Seite nach einem bestimmten Raster auszurichten, was oft durch die Verwendung von spezifischen CSS-Klassen für Reihen und Spalten mit verschiedenen Breiten bewerkstelligt wird. Das ist sehr komfortabel und erzeugt schnell nützliche Ergebnisse, aber verstößt gegen das alte Mantra der Trennung von Form und Funktion. Der HTML-Code wird mit zusätzlichen Elementen und Klassen aufgebläht, die nicht die Funktion des Inhalts beschreiben sondern das Layout bestimmen.

Natürlich ist hier immer ein gewisser Pragmatismus gefragt. Der Einsatz von diversen „Wrapper“-Tags mag semantisch unnötig sein, lässt sich aber manchmal kaum verhindern. Frameworks verzichten fast generell auf Semantik, um einzelne Komponenten möglichst flexibel wiederverwenden zu können. Persönlich bin ich kein Freund von unzähligen CSS-Klassen, wenn alleine durch das verwendete HTML-Tag und dessen Kontext (Elternelemente, Attribute etc.) ein Element selektiert werden könnte.

Styles überschreiben

Frontend Frameworks liefern meistens ein Aussehen der einzelnen Seitenelemente (Navigation, Buttons, Formulare etc.) mit. Nach der Freude darüber, dass man relativ schnell einen funktionierenden Prototypen, der auch noch ganz gut aussieht, erstellt hat, kommt spätestens beim Anpassen des Designs die Ernüchterung für den Programmierer.

Diese tritt ein, da man vorhandene Styles des Frameworks überschreibt, was nicht selten zu Problemen führt bzw. oft weit aufwändiger ist, als Elemente von Grund auf zu stylen. Man sieht sich schnell gezwungen, weit tiefer in den Framework Code selbst einzudringen, als man das eigentlich vorhatte, um zu verstehen, wieso sich einzelne Elemente so verhalten, wie sie es tun. Responsive Design sorgt hier noch für extra Komplexität, weil sich dieses Verhalten natürlich nun auch noch je nach Auflösung ändern kann.

Den Zeitvorsprung, den ein Framework am Anfang gebracht hat, kann man je nach Design an dieser Stelle dann auch wieder verlieren.

Kreative Einschränkung

Den größten Vorteil bieten Frontend Frameworks dann, wenn der Designer bereits mit dessen Elementen vertraut ist. Entsprechend kann er sich den Einschränkungen anpassen und eine rasche Implementierung garantiert werden.

Ich bezweifle jedoch, dass damit die kreativ besten Lösungen entstehen. Meiner Erfahrung nach entstehen aus einem gewissen Spannungsfeld zwischen Designer und Entwickler oft die interessanteren Ergebnisse. Viele Entwickler sehen einen Designvorschlag und lassen sich schnell zu einem „Das geht so nicht!“ hinreißen, weil sie schon im Hinterkopf haben, wie umständlich dieser umzusetzen ist. Ein Frontend Framework bildet hier eine zusätzliche Barriere.

Frameworks

Frontend Framework kann Designer dazu verleiten, immer dieselben Prinzipien zu verfolgen – darunter leidet die Kreativität.

Fazit

Ein Frontend Framework kann ein sehr sinnvolles Werkzeug für die Website Entwicklung sein, aber es ist nicht für jeden Einsatz die beste Wahl. Darüber hinaus gibt es auch Unterschiede von Framework zu Framework und – dadurch abgeleitet – verschiedene Einsatzbereiche. Die genannten Beispiele Bootstrap und Foundation sind vor allem für klassische seitenbasierte Websites gedacht. Für Web-Apps können andere Frameworks sinnvoller sein.

Interessant in diesem Zusammenhang ist vor allem auch die weitere Entwicklung von neuen Technologien wie Web Components. Welche Auswirkungen werden diese auf bestehende Frontend Frameworks haben oder werden diese von komplett neuen wie z. B. Polymer abgelöst werden?

Newsletter abonnieren

    Du willst mit uns moshen, jammen, rocken? Get in touch: Schieb uns deine Challenge in den Briefkasten und wir melden uns mit einer Lösung!

    Pulpmedia verpflichtet sich, Ihre Privatsphäre zu schützen und zu respektieren. Wir verwenden Ihre persönlichen Daten nur zur Verwaltung Ihres Kontos und zur Bereitstellung der von Ihnen angeforderten Produkte und Dienstleistungen.

    Mit dem Absenden des Formulars stimmen Sie der Speicherung und Verarbeitung Ihrer persönlichen Daten durch Pulpmedia zu. Sie können diese Benachrichtigungen jederzeit abbestellen. Weitere Informationen zum Abbestellen, zu unseren Datenschutzverfahren und dazu, wie wir Ihre Privatsphäre schützen und respektieren, finden Sie in unserer Datenschutzrichtlinie.

    Danke für deine Nachricht

    Wir freuen uns und melden uns asap. Bis bald.

      Du willst moshen, jammen, rocken? Bist du Pulpie, oder was? Schieb uns deine Mappe durch den Türschlitz!

      Pulpmedia verpflichtet sich, Ihre Privatsphäre zu schützen und zu respektieren. Wir verwenden Ihre persönlichen Daten nur zur Verwaltung Ihres Kontos und zur Bereitstellung der von Ihnen angeforderten Produkte und Dienstleistungen.

      Mit dem Absenden des Formulars stimmen Sie der Speicherung und Verarbeitung Ihrer persönlichen Daten durch Pulpmedia zu. Sie können diese Benachrichtigungen jederzeit abbestellen. Weitere Informationen zum Abbestellen, zu unseren Datenschutzverfahren und dazu, wie wir Ihre Privatsphäre schützen und respektieren, finden Sie in unserer Datenschutzrichtlinie.

      Danke für deine Bewerbung

      Wir melden uns asap. Vielleicht sogar mit einer Einladung zum Kennenlernen. Frisier dich schon mal. Irokese, wallende Mähne oder Seiten auf null – alles Wurscht. Hauptsache die Chemie stimmt.

        Hallo Brieffreund:in!

        Du möchtest gerne mehr von uns lesen? Melde dich für unseren Newsletter an und schon hast du unser Wort!

        Pulpmedia verpflichtet sich, Ihre Privatsphäre zu schützen und zu respektieren. Wir verwenden Ihre persönlichen Daten nur zur Verwaltung Ihres Kontos und zur Bereitstellung der von Ihnen angeforderten Produkte und Dienstleistungen.

        Mit dem Absenden des Formulars stimmen Sie der Speicherung und Verarbeitung Ihrer persönlichen Daten durch Pulpmedia zu. Sie können diese Benachrichtigungen jederzeit abbestellen. Weitere Informationen zum Abbestellen, zu unseren Datenschutzverfahren und dazu, wie wir Ihre Privatsphäre schützen und respektieren, finden Sie in unserer Datenschutzrichtlinie.

        Danke für deine Anmeldung

        Um die Anmeldung abzuschließen, klicke bitte auf den Link in der E-Mail, die wir soeben an dich gesendet haben.