Frontendtrends 2014

Die Webdesigntrends zählen seit vielen Jahren zu einem fixen Bestandteil des Liechtenecker-Blogs (die Webdesigntrends 2014 könnt ihr hier nachlesen). Ab heuer wollen wir neben den Trends im Designbereich auch über die Neuerungen im Frontendbereich berichten, den Anfang machen wir gleich mit diesem Artikel.

Ein kleiner Rückblick auf 2013

Oft ist es sinnvoll, ein wenig in die Vergangenheit zu sehen, um die Trends des nächsten Jahres besser vorhersagen zu können.

• Neue Browserversionen mit besserer Unterstützung für HTML5/CSS3: Natürlich gab es im letzten Jahr viele neue Browserversionen aller bekannter Hersteller welche die Kompatibilität zu HTML5 & CSS3 weiter verbessert haben. Einen großen Versionssprung hat letztes Jahr der Internet Explorer mit Version 11 gemacht.
• Mitte des Jahres gab Google bekannt, in Zukunft nicht mehr auf WebKit als RenderEngine für Chrome zu setzen: Stattdessen setzt Chrome in Zukunft auf die Eigenentwicklung Blink. Opera, das bis dahin auch auf WebKit basierte, gab ebenfalls die Umstellung auf Blink bekannt. Neben WebKit (Safari), Gecko (Mozilla) und der RenderEngine des Internet Explorers gibt es 2014 also einen weiteren „Global Player“: Blink (Chrome, Opera).
• Gerade in Österreich war das Jahr 2013 aber vor allem durch den Niedergang eines Browsers geprägt: dem Internet Explorer 8. Während der IE8 Anfang 2013 noch auf rund 7.8% Marktanteil kam, halbierte sich der Marktanteil in einem Jahr auf 3.8%. Damit ist auch in Österreich ein wichtiger Meilenstein bei der Adaption von HTML5 & CSS3 geschafft.

Die Trends 2014

Weiterentwicklungen im Frontend stehen natürlich in einer sehr engen Beziehung zu neuen Designtrends. Der erste Trend im neuen Jahr kommt deshalb nicht nur bei den Webdesigntrends, sondern auch hier vor:

Big Video Header

Das Web wird 2014 noch deutlich vielschichtiger und multimedialer als es in den vergangenen Jahren der Fall war. Natives abspielen von Videos in HTML5 gehört zwar schon länger zu den Möglichkeiten, wurde bisher aber eher spärlich eingesetzt. Big Video Header ändern diesen Umstand und stellen gleichzeitig große Herausforderungen an Performance und Bandbreite.

4k

Auf der diesjährigen CES gab es keinen namhaften TV-Hersteller, der nicht den einen oder anderen 4k-Fernseher im Produktportfolio hatte. 4k hält 2014 (zum Glück) durch immer preiswertere Computerdisplays auch am Desktop Einzug und beendet damit einen jahrelangen Stillstand in der Displaytechnologie.
Diese Entwicklung wird sich auch im Web widerspiegeln – Bilder müssen höher aufgelöst werden und Grafiken möglichst als SVG eingebunden werden.

Größenoptimierung und Geschwindigkeitsverbesserungen

Auch wenn unsere Verbindungsgeschwindigkeiten durch Glasfaser und LTE in Zukunft weiter nach oben wandern, bringt die zunehmende Multimedialisierung von Webseiten einige Probleme mit sich. Vor allem auf mobilen Geräten werden Bandbreite fressende Inhalte (z.b. die angesprochenen Video Header oder hochaufgelöste Bilder und Grafiken) oft nur ausgeblendet – schlecht für die Ladezeit und die User Experience. Zwei Trends werden diesem Phänomen 2014 versuchen entgegenzuhalten.

RESS

Was Media Queries Clientseitig machen (also bestimmten Content bei bestimmten Screengrößen auszublenden), wird durch RESS (responsive design with server-side components) in Zukunft sinnvoll erweitert. Wo Videos und andere ungewünschte Inhalte auf Mobildevices früher nur ausgeblendet wurden, werden sie in Zukunft mit RESS gar nicht erst geladen.
Vorraussetzung dafür ist natürlich, dass das CMS solche Möglichkeiten anbietet – und gerade hier wird es 2014 hoffentlich einen deutlichen Push nach vorne geben.

Automatisierung

Dass Javascript, CSS und andere Inhalte spätestens beim ausrollen der Webseite komprimiert werden sollten, weiß mittlerweile jeder. Da dies in Handarbeit vor allem bei nachträglichen Änderungen mühsam werden kann, ist auch der Grund, warum so oft darauf „vergessen“ wird. Kommen zu vielen, unkomprimierten JavaScript Libraries und CSS-Files auch noch unkomprimierte Bilder oder gar Videos hinzu, können auch schnelle Internetverbindungen in die Knie gezwungen werden.
Die Antwort der Frontend-Developer darauf ist simpel: Alles was von Hand mühsam und zeitaufwendig ist, muss automatisiert werden. Christoph ist in seinem Beitrag zu Grunt bereits auf die Vorteile eingegangen. 2014 werden wir sicherlich einen großen Anstieg in der Nutzung derartiger Software sehen.

Webfonts

Gemessen an anderen Technologien tut sich bei Webfonts seit Jahren relativ wenig. Hauptproblem ist hier immer noch das unterschiedliche Schriftrendering in unterschiedlichen Browsern, Betriebssystemen und Versionen. Auch wenn sich hier 2014 von Seiten der Browserhersteller wahrscheinlich nur wenig tun wird, gibt es Grund aufzuatmen: Mit dem Einzug von 4k wird sich auch das Schriftrendering im Web deutlich verbessern.

Zusammenfassung

2014 steht uns ein spannendes Jahr mit den ein oder anderen Überraschungen bevor. Das Web wird sich wie in den vergangenen Jahren rasant weiterentwickeln. Komplexer werdende Seiten haben auch 2014 immer größere Anforderungen an Design und Entwicklung . Auf der technischen Seite sind die höher werdenden Ladezeiten von Webseiten im Auge zu behalten. Durch die zunehmende Optimierung auf hochauflösende Displays und die Anforderung, immer mehr Content auf den Seiten unterzubringen. wird sich dieser Trend mit Sicherheit auch nicht umkehren. Dem kann nur durch cleveres Caching, Optimierung und RESS wirksam entgegengewirkt werden. Neben den technischen Aspekten darf aber auch Usability und User Experience nicht in den Hintergrund treten. Denn auch durchdachte Interaktionskonzepte werden durch die erhöhte Komplexität bei Webseiten zunehmend wichtiger.