Case Study · Hafenmanagementgesellschaft

Ein Hallenplan, vier Auftritte, ein Intranet.

Die HFM Frankfurt betreibt drei öffentliche Häfen, 50 km Bahninfrastruktur, die städtischen Märkte und die Kleinmarkthalle. Was 2021 als Umzug von Craft CMS auf TYPO3 begann, ist heute eine betreute Plattform: hfm-frankfurt.de, kleinmarkthalle.com, eine eigene Jobbörse und ein Intranet, das im Haus läuft.

  • CMS-Migration
  • Interaktiver Hallenplan
  • Relaunch
  • Barrierefreiheit

Die Ausgangslage

Ein CMS, das die Redaktion ausbremste.

Die Websites der HFM wurden ehemals mit Craft CMS umgesetzt. Da die Redakteure die Bearbeitung der Inhalte mit diesem CMS jedoch als kompliziert empfanden, sollte das Projekt auf TYPO3 umgezogen werden.

Vorherbis 2021 · Craft CMS

Ein System, in dem die Redaktion nicht gern arbeitete

Zwei Websites, technisch in Ordnung, aber im Alltag zäh. Der Auslöser für das Projekt war nicht die Technik, sondern das Backend.

   ×  Pflege der Inhalte als kompliziert empfunden

   ×  Ein Layout, das jeder Seite gerecht werden musste

Nachherab 2021 · TYPO3

Ein Backend, aus dem alles Weitere entstand

Beide Websites auf TYPO3 v10 umgezogen, das Design 1:1 übernommen. Danach kamen Jobbörse, Relaunch und Intranet dazu — auf derselben betreuten Plattform.

  • 15 Backend-Layouts für 15 Seitentypen
  • Hallenplan komplett im Backend editierbar
  • Neu programmierte Content-Elemente

HFM Frankfurt

Die HFM unterstützt die regionale Attraktivität in der Entwicklung und Realisierung logistischer Konzepte unter Berücksichtigung der Verkehrsträger Binnenschiff und Bahn. Außerdem organisiert sie die städtischen Märkte von Frankfurt, darunter die bekannte Kleinmarkthalle.

Vier Geschäftsbereiche unter einem Dach: Hafen, Bahn, Märkte und Immobilien. Die HFM betreibt drei öffentliche Häfen sowie 50 km Bahninfrastruktur.

HafenBahn Märkte Immobilien Kommunal

Der Auftrag

Vier Geschäftsbereiche, eine Codebasis.

Der Auftrag begann eng geschnitten: zwei Websites vom alten CMS auf TYPO3, Design unverändert übernehmen. Dass daraus über die Jahre eine Plattform mit drei öffentlichen Auftritten und einem Intranet wurde, war 2021 nicht geplant, sondern ist Schritt für Schritt entstanden.

Die Anordnung der Content-Elemente ist auf jeder Seite unterschiedlich. Wir haben uns daher für spezifische Backend-Layouts entschieden, welche diese Anforderung möglich machen — 15 Stück für 15 verschiedene Seitentypen.

Dass die beiden Seiten zusammengehören, ist zum Beispiel an der ähnlich gestalteten Navigation zu erkennen. Sie teilen sich bis heute eine Codebasis.

Ein Hallenplan, den die Redaktion selbst pflegt.

Die Kleinmarkthalle bietet online eine Übersicht über alle Stände und Händler. Der Nutzer kann sich weitergehende Händlerportraits anschauen — mit einer kurzen Zusammenfassung, einem Foto und einem Interview. Im Backend haben wir das über das News-Modul mit verschiedenen Kategorien umgesetzt. Redakteure können darüber nicht nur neue Händler anlegen, sondern diesen auch den Händlerplatz zuordnen, sodass sie im Plan sichtbar sind.

Der Aufbau

Drei Auftritte nach außen, einer nach innen.

Alle vier laufen auf derselben Codebasis. Der Unterschied liegt nicht in der Technik, sondern darin, wer sie sehen soll.

Unternehmensauftritt

hfm-frankfurt.de

Hafen, Bahn, Märkte und Immobilien unter einem Dach. Mit News, Standortübersicht, Ansprechpartnern und der Flohmarktanmeldung.

Markthalle

kleinmarkthalle.com

Eigener Auftritt mit Hallenplan, Händlerportraits, Gastronomie und einem eigenen Bereich zur laufenden Sanierung.

Jobbörse

hafenjobs

Eigenständiger Recruiting-Auftritt unter eigener Subdomain — für die Unternehmen im Frankfurter Hafen, mit Arbeitgeberprofilen und Stellenangeboten.

Intern

Intranet

Nutzt die bestehende TYPO3-Website als Basis und läuft auf einem eigenen Server bei der HFM. Redaktion und Komponenten sind dieselben wie außen.

on premise · kein öffentlicher Zugang

Unsere Leistungen im Detail

Woran man die Arbeit sieht.

Erst der Umzug und das redaktionelle Fundament, später Relaunch, Barrierefreiheit und der interne Bereich.

 

Die Migration

01 - Backend

15 Layouts für 15 Seitentypen

Die Anordnung der Content-Elemente ist auf jeder Seite unterschiedlich. Statt ein Universallayout zu bauen, das überall halb passt, gibt es je Seitentyp ein eigenes.

  • 15 spezifische Backend-Layouts
  • Redaktion sieht nur, was zur Seite passt
02 - Content-Elemente

Standardelemente neu programmiert

Über die Standard-Content-Elemente von TYPO3 hinaus haben wir einige Elemente neu programmiert — etwa die Fact-Elemente oder die Cards für die Ansprechpartner.

  • Fact-Elemente
  • Cards für Ansprechpartner
03 - Design

1:1 in TYPO3 umgesetzt

Das Design der HFM-Website haben wir direkt übernommen, bei der Kleinmarkthalle ebenso. Ein Umzug sollte für die Besucher unsichtbar bleiben — geändert hat sich das Backend, nicht das Frontend.

  • Bestehendes Design übernommen
  • Verwandte Navigation für beide Seiten

Was danach kam

04 - Relaunch

Neues Konzept, neue Navigation, neues Design

Beim Relaunch auf TYPO3 v12 blieb vom Ausgangsprojekt die Codebasis, sonst wenig: Konzept, Navigation und Design wurden neu gemacht — für HFM und Kleinmarkthalle gemeinsam.

  • Neue Informationsarchitektur
  • Versionssprung auf TYPO3 v12
05 - Intranet

Auf Basis der Website, lokal im Haus

Das Intranet nutzt die bestehende TYPO3-Website als Basis und läuft auf einem eigenen Server bei der HFM. Vertrauliche interne Inhalte bleiben im Haus, Redaktion und Komponenten sind dieselben wie außen.

  • On-Premise-Betrieb bei der HFM
  • Eine gemeinsame Codebasis
06 - Formulare

Die Flohmarktanmeldung, schrittweise

Über den Supportvertrag laufen auch Detailverbesserungen. Die Flohmarktanmeldung wurde dadurch nach und nach besser, statt auf ein großes Projekt zu warten.

  • Verbindliche Online-Anmeldung
  • Schrittweise optimiert im Betrieb

Der Verlauf

Jede Station ein eigenes Projekt.

Fünf Vorhaben mit je eigenem Ziel und eigenem Ergebnis. Der Supportvertrag läuft als durchgehendes Band darunter.

Migration

Von Craft CMS auf TYPO3 v10, inklusive Übernahme in Betrieb und Pflege.

Projektstart
Jobbörse

Eigener Recruiting-Auftritt unter eigener Subdomain, auf die Zielgruppe zugeschnitten

2024
Relaunch

Neues Konzept, neue Navigation, neues Design und der Versionssprung auf TYPO3 v12.

2025
Intranet

Auf Basis der Website, auf einem eigenen Server bei der HFM.

2025
Weiterentwicklung

Upgrades bis TYPO3 v13, neue Funktionen, Detailarbeit an den Formularen.

laufend
Durchgehend

Der Supportvertrag aus der Migrationszeit besteht unverändert.

Er deckt nicht nur den Betrieb ab: Versionsupgrades, neue Funktionen und die Optimierung von Formularen laufen darüber — und sind damit die Grundlage für alles, was nach der Migration kam.

seit der Migration

Barrierefreiheit

Nach BITV 2.0 umgesetzt — und ehrlich dokumentiert.

Beide Auftritte wurden im Relaunch nach BITV 2.0 umgesetzt: Kontrastmodus, Leichte Sprache, beschreibende Alternativtexte, tastaturbedienbare Navigation. Dazu liefern wir den Stand mit, den eine öffentliche Stelle vorweisen muss, als Erklärung zur Barrierefreiheit mit Kontaktweg, Prüfgrundlage und einer klaren Liste dessen, woran weitergearbeitet wird. Barrierefreiheit ist ein Zustand, der gepflegt wird, kein Häkchen bei der Abnahme.

Kontrastmodus
umgesetzt
Umschalter für erhöhten Kontrast auf allen Auftritten. Die Einstellung wird gespeichert und gilt beim nächsten Besuch weiter.
Leichte Sprache
umgesetzt
Eigener Bereich, aus der Kopfzeile jedes Auftritts direkt erreichbar.
Alternativtexte
umgesetzt
Beschreibend statt pauschal, auch bei rein dekorativen Motiven.
Erklärung zur Barrierefreiheit
umgesetzt
Mit Kontaktweg für Rückmeldungen und dem Hinweis auf das Durchsetzungsverfahren bei der Landesbeauftragten für barrierefreie IT Hessen.
Karten und Statistik
umgesetzt
OpenStreetMap statt Google Maps, Matomo statt Google Analytics. Die IP-Übertragung an die Kachelserver ist im Consent-Dialog eigens aufgeführt.
PDF-Dokumente
offen
Mehrheitlich noch nicht barrierefrei.
Standorte in der Karte
offen
Die Darstellung der Standorte in der OpenStreetMap entspricht noch nicht vollständig.
Gebärdensprache
im Ausbau
Inhalte in Leichter Sprache und Gebärdensprache werden weiter ausgebaut.

Technik

Was verbaut ist und warum.

TYPO3 v13
Basis
Trägt drei öffentliche Auftritte und das Intranet auf einer Codebasis. Von v10 über v12 im laufenden Betrieb weitergezogen.
15 Backend-Layouts
Redaktion
Ein eigenes Layout je Seitentyp, weil die Anordnung der Content-Elemente auf jeder Seite unterschiedlich ist.
Eigene Content-Elemente
Bausteine
Über die Standardelemente hinaus neu programmiert, etwa Facts und die Ansprechpartner-Cards.
EXT:news
Hallenplan und Meldungen
Trägt zwei Dinge: die Meldungen beider Auftritte und die Händler der Kleinmarkthalle, über Kategorien und die Zuordnung des Händlerplatzes.
Formulare
Anmeldungen
Die Flohmarktanmeldung als verbindliche Online-Anmeldung, im Betrieb schrittweise optimiert.
OpenStreetMap, Matomo
Karten und Statistik
Bewusst ohne Google-Dienste. Für die Karten ist die IP-Übertragung an die Kachelserver einwilligungspflichtig und im Consent-Dialog eigens aufgeführt.
On-Premise-Instanz
Intranet
Eigener Server bei der HFM. Vertrauliche interne Inhalte verlassen das Haus nicht.

Fazit

Aus einem Umzug wurde eine Plattform.

Der Auftrag von 2021 war klein und klar: zwei Websites vom alten CMS auf TYPO3, Design bitte unverändert. Das Ergebnis war ein Backend, mit dem die Redaktion gern arbeitet — und genau daraus ist alles Weitere entstanden: eine Jobbörse, ein vollständiger Relaunch, ein Intranet und die laufende Detailarbeit an den Formularen.

Dass der Versionssprung auf TYPO3 v13 planbar war und kein Risiko, liegt am Supportvertrag aus der Migrationszeit. Wer eine Plattform seit Jahren betreut, kennt ihre Extension-Landschaft und muss vor einem Upgrade nicht erst herausfinden, was verbaut ist.

Solche Besonderheiten wie der Hallenplan lieben wir. Die Websites laufen unter hfm-frankfurt.de, kleinmarkthalle.com und hafenjobs.hfm-frankfurt.de.

Auf einen Blick
Auftraggeber
HFM Frankfurt
Branche
Dienstleistungen
Kunde seit
2021
Vorher
Craft CMS
Migration auf
TYPO3 v10
Relaunch mit
TYPO3 v12
Heute
TYPO3 v13
Auftritte
3 öffentlich, 1 intern
Barrierefreiheit
BITV 2.0 / WCAG 2.1

Ihre Redaktion kämpft mit dem CMS, statt damit zu arbeiten?

Lassen Sie uns besprechen, welche Grundlagen und Informationen dafür wichtig sind. Vielleicht mit einem Kaffee bei uns.

Kontakt

Wir sind für Sie da.

Frankfurt am Main, persönlich, telefonisch oder per Video.

Was Interessenten uns oft fragen.