Wie sieht das Design einer zeitlosen Website aus?

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.

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?