User-zentrierte Website für den Kanton Zürich

Kanton Zurich

Der Kanton Zürich hat seinen Webauftritt zh.ch vollständig überarbeitet. Dabei wurden die Bedürfnisse der Nutzerinnen und Nutzer ins Zentrum gesetzt.

Anstelle einer Orchestrierung der Inhalte anhand der verschiedenen Organisationen des Kantons Zürich wurden die Inhalte anhand der Bedürfnisse der Besucher von zh.ch  von Grund auf neu konzipiert und erstellt.

One Inside realisierte in einer interdisziplinären Zusammenarbeit mit der Generalunternehmerin Unic sowie Zeix den neuen Webauftritt des Kantons Zürich.

One Inside zeichnete sich für die technische Konzeption und Realisierung im Frontend und Backend verantwortlich

Der Nutzer im Zentrum

Die Inhaltsarchitektur der Webseite des Kantons Zürich war bisher anhand der Organisation des Kantons gestaltet und spiegelte damit eine Innenansicht der Verwaltungen.

Der neue Webauftritt wurde im Gegensatz dazu mit dem Ziel eines einfachen Zugangs zu den Dienstleistungen ausgestaltet. Das Design des Webauftritts des Kantons Zürich ist klar funktional ausgerichtet.

Aus einer Studie mit Benutzern des Webauftritts ging beispielsweise deutlich hervor, dass der primäre Anspruch der Nutzer an eine neue Webseite darin besteht, einfach und schnell Informationen zu finden. Dementsprechend ist die Gestaltung auf einfach zugängliche und klar strukturierte Inhalte ausgerichtet.

Ein möglichst einfacher und konsistenter Seitenaufbau, die klare und grosszügige Typografie, sowie wiedererkennbare Interaktionsmuster sollen es dem Nutzer einfach machen, mit dem Kanton zu interagieren. Um dies zu ermöglichen war ebenfalls ein weitreichender Wechsel der Organisation für die Bewirtschaftung der Webseite nötig. Es wurde eine themenorientierte Organisation geschaffen, welche die Ausbildung und schlussendlich Bewirtschaftung des neuen Webauftritts ermöglicht.

Für die Realisierung und den Betrieb wurden beispielsweise rund 300 Mitarbeitende in ihren Rollen als Content Manager und als Redaktorinnen oder Redaktoren ausgebildet.

Aus technischer Perspektive sollte die neue Umsetzung die Kriterien der einfachen Pflege und Erweiterbarkeit der Applikation in hohem Masse erfüllen. Dies wurde beispielsweise damit erreicht, dass modernste Content-Bewirtschaftunsfunktionen von Adobe Experience Manager (AEM) auf die Bedürfnisse der Autoren zugeschnitten wurden.

Kundenorientierung für alle Anspruchsgruppen

Auf Seiten des Projekts wurde ebenfalls eine interdisziplinäre, gemeinsame Arbeit definiert und im Projekt gelebt. Dies zeigte sich beispielsweise bei der Übersetzung der konzeptuellen Themen in die technischen Lösungsdesigns. Durch technische Schulterblicke während der Grobkonzeptionphase konnten Herausforderungen frühzeitig identifiziert werden und damit eine ideale Balance zwischen technischer Umsetzung und Anforderungen der Stakeholder vom Kanton Zürich gefunden werden konnte.

Parallel dazu wurden Qualitätsanforderungen und technische Produktanforderungen mittels Workshops ausgearbeitet, um technische Rahmenbedingungen sehr  früh zu definieren. Vor dem Start der agilen Entwicklungszyklen wurden die Anforderungen interdisziplinär in technischen Spezifikationen ausgearbeitet und dokumentiert. Dieses Vorgehen erlaubt den Entwicklern den Start der Umsetzung auf Basis eines soliden Fundaments. 

Die Website des Kantons mit hohen Anforderungen an die Verfügbarkeit, Last- und Performancekriterien wurde mit modernsten Technologien aufgebaut.

Innerhalb von AEM werden moderne Möglichkeiten des Content-Managements und Clusterings eingesetzt, um eine äusserst flexible und effiziente Erstellung und Organisation von Inhalten zu unterstützen. Für zh.ch optimierte Workflows und Inhaltselemente führen die Autorinnen entlang der Inhaltserstellung- und Pflege – das Content Management System kümmert sich um alle Belange der Verlinkungen und Organisation von Inhalten mittels Taxonomien.

Ebenfalls erlaubt die Plattform die einfache Integration von bestehenden und zukünftigen Webservices. Beispielsweise können die Bürgerinnen und Bürger des Kantons folgende Services einfach und online durchführen:

• Erneuerungen von Aufenthaltserlaubnissen
• Erfassung von Steuererklärungen
• Finden von Ämtern des Kantons inkl. Navigationshilfen

Gerade im Bereich des Austausches von Information sind flexibel und dynamisch handhabbare Formulare ein Kern-Element für eine einfache Nutzung des Systems – sowohl auf Administrations- als auch Kundenseite. Der Kanton erarbeitete dazu wie auch beim Templating eine hoch flexible wenngleich für die Autoren einfach zu handhabende Lösung.

Die Gestaltung der Kanton Zürich Webseite ist darauf ausgelegt, für alle zugänglich zu sein. Sei das für Menschen mit einer Sehschwäche oder mit einer körperlichen Beeinträchtigung. Kontinuierlich wurde im Projekt, in Zusammenarbeit von Design, Entwicklung und real betroffenen Testnutzern, die Zugänglichkeit der Webseite verbessert. So sind alle Interface-Elemente im neuen Design so gestaltet, dass sie auch für beeinträchtigte Nutzer lesbar und bedienbar sind.

Adobe Experience Manager

Um ein langfristig wartbares Produkt zu kreieren, wurden zu Beginn strikte Software-Engineering-Regeln innerhalb des Umsetzungsteam erarbeitet. Diese umfassen unter anderen; technologisch spezifische Coding Conventions, ein auf einem vier Augen Prinzip gestützter Entwicklungsworkflow und ein Komponenten-Blueprint für die einheitliche Umsetzung der Komponenten.

Durch die durchgängig erstellten Komponente- und Integrationstests können nicht erwartete Verhaltensänderungen während der Entwicklung frühzeitig identifiziert werden. Um den Entwicklern eine lokale Entwicklungsumgebung nahe der produktiven Umgebung zur Verfügung zu stellen, wurden Images auf Basis von Docker erstellt, mit welchen die Entwickler innerhalb von Minuten ein lokales Abbild der produktiven Umgebung hochfahren konnten.

Durch Anwendung von state-of-the-art Frontend-Webtechnologien wird ein ansprechendes Nutzererlebnis gewährleistet und unter Einsatz von extensivem Prototyping und kontinuierlicher Verbesserung eine nachhaltige Architektur für zukünftige Bedürfnisse von Autoren und Benutzern geschaffen.

Dabei orientiert sich die Umsetzung an folgenden Grundanforderungen für Webauftritte: responsiveness, performance, platform independence, progressive enhancement und accessibility.

Realisiert wurde die Lösung mit modernen Webtechnologien und Standards: Typescript, HTTP2, CSS3, HTML5.