Wie sieht das Design einer zeitlosen Website aus?

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren...

Es ist ein interessantes Gedankenexperiment, zu dem Chris Coyier von CSS Tricks da aufruft. Wie gestaltest du eine Website, die quasi ewig währen soll?

“Übrigens, die Website muss 10 Jahre unverändert laufen!”

Hast du darüber schon mal nachgedacht? Ich gebe zu, ich habe es nicht. Chris Coyier stellt sich und uns die Frage, wie eine Website aussehen muss, wenn der Kunde sie mindestens zehn Jahre unverändert betreiben will. In Anbetracht der sich stetig stabilisierenden Best Practices ist die Fragestellung in Zukunft vielleicht gar nicht mehr so unüblich. Lass uns mal gemeinsam schauen, zu welchen Ergebnissen wir kommen können.

Chris Coyier zählt verschiedene Designer-Typen auf, die auf das ungewöhnliche Ansinnen des fiktiven Kunden ganz unterschiedlich reagieren könnten. An den Enden des Spektrums steht zum einen der Designer, der ohnehin jede Form von Layout und Gestaltung unnötig findet und einen einfachen HTML-Text als völlig ausreichend erachtet. Am anderen Ende des Spektrums stehen die Designer, die das Ansinnen fast schon beleidigt rundheraus ablehnen würde.

Die meisten von uns würden sich wohl mittig einpendeln und überlegen, was unbedingt erforderlich ist, um ein auf Dauer zeitgemäßes Design zu liefern und auf was sinnvoll verzichtet werden kann. Bei intensiverem Nachdenken kommt man noch auf ganz andere Ideen.

Abschreckendes Beispiel: die Million-Dollar-Homepage

Ich etwa las vor ein paar Tagen einen interessanten Beitrag des Library Innovation Lab, der sich mit der damals überaus bekannten Million-Dollar-Homepage befasste. Du kannst dich sicherlich noch an die Website erinnern, auf der Pixel für Pixel verkauft wurde, um den Betreiber am Ende mit einer Million Dollar zu versorgen.

Auf 1.000 mal 1.000 Pixeln zu einem Preis von einem Dollar pro Pixel konnten sich Interessenten Platz kaufen, um ihre Wewrbebotschaften unterzubringen. 2005 machte das Projekt weltweit Furore. Der Betreiber fuhr seine geplante Million ganz locker zeitnah ein.

Kennst du unser E-Book-Bundle? Spare jetzt 6,99 €!

E-Book Bundle von Andreas Hecht

Heute, 12 Jahre später, existiert die Million-Dollar-Homepage immer noch, wirkt aber wie ein Artefakt vergangener Zeiten. Das liegt sicherlich zum einen daran, dass es keinerlei Gestaltungsrichtlinie gab. So musste ein völlig zusammengewürfeltes Design entstehen. Unter diesem Gesichtspunkt sollten wir das Projekt daher gar nicht erst bewerten.

Es ist etwas anderes, das auffällig ist. Nämlich der Umstand, dass von den rund 3.000 Links, die die Site beherbergt, inzwischen deutlich mehr als die Hälfte nicht mehr aufrufbar sind. Fast 600 Links führen gar ins Netznirvana, die übrigen unterliegen teils seltsamen Redirects.

Damit hat die Million-Dollar-Homepage nicht mehr nur für den Besucher einen deutlich reduzierten Nutzen, sondern vor allem auch für die damaligen Pixelkunden.

Was können wir daraus für eine Erkenntnis ziehen, wenn es darum geht, unserem heutigen Kunden eine Website zu verkaufen, die mindestens 10 Jahre unverändert betrieben werden kann?

Voraussetzungen für haltbare Websites

Im Grunde liegt es auf der Hand. Wir müssen auf Links verzichten, die nicht aus dem Link-Kosmos des Kunden stammen. Und selbst bei diesen müssen wir sicherstellen, dass der Kunde bei etwaigen Umstellungen im Hinterkopf behält, die internen Links nötigenfalls anpassen zu müssen.

Zusätzlich müssen wir auf externe Ressourcen verzichten, denn wir haben auf die dauerhafte Verfügbarkeit dieser Elemente keinen Einfluss. So verlockend es also zunächst wirkt, etwaige externe Skripte aus deren Repositories im Web oder kommunizierte CDN-Lokationen einzubinden. Wir sollten es lassen. Stattdessen holen wir erforderliche Ressourcen auf die Site des Kunden und binden sie lokal ein. Dabei ist allerdings darauf zu achten, dass die Scripts nicht wieder in sich externe Ressourcen referenzieren. Richte dich auf etwas Arbeit ein.

Ebenfalls wichtig ist es, darüber nachzudenken, welche Funktionen in der Zukunft möglicherweise nicht mehr verfügbar sein werden. Glücklicherweise lassen sich Features, die als deprecated gelten, recht leicht identifizieren.

Ebenfalls nicht empfehlenswert ist es in diesem Zusammenhang, Frameworks zu verwenden. Speziell der neueste heiße Scheiß, wie React oder Vue, wird mit ziemlicher Sicherheit in zehn Jahren nicht unproblematisch sein. Vanilla JavaScript hingegen dürfte sicher sein.

Was machen wr mit Fonts? Typografie ist sicherlich ein wichtiges Designelement. Coyier weist zurecht darauf hin, dass es älter als Webdesign insgesamt ist und von daher nicht zu den verzichtbaren Designelementen gehören sollte. Setzen wir also Fonts ein. Aber auch hier gilt es, diese lokal zu speichern und einzubinden. Statt des älteren Woff-Formats können wir hier auf WOFF2 setzen, um eine gewisse Nachhaltigkeit einzubauen. WOFF2 haben wir bei Dr. Web an dieser Stelle ausführlicher vorgestellt.

Der einzige Trend, auf den wir bei diesem Projekt setzen können, ist jener zum Minimalismus. Der beinhaltet immerhin auch den lediglich zurückhaltenden Einsatz von Animationen. Ich würde letztere sogar stets nur im Rahmen von Mikrointeraktionen einsetzen. Dazu habe ich auf t3n an dieser Stelle ausgelassen.

Als Grafiktechnologie können wir wohl auch zukünftig auf SVG setzen. Damit sind wir von Auflösungen unabhängig. Jpg und Png werden auch in zehn Jahren noch das geschehen bestimmen. WebP konnte sich bislang nicht durchsetzen und wird das wohl auch in Zukunft nicht schaffen.

Generell müssen wir uns natürlich schon eingestehen, dass wir nur dann eine zeitlose Website herstellen können, wenn diese keine fortgeschrittene Funktionalität bieten muss. Einen Onlineshop, der 10 Jahre unverändert laufen können muss, würde ich wohl als Auftrag ablehnen. Aber eine Webvisitenkarte oder sonstiger rein repräsentativer Auftritt stellt eher kein Problem dar, wenn die genannten Voraussetzungen erfüllt sind.

Wie seht ihr das? Was muss gewährleistet sein, damit der Kunde seine 10-Jahre-Website bekommen kann?

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design. Man findet ihn auch auf Twitter und Google+.

Sortiert nach:   neueste | älteste | beste Bewertung
Der Aysbert
Gast

Tatsächlich laufen noch Webdites, die wir für Kunden vor über 10 Jahren erstellt haben. Auffallend dabei ist vor allem, wie klein damals die Bildschirme waren…

Es sei mir erlaubt, http://www.strotoeg.net zu nennen (ca. 2001), http://www.fotocopyservice.de (ca. 2004) oder http://www.karg-industrietechnik.de (ca. 2006)…

Über die im Beitrag genannten Aspekte hinaus sollte man sich aber auch Gedanken um die Gestaltung der Website machen. Ein Web 2.0-Verlauf im Logo mit Spiegelung ist jetzt, schon wenige Jahre nach dem Hype auffallend “out”. Also lieber klassisch, zurückhaltend und nüchtern bleiben.

PiGro
Gast

Tja, ich denke zunächst muss gewährleistet sein, dass der Kunde in Unternehmen hat das auch für 10 Jahre beständig bleibt, also ohne wesentliche Veränderung in Bezug auf sein CI.
Bei kleinen Unternehmen kann ich mir das gut vorstellen, bei größeren, ggf. Aktiennotierten Unternehmen denke ich wird das wohl eher nicht der Fall sein.
Weiterhin sollte dann auf ein klassisches Layout gesetzt werden. Modischer Schnickschnack ist schnell wieder out.

Jens
Gast
Interessante Frage. Leider ist das eine oder andere Projekt aus meinen Webdesign-Kindertagen inzwischen auch knapp 10 Jahre lang nicht angerührt, und daher auch nicht mehr zeitgemäß, aber sie würden funktionieren. Denn im Grunde habe ich unbewusst diese Kriterien erfüllt: keine externen Dienste eingebunden. Keine Spielereien mit Animationen, keine Techniken die damals schon nicht so top-modern bzw. bevorzugt waren. Einzig das Design an sich lässt heutzutage zu wünschen übrig ;) Ich würde sagen, eine Webseite für diese Dauer sind tatsächlich nur Seiten mit statischen Inhalten oder Blogs / News. Bei denen komt es nicht auf Funktionen, modernste technologie an sondern auf… Read more »
atimedia
Gast

Schon erstaunlich, wie viele alte Websites noch laufen und ihren Zweck – mehr oder weniger – gut erfüllen.
Beispiel, ca. zehn Jahre alt: http://www.musikhaus-komlew.de/
Es gibt auch ganz grauenhafte Beispiele, die ich hier aus “taktischen Gründen” nicht präsentieren möchte … ;-)

Zur Frage: Ich halte eine solche Planung für kaum möglich, für wenig sinnvoll, an der Realität vorbei.

Erich Krenslehner
Gast

Wie auch in der Architektur sind zeitlose Materialien, Farben, etc., über Jahre hinweg am beständigsten. Habe meine erste Website http://www.retaildesign.at, als “Jungunternehmer” deshalb auch so aufgebaut und freue mich, dass ich dem im Beitrag beschrieben im Trends folge :-) Gerade in einer Zeit der maximalen Reizüberflutung gilt, so wie in vielen Bereichen des Lebens “keep it simple” und “weniger ist mehr” Um interessant zu bleiben sind laufende Optimierung bzw. Aktualität allerdings unumgänglich.

Mirco
Gast

Klassische Beispiele könnten auch ebay und amazon sein. Mal ehrlich: Was hat sich an den beiden Seiten in den letzten 10 Jahren groß geändert (von Feinheiten mal abgesehen)?

Aber das ist es, was die beiden Seiten ausmacht: Dass man nicht jedes Jahr umdenken muss, um die Seite nutzen zu können oder Elemente auf einmal nicht mehr findet, die man an gewisser Stelle gewohnt war.

Daniel
Gast

Ich sehe das eigentlich wie Mirco. Es muss nicht alle zwei Jahre in kompletter Relaunch erfolgen, genauso wenig sollte eine Website auf dem Stand vor 10 Jahren sein. Wichtig ist in meinen Augen eher eine kleine und stetige Verbesserung des Grunddesigns.

Johannes Torker
Gast
Cooles Gedankenexperiment, daher kann man sich als Webdesigner schon heute ob der “super tollen” Webbaukästen ins Fäustchen lachen. Eine Seite die 10 Jahre halten soll würde ich aus jetziger Sicht allein mit html und css bauen, Unterseiten direkt statt dynamisch einbinden bzw. verlinken. Auf jegliche externe Anbieter müsste man Verzichten dazu zähle ich Frameworks, Plugins und selbst vergleichsweise zuverlässige externer Dienste z.B. von Facebook oder Google. Auf jegliche Animation sollte man dann wohl ebenso verzichten. Sie wirken in wenigen Jahren einfach nicht mehr. Selbst Bilder sind da schon grenzwertig, insbesondere von Personen. Fazit: in so einem Fall so viel Html… Read more »
wpDiscuz