Rückblick: Die Geschichte des Webdesigns

Geschrieben von M4W Kreativ*
Veröffentlicht am 29. Dezember 2014
Zurück zu Web 2.0

Hatte früher Webdesign noch eher etwas mit Kunst zu tun, so spricht man heutzutage bei Webdesign eher von Disziplin. Und diese kann mittlerweile auf eine bewegte Geschichte zurückblicken. Unser Jahresrückblick 2014 wird ein 29-Jahre-Rückblick auf die Historie des Webdesigns von 1985 bis heute.

Die Geschichte des Webdesigns 1985 – 2014

1985: Grafische User Interfaces als Vorläufer

Die Anfänge des Webdesigns erinnern vor allem an schwarze Bildschirme, auf denen nur wenige Pixel lebten. Zwar gab es von Anfang an Ideen und Methoden zur grafischen Darstellung, das Design war aber nur eine Frage von Symbolen und Textabständen, mit Hilfe derer man erste GUIs entwickelte.

1995: Tabellen als die wahren Anfänger

Als die ersten Browser aufkamen, ging es mit dem Webdesign erst richtig los: plötzlich gab es die Möglichkeit, Bilder und Tabellen darzustellen. Der Trick damals: Informationen über HTML-Tabellen zu strukturieren und anzuordnen. Auch wenn hinter der Idee mit Tabellen eher die Strukturierung von Zahlen stand, war es doch für eine ziemlich lange Zeit eine übliche Methode, um im Netz zu designen. Das Design und der Code waren zu dieser Zeit alles andere als voneinander getrennt und ein Transfer davon war ein aufwändiger und schwieriger Prozess (Entwickler sprachen damals von den „Tücken des Frontends“).

1996: Die 90er mit JavaScript

Mit JS entstand eine Möglichkeit, die Defizite von HTML auszugleichen – mit Funktionen wie Pop-up-Fenster oder unterschiedliche Reihenfolgen für einzelne Design-Elemente. Dabei legt sich JavaScript wie eine eigene Schicht über die Infrastruktur einer Seite und muss separat geladen werden. Das macht es zwar mächtig, aber auch schwerfällig. Heutzutage wird eher CSS genutzt, auch wenn JS in Form von jQuery und Node.js sowohl für das Front- als auch für das Backend weiterhin wichtig bleibt.

1997: Flash, Ah, ah, …

Das goldene Zeitalter der Freiheit wurde mit Flash eingeleitet. Egal ob Layout, Formen, beliebige Schriftarten oder Interaktionen und Animationen – all dies gewährte die Technologie Flash. Das fertige Design wird einfach verpackt und an den Browser gesendet. War zwar einfach, funktionierte aber nur, wenn der Nutzer des Browsers das aktuelle Flash-Plugin installiert hat. Intro-Animationen und viele unnütze interaktive Effekte warteten damals auf die Besucher. Letztendlich verbrauchte Flash aber zu viele Ressourcen und war nicht SEO-freundlich genug, um sich dauerhaft durchzusetzen. Der Todesstoß für Flash im Webdesign kam 2007, als Apple sich für sein erstes iPhone gegen die Technologie entschied.

1998: Cascading Style Sheets

Kurz danach betraten CSS die Weltbühne des Webdesigns. Endlich war eine technisch saubere Trennung von Content und Design möglich: Die eigentlichen Inhalte verblieben im HTML, während die Darstellung gesondert im CSS deklariert wurde. Zwar gab es anfängliche Problem mit der Inkompatibilität vieler Browser, die die Gestaltungssprache nicht verstanden oder nur zum Teil unterstützten. Leider ist seitdem auch der Mehraufwand für Entwickler gestiegen, da das Projekt in jedem Browser unterschiedlich aussehen sowie zu unterschiedlichen Problemen führen kann. Bis heute sind zumindest die Kinderkrankheiten behoben.

2007: Grids und Frameworks

Das Aufkommen und der Aufstieg von Mobiltelefonen und anderer mobiler Endgeräte läutete eine neue Ära ein. Eine, die erneut eigene Herausforderungen mit sich brachte: Benötigt man jetzt weniger Inhalte oder nur neue Darstellungsformate? Welche Layouts funktionieren auf welchem Screen? Und was passiert mit der Werbung auf den winzigen Bildschirmen? Vor allem zu jener Anfangszeiten des mobilen Internets waren noch lange Ladezeiten und die damit verbundenen Kosten ein Problem für die Nutzer. Der erste Schritt zur Lösung dieser Probleme war ein fester Gestaltungsraster – vor allem das 960-Grid-System und seine zwölf-spaltige Aufteilung setzte sich durch. Danach wurden häufig genutzte Design-Elemente (zB Buttons, Navigation) standardisiert und zu „visuellen Bibliotheken“ verdichtet. Besonders Bootsrap und Foundation machten unter diesen Frameworks das Rennen. Die Grenzen zwischen Apps und Websites begannen zu verschwinden und die Frameworks erlaubten, den Mobile-First-Ansatz auf alle Webprojekte anzuwenden. Auf Grund dessen ähneln sich jetzt viele Designs und gute Designer sollten auch programmieren (eigentlich deklarieren) können.

2010: Responsive Webdesign

Mit der Idee, denselben Content mit unterschiedlichen Layouts zu nutzen, brachte frischen Wind in die Webentwicklung. Der einschlägiger Name und ein sauberes Konzept verhalfen diesem, sich innerhalb kurzer Zeit weit zu verbreiten und letztendlich auch durchzusetzen. Responsive Design bedeutet momentan noch für jeden etwas anderes. Für den Auftraggeber: dass die Website auch auf dem Smartphone funktioniert. Für den Designer: viele verschiedene Mockups zu erstellen. Für den Entwickler: neue Herausforderungen und Unterschiede bei Bildern, Download-Zeiten und einiges mehr. Der Vorteil: die Gleichwertigkeit des Contents – also die Tatsache, dass ein und dieselbe Website überall funktioniert.

2012: Flat Design – Back to the Roots

Je mehr Layouts man entwirft, um so eher muss man sich auf das Wesentliche konzentrieren: Also den Fokus mehr auf die Inhalte als auf tolle Animationen und Effekte legen. Das bedeutet hochwertige Fotos, durchdachte Typografie, klare Illustrationen und schlaue Layouts. Maßgeblich an dieser Entwicklung beteiligt ist das Flat Design – also das Reduzieren von visuellen Elementen auf ihre wesentliche Funktionen. Also besser Icons (skalierbare Vektorgrafiken oder Icon-Fonts) statt glänzende Buttons oder Web-Fonts für schöne Typografie verwenden. Die Besinnung auf ein simples, funktionales Design erinnert an die frühen Zeiten des Webdesigns, als technisch noch nicht viel möglich war – jetzt dafür aber schöner.

2014: Zur Zukunft des Webdesigns

Viel hat sich verändert für Webdesigner: Zwar ist noch immer nicht alles möglich und viel hängt von der kreativen Umsetzung der Ideen in die richtigen Zeilen Code ab, aber schöne und inspirierende Designs verbreiten sich rasend. Schon jetzt ist es möglich, Elemente auf dem Bildschirm neu anzuordnen. Leider kommt dabei noch kein neuer, sauberer Code heraus und auch um die Browser-Kompatibilitäten muss sich der Entwickler noch selbst kümmern. Aber in Zukunft sollte es möglich sein, sich auf das Lösen von Problemen zu konzentrieren. Ansätze wie etwa Flexbox (Layouts in CSS einfacher und flexibler gestalten) oder neue CSS-Elemente (zB vh viewport height oder vw viewport width), machen es einfacher, Elemente auf einer Seite zu positionieren. Oder auch das Web-Components-Konzept, bei denen einzelne Website-Elemente (zB Bildergalerien, Formulare) als einfach einzubindende bzw. zu pflegende Bündel zusammengefasst werden, so dass nicht mehr mit unzähligen verschiedenen Plugins gearbeitet werden muss.

Für 2015 ist eines fix: In der Webentwicklung bleibt es weiterhin spannend.
Auf diesem Weg alles Gute, viel Erfolg und weiter vorne bleiben für 2015!!

 

Quelle: t3n.de

0 Kommentare