NZZ Connect, Zweigniederlassung der NZZ, organisiert national relevante Konferenzen und Events, wie das Swiss Economic Forum, die FutureHealth Konferenz oder das Open-i. Dabei schaffen sie einen Austausch zwischen Akteur*innen aus Wirtschaft, Politik, Wissenschaft und Behörde, um zentrale und aktuelle Themen zu diskutieren.
Die Events, Programme und Formate von NZZ Connect werden auf ihren jeweiligen Websiten präsentiert.
Bisher waren diese Webseiten eigenständig, was bedeutete, dass dafür über 12 verschiedene Setups mit individuellen Content Management Systemen und Technologien im Einsatz waren. Diese musste einzeln und unabhängig voneinander verwaltet und gepflegt werden, was natürlich ein entsprechend grosser Aufwand zur Folge hatte, insbesondere für das Content Management Team. Für jede Seite mussten alle Inhalte individuell erstellt und gepflegt werden, auch wenn sich Inhalte in ihrer Struktur ähnlich sind (z.B. Programm) oder sogar identisch (z.B. das Portrait einer Speakerin die an zwei der Events auftritt). Zusätzlich war die Bedienung der Systeme nicht einheitlich, was grossen Aufwand für Einarbeitung und Schulung bedingte und letztlich war natürlich das Management und die Koordination mit unterschiedlichen Agenturen mit Aufwand verbunden.
Ziel war es also, eine Lösung zu finden, welche diese Aufwände zukünftig minimiert und den Unterhalt aller Websites erleichtert. Dazu haben wir in mehreren Workshops mögliche Ansätze und Lösungen diskutiert.
Die einzelnen Events benötigen weiterhin ihre eigenen Websites, da sie jeweils ein eigenständiges Thema, Erscheinungsbild, Zielgruppe und Corporate Identity haben. Das oder die Systeme dahinter jedoch werden abgelöst und mit einem einzigen System ersetzt, über welches die Sites zentral verwaltet werden können. Zum Einsatz kommt dafür Statamic als unser «CMS des Vertrauens» - mehr Details zur Technik führen wir weiter unten aus.
In einem ersten Schritt haben wir die bestehende «Website-Landschaft» von NZZ Connect analysiert. Wir haben Gemeinsamkeiten identifiziert und eine umfassende Auflistung der existierenden Komponenten und Modulen gemacht. Damit schafften wir eine Auslegeordnung, basierend auf welcher wir die zukünftig benötigten Komponenten und Features priorisieren konnten.
Dadurch dass ein Grossteil der Inhalte als wiederverwendbare Komponenten umgesetzt wurde, können Inhalte, die auf unterschiedlichen Seiten eingesetzt werden (wie beispielsweise Speaker oder Sponsoren) und einfach wiederverwendet werden. Der Einsatz von wiederverwendbaren Inhalten garantiert einheitliches Design & Konsistenz über die verschiedenen Seiten hinweg, während gleichzeitig die Designs und Brandings der verschiedenen Events eingehalten werden können. Für jede Seite können eigene Schriften, Farben, Favicons etc. festgelegt werden.
Weil Statamic als alleinige API für alle Inhalte genutzt wird, kann das Content Management Team Inhalte zentral editieren oder hinzufügen, welche dann automatisch auf allen gewünschten Seiten aktualisiert werden. Dies macht das Pflegen von verschiedenen Seiten besonders effizient.
Mit Hilfe der Content Preview Funktion von Statamic kann dann sichergestellt werden, dass alle Inhalte so aussehen wie gewünscht, bevor sie publiziert werden
«Das Vorgehen von Apps with love mit einer intensiven Phase mit Workshops, Anforderungserhebung und Diskussion hat effektiv zu einem gemeinsamen Verständnis für unsere Herausforderungen geführt. Das wiederum hat ermöglicht, termingerecht auf den Stichtag die erste mit dem neuen System realisierte Seite für das Swiss Economic Forum live zu schalten. Die Webauftritte für alle unsere Events konnten wir Schritt für Schritt in das CMS integrieren und damit Synergien nutzen. Ziel erreicht!»
Dominic Lüthy, Director Marketing & Communication
Die grosse Herausforderung bei einem Multisite-CMS, respektive bei den Überlegungen ob eines überhaupt sinnvoll ist, ist unter anderem der Aufwand für Automationen und die Frage ob man sich mit standardisierten Komponenten und über Seiten hinweg geteilten Inhalten am Schluss nicht mehr Arbeit und mühsame Abhängigkeiten einhandelt. Durch die Flexibilität von Statamic und einer cleveren Architektur, haben wir es geschafft diese Herausforderung zu meistern. In der Übersicht ist die Architektur (relativ) simpel, die Komplexität liegt in den Details. Die zu beschreiben würde hier den Rahmen sprengen und sind in Zukunft vielleicht mal Thema für einen Blogpost.
Kernstück ist die Kombination von Statamic als zentraler headless-Content-Hub und Vercel als Infrastruktur als Service (IaaS) und massiver «Deployment-Vereinfachung» mit GitLab: Der Deployment-Prozess ist vollständig automatisiert. Sobald eine Codeänderung in das Repository (GitLab) hochgeladen wird, erfolgt die Bereitstellung der Website automatisch über Vercel. Das bedeutet, dass keine manuelle Installation oder Aktualisierung notwendig ist, was Zeit spart und Fehler reduziert.
Aufgrund des Einsatzes von Vercel ergab sich die Nutzung von Next.js, ein modernes Framework, das auf React basiert, im Frontend. Next.js handelt die Requests auf die jeweilige Domain und leitet diese weiter. Durch effiziente Serveranfragen und optimierte Darstellungsprozesse sogt Next.js dafür, dass die Websites schnell laden und die Gesamtperformance verbessert wird.
Das eingesetzte CMS Statamic basiert auf Laravel. Laravel bietet viele nützliche Werkzeuge, um die Datenverarbeitung und API-Anpassungen effizient zu gestalten. Mit Funktionen wie Validierung und Listenern lässt sich das Backend flexibel anpassen und der Code bleibt dabei übersichtlich und wartungsfreundlich. Dank dem Headless-Einsatz von Statamic kann der Content nun einfach über die API abgerufen und somit auch in der NZZ Connect App, die Semabit entwickelt hat, genutzt werden. Das heisst auch Informationen wie zum Beispiel das Verzeichnis der Redner*innen an einem spezifischen Event, können an einem Ort gepflegt werden und dann unabhängig ob Website oder App genutzt werden.
Die neue Lösung stellt eine beachtliche Vereinfachung für das Content Management Team und die Event-Organisator*innen von NZZ Connect dar. Sie müssen sich nicht mehr mit verschiedenen Systemen und deren Eigenheiten auskennen, sondern nur noch mit einem einzigen. Neue Seiten können schnell und einfach erstellt werden und das Erfassen und Pflegen von Inhalten wird effizienter. Wo früher mehrere Tage für eine neue Seite erforderlich waren, brauchen wir jetzt nur noch 6–8 Stunden, um eine neue Website einsatzbereit zu machen.
Die Events behalten ihr eigenes visuelles Erscheinungsbild, während sie durch die wiederverwendbaren Komponenten trotzdem als NZZ Connect Events erkennbar sind.
Dazu kommt, dass die API auch für die mobile App verwendet wird, wodurch der gesamte Inhalt zentral an einem Ort gepflegt wird und sowohl auf der Website als auch in der App einheitlich dargestellt wird.
Durch die zentralisierte Lösung hat sich auch die Anzahl Ansprechpersonen und Serviceverträge für NZZ Connect deutlich reduziert, wodurch auch aus administrativer Sicht ein schlankeres Setup erreicht wurde.
