Skizze für Frameworks
istockphoto.com: ©CarmenMurillo

Jeder Webentwickler kennt das Problem: Es gibt etliche Webbrowser am Markt und diese werden von den Anwendern häufig nicht aktualisiert. Dies hat zur Folge, dass für veraltete Webbrowser Rückfalllösungen vorgesehen werden müssen, die die Umsetzung von Responsive Webdesigns immer komplexer machen. Abhilfe schaffen Frameworks, die ein bereits vorgefertigtes Grundgerüst zur Erstellung reaktionsfähiger Webseiten liefern. Der Programmieraufwand wird durch bereits implementierte Grundfunktionalitäten und zum Teil integrierter Rückfalllösungen für ältere Webbrowser reduziert. Es gibt eine Vielzahl von Frameworks für unterschiedliche Anforderungen. Die drei bekanntesten Frameworks für reaktionsfähige Internetseiten sind zur Zeit YAML, Foundation und Bootstrap.

YAML

YAML steht für Yet Another Multicolumn Layout und ist ein flexibles, modular aufgebautes CSS-Framework, welches der Webentwickler Dirk Jesse entwickelt hat. Aktuell liegt es in der vierten Version vor und bietet verschiedene Grundgerüste für Layouts und ein Grid Modul. Darüber hinaus liefert es weitere Module für Navigationen und Formulare gleich mit. YAML lässt sich mit geringem Aufwand in verschiedene bekannte Content-Management- und Blog-Systeme integrieren.

Foundation

Das responsive Frontend-Framework Foundation wurde von der Agentur Zurb entwickelt. Seit der aktuellen Version 4 basiert Foundation komplett auf dem Mobile First Ansatz. Hier ist zu beachten, dass ältere Webbrowser, wie beispielsweise alle Internet Explorer vor der Version 9, von diesem Framework nicht mehr unterstützt werden. Die von Foundation gelieferten Funktionalitäten sind umfassender als bei YAML. Neben einem flexiblen 12-spaltigem Grid-System, einem Navigations- und Formular-Modul, werden ein Typografie-Modul und vordefinierte CSS-Komponenten wie zum Beispiel Buttons und Tabellen mitgeliefert. JavaScript ist auch integriert und stellt viele oft verwendete Funktionalitäten, wie Grafikslider, zur Verfügung. Foundation enthält viele verschiedene Layoutgerüste, die ohne viel Aufwand übernommen werden können und ist somit ideal zur Entwicklung von Prototypen nach dem Mobile First Ansatz. Die Komplexität bei der Integration in Content-Management-Systeme ist vom eingesetzten System abhängig.

Bootstrap

Noch umfassender als Foundation ist das responsive Framework der Firma Twitter. Dieses basiert auf einem beliebig skalierbaren flexiblen Grid-System und liefert vielfältige Grundgerüste für verschiedene Layouts. Unterschiedliche Module für Navigationen und JavaScript-Funktionen sind in das Framework integriert. Viele vordefinierte CSS-Komponenten für Tabellen, Buttons und Formulare sind, ebenso wie auch Funktionen zu Interaktion mit dem Anwender, enthalten. Zusätzlich gibt es Oberflächenelemente wie Dialogfenster, Tooltipps oder Grafikslider. Die Integration in Content-Management-Systeme ist, wie auch schon bei Foundation, nicht immer einfach und abhängig vom jeweils gewählten System. Bootstrap kann sehr individuell und modular zusammengestellt werden, so ist es möglich bei der Konfiguration viele Eigenschaften des Frameworks zu beeinflussen und nur benötigte Module zu integrieren. Sollten Module zu einem späteren Zeitpunkt doch benötigt werden, lassen sich diese problemlos wieder einbinden.

Frameworks empfehlenswert aber mit Einschränkungen bei Abweichungen vom Standard

Frameworks bieten insbesondere beim Prototyping Vorteile, da sie sehr schnell erste Ergebnisse liefern. Ein großer Nachteil besteht allerdings dann, wenn von Standardanforderungen abgewichen werden soll und individuelle Anforderungen oder Wünsche vorliegen. Sofern Funktionalitäten anderweitig als vom Framework vorgesehen gelöst werden sollen, kann der Aufwand zur Anpassung des Frameworks sehr hoch ausfallen. Aus diesem Grund sollte ein Framework immer anhand konkreter und eventuell zukünftiger Anforderungen gewählt werden. Eine Eigenentwicklung, wie wir sie bei unseren Kundenprojekten einsetzen, kann oftmals die einfachere und flexiblere Lösung für ein Responsive Webdesign sein.