© Excellent backgrounds/Shutterstock.com
Java Magazin
Abstraktionen in HTML

Polymorphes Web-UI mit Web Components

Twitter Bootstrap, Zurb Foundation, Material Design, Metro UI oder doch noch das alt bekannte Cupertino? In den letzten Jahren haben sich unterschiedliche Designtrends und damit auch HTML-/CSS-Frameworks etabliert. Die Entscheidung muss früh im Projekt getroffen werden, und es wird sich mit an Sicherheit grenzender Wahrscheinlichkeit herausstellen, dass es die falsche war. Wie kann das Paradigma des „Last Reasonable Moment“ auch bei der Auswahl eines UI-Frameworks angewandt werden? Mit Web Components ist eine Entkopplung von Datenpräsentation und Designstruktur realisierbar, die deutlich über die Möglichkeiten von Style Sheets hinausweist.

Dirk Dorsch


Moderne Webapplikationen unterliegen einer immer kürzeren Halbwertszeit, da sich in immer kürzeren Zeiträumen neue UI-Trends etablieren. Nicht zuletzt der Ähnlichkeit im Design vieler Websites sieht man die Marktstellung von Zurb Foundation und Twitter Bootstrap an. Mit der Einführung der neuen Designsprache „Material Design“ durch Google entwickelt sich ein neuer Trend im UI. Was passiert nun mit den auf Basis der responsiven Webdesignplatzhirsche Twitter Bootstrap oder Zurb Foundation entwickelten Applikationen? Was tun mit der in Material Design entwickelten Applikation, wenn in zwei Jahren Apple ein CSS-/JavaScript-Framework auf dem Markt etabliert?

Obwohl in der finalen Umsetzung unterschiedlich, bieten die meisten responsiven Webframeworks ähnliche Konzepte. Alle unterstützen den Entwickler bei der Erstellung von Layouts und setzten für die einzelnen HTML-Elemente ein konsistentes Design und Layout um. Theming-Mechanismen ermöglichen darüber hinaus die Anpassung an die eigenen Designvorstellungen. Auch für anspruchsvolle Effekte wie Pagetransitions, Bilderslideshows oder modale Dialoge sowie Interaktionsgesten wie Drag and Drop haben sich etliche Implementierungen ihren Platz geschaffen. Die Fülle an verfügbaren Frameworks und Bibliotheken macht die Wahl zur Qual. Kaum hat man sich für eines entschieden und die Applikation fast fertig implementiert, erklimmt ein neues Framework den „Hipster-Technologie-Thron“. Wer hip bleiben will, möchte mit dem Projekt also am liebsten nochmal von vorne beginnen.

Mithilfe eines UI-Frameworks ist ein schneller Start des Projekts möglich. Während in der UI-Entwicklung der für die Präsentation der eigenen Geschäftslogik zuständige Code ohnehin meist untrennbar mit dem Look-and-Feel-Code verwoben ist, kommt so noch eine Abhängigkeit zum ausgewählten Framework hinzu. Die Struktur der Applikation ist Frontend-seitig vollständig durch die Vorgaben des UI-Frameworks hinsichtlich der Layout- und Designaspekte vorgegeben. Trotz der Analogien der Konzepte erzwingen alle Frameworks eine gänzlich unterschiedliche Strukturierung des Mark-up. Soll ein neuer UI-Trend durch Einsatz eines neuen Frameworks berücksichtigt werden, muss die Präsentationsschicht in weiten Teilen neu implementiert werden.

Die Idee

Geht man nun von einer größeren Webapplikation aus, wird diese aus einer nicht geringen Menge von Seiten bestehen, um die sich aus der Geschäftslogik ergebenden Daten zu präsentieren. Die Präsentation soll auf allen Seiten konsi...

Java Magazin
Abstraktionen in HTML

Polymorphes Web-UI mit Web Components

Twitter Bootstrap, Zurb Foundation, Material Design, Metro UI oder doch noch das alt bekannte Cupertino? In den letzten Jahren haben sich unterschiedliche Designtrends und damit auch HTML-/CSS-Frameworks etabliert. Die Entscheidung muss früh im Projekt getroffen werden, und es wird sich mit an Sicherheit grenzender Wahrscheinlichkeit herausstellen, dass es die falsche war. Wie kann das Paradigma des „Last Reasonable Moment“ auch bei der Auswahl eines UI-Frameworks angewandt werden? Mit Web Components ist eine Entkopplung von Datenpräsentation und Designstruktur realisierbar, die deutlich über die Möglichkeiten von Style Sheets hinausweist.

Dirk Dorsch


Moderne Webapplikationen unterliegen einer immer kürzeren Halbwertszeit, da sich in immer kürzeren Zeiträumen neue UI-Trends etablieren. Nicht zuletzt der Ähnlichkeit im Design vieler Websites sieht man die Marktstellung von Zurb Foundation und Twitter Bootstrap an. Mit der Einführung der neuen Designsprache „Material Design“ durch Google entwickelt sich ein neuer Trend im UI. Was passiert nun mit den auf Basis der responsiven Webdesignplatzhirsche Twitter Bootstrap oder Zurb Foundation entwickelten Applikationen? Was tun mit der in Material Design entwickelten Applikation, wenn in zwei Jahren Apple ein CSS-/JavaScript-Framework auf dem Markt etabliert?

Obwohl in der finalen Umsetzung unterschiedlich, bieten die meisten responsiven Webframeworks ähnliche Konzepte. Alle unterstützen den Entwickler bei der Erstellung von Layouts und setzten für die einzelnen HTML-Elemente ein konsistentes Design und Layout um. Theming-Mechanismen ermöglichen darüber hinaus die Anpassung an die eigenen Designvorstellungen. Auch für anspruchsvolle Effekte wie Pagetransitions, Bilderslideshows oder modale Dialoge sowie Interaktionsgesten wie Drag and Drop haben sich etliche Implementierungen ihren Platz geschaffen. Die Fülle an verfügbaren Frameworks und Bibliotheken macht die Wahl zur Qual. Kaum hat man sich für eines entschieden und die Applikation fast fertig implementiert, erklimmt ein neues Framework den „Hipster-Technologie-Thron“. Wer hip bleiben will, möchte mit dem Projekt also am liebsten nochmal von vorne beginnen.

Mithilfe eines UI-Frameworks ist ein schneller Start des Projekts möglich. Während in der UI-Entwicklung der für die Präsentation der eigenen Geschäftslogik zuständige Code ohnehin meist untrennbar mit dem Look-and-Feel-Code verwoben ist, kommt so noch eine Abhängigkeit zum ausgewählten Framework hinzu. Die Struktur der Applikation ist Frontend-seitig vollständig durch die Vorgaben des UI-Frameworks hinsichtlich der Layout- und Designaspekte vorgegeben. Trotz der Analogien der Konzepte erzwingen alle Frameworks eine gänzlich unterschiedliche Strukturierung des Mark-up. Soll ein neuer UI-Trend durch Einsatz eines neuen Frameworks berücksichtigt werden, muss die Präsentationsschicht in weiten Teilen neu implementiert werden.

Die Idee

Geht man nun von einer größeren Webapplikation aus, wird diese aus einer nicht geringen Menge von Seiten bestehen, um die sich aus der Geschäftslogik ergebenden Daten zu präsentieren. Die Präsentation soll auf allen Seiten konsi...

Neugierig geworden?


    
Loading...

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang