Komplexitätsreduktion auf höchstem Niveau
Die grösste Herausforderung des Projekts bestand darin, die zahlreichen vorhandenen Webseiten der Stiftung zu analysieren, neu zu denken und auf einer einzigen Webseite sinnvoll zusammenzufassen. Dutzende verschiedener Seiten, Sub-Seiten und Landingpages wurden neu strukturiert. Dies für die einzelnen Länderaktivitäten von Peru bis Georgien, oder die zahlreichen Leistungsbereiche wie Wasserstoff-Lastwagen oder mobile Pelletheizungen.
Die 2012 von der Erdöl-Vereinigung (heute Avenergy Suisse) gegründete Stiftung Klimaschutz und CO₂-Kompensation KliK ist die branchenweite CO₂-Kompensationsgemeinschaft für fossile Brennstoffe im Rahmen des CO₂-Gesetzes.
Optimiert und automatisiert ins brandneue Headless CMS
Ein Grossteil der Seiten wurde von der Stiftung KliK textlich überarbeitet und in diverse Sprachen übersetzt, bevor sie automatisiert in das brandneue Headless CMS Storyblok übertragen wurden. Darüber hinaus wurden zahlreiche bestehende Newsbeiträge inkl. Bilder mit einem eigens dafür entwickelten Content-Importer vom alten System ins Neue übertragen. Dadurch konnten zahlreiche Arbeitsstunden und mühsame manuelle Eingaben eingespart werden. Die im Laufe der Jahre indexierten Seiten wurden dabei sorgfältig an den neuen Ort umgeleitet, um das gute Suchmaschinen-Ranking der Stiftung zu gewährleisten.
Mega-Flyout Navigation für mehr Übersicht und Beschränkung auf das Wesentliche
Das Herzstück der neuen Webseite ist eine Navigation, die die Seitenstruktur widerspiegelt und den Benutzern einen klaren Überblick über die Inhalte verschafft. Um den Benutzern bei der Orientierung zu helfen, werden die KliK Bereichs-Farben verwendet. Die einzelnen Programmseiten wurden vereinheitlicht, sodass die Informationen immer im selben Look und in der selben Struktur präsentiert werden. Dies erleichtert nicht nur das Hinzufügen neuer Programme und Länder in der Zukunft, sondern auch das Auffinden von Informationen für die Benutzer. Die zahlreichen bestehenden Landingpages für Länder und Leistungsbereiche wurden nahtlos in die neue Website integriert.
Umfangreicher Element-Baukausten für alle Fälle
Damit die Webseite den hohen Anforderungen gerecht wird, wurden diverse neue Content-Elemente entwickelt und hinzugefügt. Dazu gehören verschiedene Teaser, Bildergalerien, PDF-Reader, ein Kontaktformular mit diversen Einstellungsmöglichkeiten und ein übersichtlicher Download Hub. Mit der intuitiven Benutzeroberfläche des CMS Storyblok können Inhalte wie Texte, Bilder oder Videos problemlos durch den Kunden bearbeitet, aktualisiert und getimed werden. Schliesslich wurden die bestehenden Beitragsrechner, welche die direkte und einfache Berechnung des Förderbeitrags online ermöglichen übersichtlicher und intuitiver gestaltet und direkt via API angebunden.
Nuxt 3 und Storyblok für effiziente Entwicklung und einfache Inhaltsverwaltung
Technisch wurde das Projekt mit dem leistungsstarken Vue 3 Framework Nuxt 3 umgesetzt. Dies garantiert dank Server Side Rendering höchste Performance, SEO Integration und Skalierbarkeit. Als CMS wird Storyblok verwendet. Mit seiner intuitiven Benutzeroberfläche können Inhalte wie Texte, Bilder oder Videos problemlos bearbeitet und aktualisiert werden.
Insgesamt ermöglicht die Kombination aus Nuxt 3 und Storyblok eine effiziente Entwicklung und Verwaltung von Webseiten. Die Technologie bietet eine hohe Flexibilität, Skalierbarkeit und Benutzerfreundlichkeit, was zu einer verbesserten Benutzererfahrung und einem reibungslosen Arbeitsablauf führt.
Toilets For All
Scrollytelling Website