[ Projekt ]
Im Rahmen einer öffentlichen Ausschreibung entstand eine moderne und vollumfängliche Website für die Stadtwerke Sinzig – selbstverständlich responsiv im Mobile-First-Ansatz, barrierefrei nach WCAG-AA und ausgestattet mit zahlreichen interaktiven Funktionen. Dazu zählen unter anderem eine dynamische Störungsanzeige sowie interaktive Karten für Versorgungsbereiche.
Das bereits in den 1990er-Jahren von mir entworfene Logo wurde im Zuge des Relaunchs von mir zeitgemäß modernisiert und behutsam an das aktuelle Corporate Design angepasst.
[ Logo ]
Das überarbeitete Logo wirkt nun kraftvoller und kontrastreicher. Die ehemals kursive Schrift mit weißer Outline wurde durch eine moderne, gut lesbare Typografie ersetzt. Auch die Farbgebung wurde angepasst – mit Blick auf optimale Kontrastverhältnisse und die Anforderungen einer barrierefreien Website.
Verschiedene, klar definierte Darstellungsvarianten sorgen dafür, dass das Signet konsistent eingesetzt wird und visuelle Beliebigkeit vermieden wird. Gleichzeitig bieten sie maximale Flexibilität für unterschiedliche Anwendungsbereiche.
[ Webdesign ]
Kundenbedürfnisse stehen im Mittelpunkt
Eine gut strukturierte Webseite für die Stadtwerke Sinzig stellt sicher, dass die Bedürfnisse der Besucher im Vordergrund stehen. Sie liefert zuerst Antworten auf alltägliche Fragen und schafft eine klare, benutzerfreundliche Navigation.
Allgemeine Informationen über das Unternehmen und seine Arbeit ergänzen das Angebot, stehen aber bewusst im Hintergrund.
Denn eines ist klar: Wer die Interessen seiner Kunden versteht und priorisiert, schafft eine Webseite, die nicht nur informiert, sondern echten Mehrwert bietet.
[ Mobile First ]
Kundenbedürfnisse stehen im Mittelpunkt
Eine gut strukturierte Webseite für die Stadtwerke Sinzig stellt sicher, dass die Bedürfnisse der Besucher im Vordergrund stehen. Sie liefert zuerst Antworten auf alltägliche Fragen und schafft eine klare, benutzerfreundliche Navigation.
Allgemeine Informationen über das Unternehmen und seine Arbeit ergänzen das Angebot, stehen aber bewusst im Hintergrund.
Denn eines ist klar: Wer die Interessen seiner Kunden versteht und priorisiert, schafft eine Webseite, die nicht nur informiert, sondern echten Mehrwert bietet.
[ Störungen ]
Auf der Startseite bekommt man es in rot angezeigt: Es gibt Störungen und/oder Einschränkungen in der Wasserqualität.
Mit einem Klick auf die Box erfährt man mehr:
Auf einer Karte werden die Störungen als eindeutiges Symbol angezeigt.
Darunter eine Liste mit den Störungen und der Wasserqualität, wenn z.B. bei der Wartung eines Hochbehälters der Chloranteil erhöht werden muss.
Das Hinzufügen oder Löschen einer Störung ist kinderleicht: Einloggen – neue Störung erstellen – Formular ausfüllen – fertig!
Die Darstellung erfolgt Dynamisch:
Wird eine Störung erstellt, erscheint Sie in der Karte und in der Liste, auf der Startseite wird diese automatisch gezählt.
[ Interaktive Karten ]
Für die Darstellung des Versorgungsgebiets wurde eine interaktive Karte gewünscht. Das eingesetzte Kartenmodul ermöglicht es, Marker, Linien und Flächen (Polygone) als Layer auf Google Maps oder OpenStreetMap zu platzieren – inklusive der Möglichkeit, individuelle Bilder anstelle klassischer Marker zu verwenden.
Im Gegensatz zu einer rein grafischen Lösung lassen sich so Standorte positionsgenau und dynamisch eintragen. Beim Klick auf einen Marker oder eine Fläche öffnet sich ein Popup-Fenster, das kurze Informationen zeigt und optional auf eine Detailseite weiterleitet.
Ergänzend dazu werden die Inhalte unterhalb der Karte in einem Karussell dargestellt. Egal ob der Nutzer in der Karte klickt oder im Karussell navigiert – er erhält gezielt weiterführende Informationen zum gewählten Punkt.
[ Aktuelles / Presse ]
Der Bereich Aktuelles / Presse wurde als dynamischer Content-Bereich umgesetzt. Aktuelle Mitteilungen erscheinen sowohl auf der Startseite als auch gesammelt auf einer Archivseite.
Die Beiträge werden in einem modernen, übersichtlichen Layout dargestellt und lassen sich nach frei definierbaren Kategorien filtern. Pressemitteilungen und Bildmaterial stehen zum Download bereit, sodass Redaktionen die Inhalte der Stadtwerke direkt übernehmen können.
[ Benutzerfreundliche Suche ]
Ein zentraler Bestandteil der Website ist die intuitive und benutzerfreundliche Suchfunktion.
Per Klick auf das Lupen-Icon öffnet sich die Suche an derselben Stelle wie das Hauptmenü. Bereits während der Eingabe werden relevante Treffer in Echtzeit angezeigt – inklusive Überschrift und kurzem Textauszug.
Die Suche lässt sich auf bestimmte Beitragstypen einschränken, um gezieltere Ergebnisse zu liefern.
Mit einem Klick auf „Alle anzeigen“ gelangt man zur übersichtlichen Ergebnisseite mit sämtlichen Treffern.
[ Barrierefreiheit ]
Barrierefreiheit – 100 % zugänglich für alle
Die Website der Stadtwerke Sinzig ist zu 100 % barrierefrei und erfüllt die Anforderungen der WCAG 2.1 auf Level AA. Dabei wurde großer Wert auf digitale Zugänglichkeit gelegt – von der Konzeption bis zur finalen Umsetzung.
Um dies sicherzustellen, wurde die Seite mit verschiedenen Prüf-Tools getestet – unter anderem auf Kontraste, Tastaturbedienbarkeit, Screenreader-Kompatibilität und die Einhaltung semantischer HTML-Strukturen. Auch skalierbare Schriftgrößen und eine klare, verständliche Navigation tragen zur uneingeschränkten Nutzung bei.
Barrierefreiheit bedeutet nicht nur gesetzliche Verpflichtung, sondern auch echte digitale Teilhabe für alle.
