Das Web im Wandel der Zeit

2005 interessierten mich Fenster nur insoweit, dass man diese auf- und zumachen und durchgucken kann. Allerdings ist mir die Schüco-Fernsehwerbung mit den Kindern die erklären, wie einfach man Energie mit den richtigen Fenstern sparen kann irgendwie immer im Kopf geblieben. Jetzt – 10 Jahre später – habe ich mich tatsächlich auch selbst einmal mit Fenstern beschäftigt und bin auf der Website von Schüco gelandet. Da kam mir die Idee mal zu schauen, wie sich die Website eigentlich im Laufe der Jahre verändert und weiterentwickelt hat. Mach ich ja eh regelmäßig um immer aktuelle Screenshots unterschiedlichster Seiten mit den Screenshots aus den vorangegangenen Jahren zu vergleichen. Da ich leider nicht genug Screenshots von schueco.de hatte, hab ich mir also die Internet Archive WaybackMachine vorgenommen und bin durch die Zeit gebrowst.

Um die Evolution der Schüco Website (und natürlich auch aller anderen Seiten im www) zu verstehen, wollen wir uns aber zuerst einmal anschauen, wie sich das Web denn eigentlich im Laufe der Zeit entwickelt und verändert hat.

Wie fing eigentlich alles an? Die 90er.

Die erste Website wurde 1991 von Tim Berners-Lee veröffentlicht. Webseiten waren Anfang der 90er textbasiert, einspaltig und mit HTML programmiert. Ihre Funktion war es, Informationen zu übermitteln – Design spielte keine Rolle. Sie wurden für kleine Auflösungen und langsame Internetverbindungen entwickelt und gestaltet und sahen eher aus wie Textdokumente mit dazwischen geschobenen Links. Über dynamische Webelemente dachte man zu dieser Zeit noch nicht nach.

Mitte der 90er fing man dann an tabellenbasierte Seiten zu entwickeln. So wurde es einfacher Inhalte zu organisieren und die Navigation darzustellen. Zu dieser Zeit setzte sich dann auch die auf der linken Seite positionierte Navigation durch.
Ich selbst habe meine erste Website 1998 per Hand programmiert, inklusive babyblauem Hintergrund, Comic Sans, Hit Counter und unzähliger blinkender GIFs. Usability spielte dabei für mich keine Rolle, dafür war die Experience super. 😉 Leider kann ich mich nicht mehr an den Link erinnern, ansonsten hätte man die Seite vielleicht noch mit der WaybackMachine finden können.

JavaScript war dann die Antwort auf die Limitationen von HTML. So wurde es nun möglich z. B. Popup Fenster und die dynamische Anordnung von Content einzubauen. Ende der 90er wurde Flash bei den Designern immer beliebter. HTML bot ihnen nur wenig gestalterische Optionen. Flash ermöglichte hingegen komplexe, interaktive Seiten mit unterschiedlichsten Formen, Layouts, Animationen, Interaktionen und Fonts zu gestalten. Viele Webseiten kombinierten tabellenbasiertes Design mit Flash-Elementen. Vor allem Splash-Pages, Intro-Animationen und Navigationselemente die bei Mouse-Over ihre Farbe änderten wurden populär.

Frühe 2000er.

Obwohl es CSS schon in den späten 90ern gab, fingen Webdesigner aber erst im Jahr 2000 – also nach dem Dotcom Boom an das volle Potential von CSS (Cascading Style Sheets) zu verstehen und zu nutzen. Vor allem unterstützt durch den fast 100%igen CSS Support des Internet Explorers. Cascading Style Sheets erlaubten den Webdesignern nun Content und Design zu trennen, Elemente einer Website also per Style Sheet zu definieren, anstatt im HTML der Seite selbst. Dadurch wurde es einfacher ein einheitliches Look and Feel zu schaffen. CSS Designs waren außerdem meist kleiner als tabellen-basierte Layouts und ermöglichten so ein schnelleres Laden der Seiten. Insgesamt spielte die Usability ab jetzt eine immer größer werdende Rolle. So langsam verschob sich die Hauptnavigation auch immer öfter von der linken Seite horizontal in den oberen Bereich der Website und Drop-Downs wurden ein beliebtes Tool in der Navigation.

Das Web 2.0.

Die industrielle Revolution des Webdesigns kam dann mit der Geburt des Web 2.0 auf. Ab jetzt bewegten wir uns auf ein moderneres Web zu. Multimediale Applikationen, interaktiver Content und der Aufstieg des Social Webs sind nur einige Neuerungen dieser Ära. Auch die Ästhetik des Webs veränderte sich. Das Design wurde immer mehr so eingesetzt, dass es auf die Darstellung von Content wie Artikeln oder Grafiken fokussierte und den Nutzer und seine Wünsche und Ziele immer weiter ins Zentrum rückte. Die Darstellung oder der Verkauf von Produkten waren – zumindest auf den ersten Blick – nur noch sekundäre Funktionen einer Website.

Die mobile Revolution.

Erste Smartphones gab es zwar schon seit Mitte der 90er. Die Einführung des iPhones 2007 stellte jedoch den Wendepunkt dar. Die Bedienung der ab dann entwickelten Geräte beschränkt sich fast ausschließlich auf Touchscreens. Mit mobilen Geräten im Web zu browsen war aber trotzdem lange eine große Herausforderung (und ist es jetzt leider manchmal noch). 2008 fingen mehr und mehr Websitebetreiber an, ihre Seiten auch als mobile Version anzubieten. Dabei beinhalteten mobilen Seiten häufig nur einen Ausschnitt der Desktop-Seite. Oft war es nicht einmal möglich, die Desktop-Variante im mobilen Browser aufzurufen. Unterschiedliche Layouts, unterschiedlicher bzw. fehlender Inhalt – richtig zufrieden waren die meisten Nutzer immer noch nicht. Und was machte man nun mit den vielen, schönen Werbeanzeigen? Vor allem aber spielte auch die Internetgeschwindigkeit eine erschwerende Rolle. Über die letzten Jahre hat sich ziemlich schnell, ziemlich viel getan. Ein großer und wichtiger Schritt war hier vor allem die Standardisierung von häufig genutzten Elementen wir Formularelementen, Buttons und der Navigation. Daraus entwickelten sich Frameworks wie Bootstrap und Foundation. Allerdings sehen dadurch viele Webseiten auch sehr ähnlich aus, da Anpassungen am Design nicht alleine durch Änderungen an den CSS-Dateien möglich ist, sondern man auch gezwungen ist, in das Markup einzugreifen.

Responsive Web Design

Die neue Art der Internetnutzung durch mobile Geräte mit kleineren und vor allem unterschiedlich großen Displays erfordert nun eine völlig neue Art des Webdesigns. Während das Layout von Webseiten früher für eine bestimmte Standardauflösung optimiert wurde, so ermöglicht Responsive Webdesign mit Hilfe von HTML5 und CSS3 Media Queries, Inhalte einer Website einheitlich anzuzeigen – egal ob das Gerät horizontal oder vertikal gehalten wird. Dabei wird das Layout der Seite so flexibel gestaltet, dass dieses sich der jeweiligen Auflösung anpasst und auf allen Geräten eine gleichbleibende User Experience bietet und den Inhalt nicht reduziert darstellt.

Dieser Spruch soll die Prinzipien des Responsive Web Designs illustrieren. (Quelle: Wikipedia)

Dieser Spruch soll die Prinzipien des Responsive Web Designs illustrieren. (Quelle: Wikipedia)


Das war’s?

Wahrscheinlich eher nicht. Und das ist ja gerade das Spannende. Flat Design, große Typographie, eingebettete Videohintergründe, minimalistisches Design … neue Geräte. Und die UX im Zentrum davon. Schaut man sich die letzten 20 Jahre an, bin ich gespannt, wie es in den nächsten 20 Jahren weiter geht.

Schüco im Wandel

Jedes Design und Web Element wurde über die Zeit so weiterentwickelt, dass es dem Nutzer so effektiv und effizient wie möglich die wichtigsten Inhalte übermittelt. Dabei spielten Aspekte wie der barrierefreie Zugang zum Web, Adaptionsfähigkeit und Usability von Webseiten mit der Zeit eine immer größere Rolle.
Es ist immer wieder wichtig sich klar zu machen, wie sich das Web über die letzten Jahre eigentlich entwickelt hat und wie es dazu kam. Nur dann können wir tatsächlich beurteilen und verstehen, warum Webseiten aussehen wie sie aussehen und sich vielleicht manchmal nicht so schnell verändern wie wir uns das wünschen würden. Vor allem aber hilft es dabei unsere Nutzer (aus unterschiedlicher Altersklassen und mit unterschiedlichen Gewohnheiten und Zielen) besser zu verstehen und für sie Webseiten zu designen und zu optimieren.

Ihr seht, ich habe bisher noch nichts über die Schüco-Website gesagt bzw. geschrieben. Mit aufgefrischtem Wissen über die Veränderungen des Internets, seht ihr hier nun endlich einen Auszug der Schüco-Startseiten aus den vergangenen Jahren 14 Jahren:

Schueco im Wandel

Zum Projekt „Design im Wandel

eResult verfolgt und dokumentiert bereits seit mehreren Jahren die Entwicklung des Webdesigns von 50 verschiedenen Branchen. Die dokumentierten Screenshots werden regelmäßig ausgewertet und Erkenntnisse hier im Usabilityblog vorgestellt.

Portraitfoto: Jumana Al Issawi

Jumana Al Issawi

Senior Consultant

Open Reply Germany

Bisher veröffentlichte Beiträge: 10

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.