Der Containerist … hach …
mal vorneweg, damit es hier nicht zu Verwirrungen kommt: Der Begriff bezeichnet zwei Dinge …
- … ein Design-Prinzip …
- … einen darauf aufbauenden Technologie-Stack …
… und beides schreibe ich mal unserem lieben Freund Konstantin „Konnexus“ Weiss als Quell der Freude zu, auch wenn ich bei ersterem damit vermutlich einer Reihe anderer Designer Unrecht tue. Aber von Konstantin habe ich zum ersten Mal vom Containeristen erfahren, er hat das Konzept am weitesten durchdacht und wenn ich mich nicht irre, den Begriff geprägt, den wir bis heute nutzen, um das Konzept zu erklären. Und: Seine containeristigen Arbeiten sind bis heute die überzeugendsten, wie ich finden muss. Was aber ist das eigentlich. Ich erklär’s mal mit seinen eigenen Worten …
“A web page is a stack of autonomous containers.
Content on the web page is enclosed in these containers. Every container has a full-layout width. It can be further structured internally, but is self-sufficient. That is, a container’s content and interactions aren’t affected by previous or following containers.”
Da sind die beiden wichtigsten Sachen schon drin: Webseiten (und seien es nur einzelne Seiten) als Stapel von Containern bauen, die jeweils die volle Seitenbreite einnehmen! Container so aufbauen, dass sie inhaltlich abgeschlossen sind! Weil wir im Palasthotel ständig mit dem Konzept arbeiten, haben wir das, um es besser erklären zu können mal von Nils Tiemeyer illustrieren lassen.
Nach dem Containeristen gebaute Seiten habe gegenüber klassischen (mit Seitenspalte, oder ganz anders) eine Reihe von Vorteilen …
- Das funktioniert geräteübergreifend. Klassische Desigsn mit Seitenspalte habe das Problem, dass die Seitenspalte in der mobilen Ansicht komplett unter die Hauptspalte fällt. Damit landen Inhalte, die zuvor im ersten Screen sofort sichtbar und entsprechend wichtig sind, plötzlich erst in der zweiten Hälfte der Seite.
- Es hält zusammen, was zusammen gehört. Auch das ist ein Problem der klassischen Seitenspalten-Designs: Was in der Seitenspalte steht, hat inhaltlich praktisch nichts mit dem zu tun, was auf gleicher Höhe in der Hauptspalte passiert. Will man beides im Blick behalten, muss man schon eine Form schizophrenen Lesens entwickeln. Der Container hingegen sollte immer Dinge enthalten, die auch gemeinsam Sinn ergeben.
- Container sind so wiederverwendbar. Die Tatsache, dass Container nach Möglichkeit inhaltlich abgeschlossen und unabhängig sind, erlaubt es, sie auf jeder Seite einer Site wieder einzusetzen.
- Es motiviert zu scrollen. Was aber auch daran liegt, dass wir stets versuchen, die Container-Metapher auch soweit durchzuziehen, dass jeder Container nicht mehr als einen Screen ausfüllt und auf jeden Container einer folgt, der eine etwas andere Struktur oder Anmutung hat. Auf diese Weise hat man immer mindestens zwei Container im (Desktop-) Screen und sieht immer etwas Neues.
- Containist-Seiten sind flexibler. Ein Container kann je nach Bedarf selbst wieder unterschiedlich komplex untergliedert sein. In der Regel haben wir Container mit einer, zwei, drei, vier und sechs Spalten, die jeweils unterschiedliche Inhalte (aber auch gleiche) aufnehmen können. So kann man in einem Container mal ganz oppulent nur eine Grafik über die volle Breite spielen und gleich darauf in einem anderen Container ein Teasermosaik mit 12 Teasern unterbringen.
Containerist-Seiten sind aber auch in ihrem Umfang flexibel. Wenn ich mal sehr viel zu erzählen habe, dann kann ich zehn oder zwanzig oder mehr Container verwenden. Wenn ich nur ein bisken zu vermitteln habe, kann ich mich auch einfach auf ein oder zwei Container beschränken.
Und durch die inhaltliche Abgeschlossenheit der Container kann ich sie jederzeit, je nach redaktionellem Bedarf, in ihrer Reihenfolge auf der Seite verändern, einzelne Container hochziehen oder runterschieben, oder neue Container einfügen und später wieder entfernen.
Und damit das mal ein bisken anschaulicher wird, was ich meine, mal ein paar erläuterte Beispiele.
Emma.de folgt mit seinen Boxen ein wenig dem Ideal von Freitag.ch (die ehedem schönste Containerist-Seite), auch wenn hier nicht so konsequent durchgezogen ist. Neben der Startseite mag ich besonders die Themen-Übersichtsseite, die die Aufgabe übernimmt, die 80 Punkte umfassende thematische Navigation attraktiver aufzubereiten. Und: Die Emma-Redaktion ist eine der Redaktionen, die intensiven Gebrauch von der Wiederverwendbarkeit von Containern macht.
Die Heinrich-Böll-Stiftung war eine der ersten Seiten, die wir 2013 nach dem Containerist-Prinzip gebaut haben. Seither haben wir gemeinsam mit der Internet-Redaktion sowohl den Umfang als auch die Anmutung kontinuierlich weiter ausgebaut.
Der Schweizer Monat, ein monatliches Magazin, dass bereits seit 1921 publiziert wird und Größen wie Thomas Mann, Hermann Hesse, Karl Popper und Theodor W. Adrono zu seinen Autor*innen zählt ist eines unserer oppulentesten und vielfältigesten Beispiele für den Containeristen.
Auch Zeit Online hat inzwischen weite Teile seiner Homepage als Container umgebaut (womit wir aber nichts zu tun haben). Nur noch wenige Screens haben dort die klassische Zweidrittel-Eindrittel-Seitenspalten-Optik, und das vermutlich auch nur noch der Werbung wegen.
Ach und … wir haben ein Plugin für WordPress und Drupal gebaut, das es erlaubt, Seiten nach dem Containerist-Prinzip zu bauen: Grid. Und die Emma und die VDZ-Akademie laufen natürlich mit dem Plugin, ebenso wie ze.tt, die Amadeu-Antonio-Stiftung, die Digitalecourage, der Reise-Know-How-Verlag der Rolling Stone, der Metal Hammer und der Musikexpress.
Da man Gutenberg möglicherweise ebenfalls als Containerist-Werkzeug begreifen kann, werden wir uns in diesem Jahr intensiv damit beschäftigen, ob wir die Erfolgsgeschichte des Containeristen und von Grid darin weiter schreiben wollen. Mehr dazu demnächst an dieser Stelle.
Das Aufmacherbild ist von nurmalso / photocase.de