TYPO3 - Onlineauftritt für die Maschinenfabrik bema

Manchmal ist nicht das Offensichtliche das Problem, sondern im Hintergrund spielen sich die Probleme ab. Mit diesem Anliegen kam die bema Maschinenfabrik, Marktführer im Bereich der Anbaukehrmaschinen, auf uns zu. Bei diesem Projekt zeigte sich leider gleich von Beginn an in vollem Umfang was die Wahl eines falschen Content Management Systems für Auswirkungen auf Verwaltung und Sicherheit einer Website haben kann. Unbekannte und unausgereifte Systeme mit denen sich wenig bis keine Dienstleister auskennen, führen zwangsläufig irgendwann zu Problemen. Spätestens wenn zwingend erforderliche Sicherheitsupdates nicht mehr gefahren werden können, wird es höchste Zeit etwas zu tun.

Nachdem einige Feuer durch kurzfristige Notlösungen auf der alten Website gelöscht werden konnten, haben wir uns direkt daran gesetzt für unseren Kunden eine ganz neue Seite umzusetzen. Hierzu gehörte ein neues Navigationskonzept, inklusive des Neuaufbaus der Produktsortierung, verprobt in diversen Konzeptzeichnungen (Wireframes). Das neue Konzept wurde unter Beachtung verschiedener SEO-Maßnahmen in ein neues, frisches Layout, was außerdem als Grundlage für die neue Print-Linie und den Produktkatalog dienen soll, gegossen. Um das Ganze auch technisch abzurunden, hat die neue bema Website natürlich ein neues CMS erhalten – mit einem modernen und etablierten TYPO3 ist nun die Seite bestens versorgt. Als kleine Kirsche on top, hat die bema Maschinenfabrik von uns ebenfalls einen Global Admin erhalten.

Konzept und Entwicklung des neuen Webdesigns

Zu Beginn der Konzeptionsphase haben wir für unseren Kunden bema eine kurze Ist-Analyse der aktuellen Website vorgenommen. Hierbei wurde schnell klar, dass insbesondere die Benutzerführung innerhalb des Navigationssystem sowie eine gute Benutzerfreundlichkeit der Seite gewisse Mängel aufweist. Im ersten Schritt haben wir also ein neues Navigationskonzept erarbeitet. Gemeinsam mit dem Kunden stellte sich schnell heraus, dass die verschiedenen Maschinentypen nach bestimmten Kategorien vorsortiert werden müssen, damit der Nutzer über das Menü schnell zu seinem Wunschprodukt findet. Auf der alten Website war es so, dass der Besucher nur über einen Produktfinder zum Produkt finden konnte. Über das neue Navigationskonzept wollten wir ermöglichen, dass der Nutzer auch über das Hauptmenü zu seinem Wunschprodukt gelangt und dabei einen vollen Überblick über das Produktsortiment erhält. Die Produktkategorien nach Anwendungszweck gewähren dabei eine einfache Übersicht und eine gute Orientierung innerhalb des Hauptmenüs. Versteckte Untermenüpunkte, die nur über den Besuch der Unterseiten erreichbar waren, wurden gleich ersichtlich in das Hauptmenü aufgenommen. Ein wichtiges Beispiel ist hierbei der Karrierebereich. Jobangebote können nun direkt über das Menü angesteuert werden.

Nachdem die Informationsstruktur der Seite festgelegt war, wurden entlang dieser die Wireframes von uns angefertigt. Hierbei wurde darauf geachtet, dass insbesondere die Bereiche mit einer schlechten Benutzerfreundlichkeit verbessert wurden und neue Bereiche konzeptionell vordefiniert wurden.

Wunschgemäß sollte das neue bema Maschinenfabrik Layout zeitlos, modern und dabei unaufdringlich mit klarer Linie gestaltet sein – ganz nach dem Leitspruch der Firma „Sauber auf der ganzen Linie“. Das neue Design der Website dient fortan auch als Grundlage für das neue Printdesign der Produktbroschüre. Natürlich wurde die Hausfarbe orange akzentuell zur Hervorhebung wichtiger Bereiche genutzt. Als besonderes Gestaltungselement, haben wir uns der markanten Linienführung innerhalb des Logos bedient. So findet sich neben jeder Headline eine vom Seitenrand beginnende orange Linie. Sie nützt neben der gestalterischen Untermalung auch einer besseren Gliederung und somit einer besseren Orientierung auf der Seite. Da sich die bema Maschinenfabrik bei der Erstellung ihres Bild- und Videomaterials besonders viel Mühe gibt, haben wir uns nicht gescheut, auf der gesamten Seite großflächiges Header Bild- und Videomaterial einzusetzen. Durch Überlappungen von Contentelementen und Platzierungen von Bildern außerhalb des gewöhnlichen Rasters, wurde eine gewisse Dynamik und Modernität auf der Seite integriert. Um jederzeit einen Schnellzugriff auf das Hauptmenü zu gewähren, hat die Seite einen sogenannten „sticky Header“. Dieser erscheint beim Herunterscrollen und wechselt dabei automatisch in die mobile Ansicht. Über ein Burger-Menü sind alle Inhalte jederzeit erreichbar und wirken dabei aufgrund der dezenten Präsentation nicht ablenkend vom Inhalt.

Technische Umsetzung in TYPO3 mit dem Global Admin

Wie bereits erwähnt, war die alte Website technisch in einem nicht mehr handelbaren Zustand. Das neue TYPO3-System bietet unserem Kunden nun ein deutlich einfacher zu bedienendes System bei deutlich freieren Gestaltungsmöglichkeiten. Eine klar gegliederte Systemumgebung schafft Platz für Ordnung und strukturiertes, effizientes Arbeiten. Als gewinnbringende Erweiterung spielt der Global Admin für die bema Maschinenfabrik eine entscheidene Rolle. Sämtliche Produktdaten werden über unser inhouse entwickeltes Verwaltungssystem dirigiert. Damit existiert nun eine zentrale Datenbank in der sämtliche Daten zu den jeweiligen Produkten eingespeist und bearbeitet werden können. Im Frontend der Website steht dem Nutzer die Möglichkeit eines Produktblatt-Exports zur Verfügung, somit können die aktuellen Datensätze aus der Datenbank / Webansicht per PDF zu Verfügung gestellt und heruntergeladen werden.

Schon auf der alten Website gab es einen Produktfinder. Dieser wurde von uns konzeptionell stark überarbeitet, sodass eine deutlich höhere Benutzerfreundlichkeit gewährleistet werden konnte. Über verschiedene Parameter, beispielsweise den Anwendungszweck und/oder das Trägerfahrzeug findet der Nutzer direkt zum passenden Produkt. Kontextsensitive Eingabefelder realisieren ein positives Nutzererlebnis, indem immer eine valide Eingabe gemacht werden kann. Der Nutzer erhält immer ein Ergebnis zu seiner Suche. Diese Ergebnisliste kann manuell um die technischen Daten des jeweiligen Produkts ergänzt werden und als PDF exportiert werden. So hat der Kunde alles auf einen Blick und kann hiermit seine Auswahl direkt mit bema oder seinem Handelspartner besprechen. Neben den nutzerrelevanten Optionen mit dem Global Admin, bringt eine Datenverwaltung der eingegangenen Kontaktanfragen im Backend einen deutlichen Mehrwert für bema. Sämtliche Kontaktanfragen, Bewerbungen und Presseanfragen laufen im Global Admin auf. Diese Liste an Daten kann exportiert werden, sodass der aktuelle Bearbeitungsstand jederzeit nachvollzogen und überprüft kann. Für das Exportformat stehen mehrere Möglichkeiten zur Auswahl, die Liste kann beispielsweise als PDF, Excel oder CSV-Datei ausgegeben werden.

Wir sind glücklich, wenn unsere Kunden es sind. Wir freuen uns über ein weiteres, erfolgreiches Projekt und einen zufriedenen Kunden. Wir sind gespannt auf die kommenden Innovation der bema Maschinenfabrik und blicken positiv auf weitere gemeinsame Projekte.

#Customizing | #TYPO3 | #MobileMenu | #Webdesign | #Service-Level |#Internetagentur