
Über das Projekt
Für das bhz Stuttgart haben wir 2024 bereits die Karriere-Website von Grund auf neu entwickelt und umgesetzt. Jetzt galt es, die Hauptwebsite in den Fokus zu nehmen und mit neuem Design und neu gestalteten Inhalten fit für die Zukunft zu machen. Als Einrichtung für Menschen mit Behinderungen lag beim bhz ein besonderes Augenmerk auf umfassender Barrierefreiheit, sowohl technisch als auch durch eine Version in Leichter Sprache.
Auf technischer Seite erfolgte die Umsetzung auf Basis von TYPO3. Hierbei wurde das System um verschiedene Repository-Extensions ergänzt. Diese ermöglichen u.a. die komfortable Verwaltung der zahlreichen Standorte und Ansprechpersonen sowie von News- und Termindatensätzen.
Mehr Menschen erreichen dank digitaler Barrierefreiheit
Digitale Angebote für alle zugänglich machen – das war eine der wichtigsten Zielsetzungen beim Relaunch der bhz Website. Für die technisch barrierefreie Umsetzung bildet semantisch korrekter Code und die durchgängige Zugänglichkeit für Screenreader und Tastatursteuerung die Basis. Zusätzliche Unterstützung erhalten eingeschränkte User u.a. mit einem Kontrastmodus, der Inhalts- und Navigationselemente mit optimierten Kontrasten darstellt.
Redaktionell herausfordernd ist oft die lückenlose Hinterlegung von Alternativ-Texten bei Bildern. Um dies auch für die Zukunft zu vereinfachen, setzten wir eine KI-Lösung per Extension um; hierdurch lassen sich auf Knopfdruck Alternativ-Texte generieren, die bei Bedarf manuell nachbearbeitet werden können.
Ein besonderes Anliegen war im Rahmen der Barrierefreiheit, eine Website-Version in Leichter Sprache umzusetzen. Technisch ermöglichten wir dies durch die Konfiguration als TYPO3-Sprache. Das bietet zwei große Vorteile: Die User können im Frontend unkompliziert zwischen den Versionen hin- und herschalten. Die Redakteur:innen können die Seiten im TYPO3-Backend als Übersetzungen pflegen. So bleiben die Strukturen jederzeit durchsichtig und nachvollziehbar. Für die Erstellung der Texte in Leichter Sprache nutzen wir eine KI-Lösung, um Basistexte zu generieren. Im zweiten Schritt optimierten wir diese manuell und pflegten sie im TYPO3-Backend ein.
Design: Moderne Präsentation ohne Barrieren
Eine Website barrierefrei gestalten, ohne dabei auf ein modernes und lebendiges Design zu verzichten? Ja, das geht! Unser Team entwickelte ein kreatives Designkonzept, das die Werte des bhz erfasst und optisch erfahrbar macht. Wrapper mit geschwungenen Linien oder der Dreiklang der Logo-Farben, der in Cards und Icons aufgegriffen wird – Design-Elemente wie diese spiegeln wider, was das bhz ausmacht: Vielfalt, Offenheit und Wertschätzung für alle Facetten des Lebens. Eine Atmosphäre, in der alle willkommen sind, genau so, wie sie sind. Die Konzipierung und Umsetzung ging dabei Hand in Hand mit der barrierefreien Gestaltung. Eine ausreichend große Typographie und Weißräume sorgen für Übersichtlichkeit und unterstützen die Orientierung.
Neue Textinhalte für den roten Faden
Im Rahmen des Relaunchs hatte man sich zum Ziel gesetzt, die Web-Texte in weiten Teilen neu zu konzipieren und zu modernisieren. Mit dieser Aufgabe betraute das bhz unser Team. Im Rahmen des Workshops zum Projektstart hatten wir das Strukturkonzept bereits gemeinsam herausgearbeitet. Im Projektverlauf verwandelte unser Team schließlich Rohinformationen in moderne Webinhalte, die die sehr unterschiedlichen Zielgruppen des bhz ansprechen und dem breiten Angebotsspektrum der Einrichtung gerecht werden.
Funktionen digitalisieren, Workflows vereinfachen
Ein neues System bietet neue Möglichkeiten. So wurde die Chance genutzt, per Extension einen Veranstaltungskalender inklusive Anmeldungsfunktion zu implementieren. Die Website-User können sich nun unkompliziert online für Veranstaltungen des Familienentlastenden Service anmelden. Die Mitarbeitenden des bhz wiederum können die Anmeldungen komfortabel im TYPO3-Backend verwalten. Auch die Anmeldung zum Print-Newsletter ist jetzt per Online-Formular möglich. Um das digitale Fundraising voranzutreiben, integrierten wir nahtlos ein Fundraising-Tool ins TYPO3-System. Und das Team vom Leistungsbereich Catering freut sich über ein modernes, mehrschrittiges Bestellformular, das ihm die Arbeit erleichtert.
Im Zuge des Relaunchs integrierten wir auch die Website des vom bhz betriebenen Bistro CUBE als Microsite ins TYPO3-System - zuvor war sie in einem nicht mehr aktuellen WordPress-System gepflegt worden. Damit sind sowohl die Pflege als auch die Wartung und Weiterentwicklung in einem einzigen System vereinfacht und zukunftsfähig aufgestellt.
Mit dem Relaunch präsentiert sich das bhz nun mit einem modernen und barrierefreien Webauftritt, der dem Angebot und dem Anspruch der Einrichtung gerecht wird. Dank umfassend barrierefreier Umsetzung ist die Website nun auch für Menschen mit Behinderung als Hauptzielgruppe deutlich zugänglicher. Und auch Angehörige der Klient:innen, Spender:innen oder Geschäftskunden dürfen sich über neue Funktionen und Inhalte freuen.
Screenshots
Impressionen des Projekts

bhz Stuttgart e.V.
Stuttgart
Das bhz Stuttgart e.V. ist eine diakonische Einrichtung für Menschen mit Behinderung. Über 200 Mitarbeitende engagieren sich täglich an 18 Standorten im Raum Stuttgart, um mehr als 450 Menschen auf vielfältige Weise zu unterstützen.
















