digitalwerk icon
B2B Website Relaunch der Group- und Produktseiten der Semperit AG
Image partially created by AI
Website-Relaunch der Semperit Group & Product Websites
16
Aug
2022

Vielseitige Produkte, eine Lösung: Wie der B2B Website Relaunch die Produkte und Lösungen von Semperit in neuem Glanz erstrahlen lassen.

Website-Relaunch der Semperit Group & Product Websites

Mit dem B2B Website-Relaunch wurde neben der verbesserten Auffindbarkeit ein neuer, moderner Look & Feel geschaffen, der die digitale Positionierung von Semperit betont und die Vielseitigkeit der Produkte und Lösungen der Unternehmensgruppe in einem neuen Glanz erstrahlen lassen.

Die Semperit AG Holding

Die börsennotierte Semperit-Gruppe ist ein globaler Hersteller von hochentwickelten und funktionskritischen Polymerprodukten sowie -lösungen. Als systemkritisches Unternehmen erbringt Semperit Leistungen in unterschiedlichsten Industrien. Zu den Produkten gehören Hydraulik- und Industrieschläuche, Fördergurte, Rolltreppenhandläufe, Bauprofile, Seilbahnringe, Handschuhe ebenso wie Produkte für den Eisenbahnoberbau.

Die Zentrale des im Jahr 1824 gegründeten österreichischen Traditionsunternehmens befindet sich in Wien. Weltweit sind rund 7.000 Mitarbeiter*innen, davon rund 3.800 in Asien und rund 900 in Österreich (Wien und Produktionsstandort Wimpassing, Niederösterreich) für das Unternehmen tätig. Zur Gruppe gehören weltweit 15 Produktionsstandorte sowie zahlreiche Vertriebsniederlassungen in Europa, Asien, Australien und Amerika.

Die Anforderungen & Zusammenarbeit

Das Meta-Ziel war die Erstellung einer neuen Website als zeitgemäße Visitenkarte für die Semperit Group und als erweitertes Marketing- und Recruiting Tool mit Launch im ersten Quartal 2022 definiert. Das Projekt wurde im Mai 2021 gestartet. Diesem Meta-Ziel folgend wurde eine Analyse-Phase definiert, mit dem Ziel durch interaktive Workshops mit mehreren Abteilungen von Semperit (von IT zu Product Management und Vertrieb in den Segmenten, bis hin zu HR) einen Product Backlog zu definieren.

Weiters wurde auch ein klares Projektteam mit fixen Ansprechpersonen seitens Semperit und digitalwerk festgelegt. Die Workshop-Reihen wurden eingeteilt in strategische Workshops (z.B. Benchmark-Analysen, aktuelle sowie zukünftige Trends im Marketing, etc.), Design Workshops (grafische Ansätze, Erweiterung der erarbeiteten CI/CD, ...) und technische Workshops (Infrastruktur-Setup, Security Audits, etc.). Neben der Definition der Personas, Conversion Funnels, Analyse von Analytics-Auswertungen sowie Hinterfragen der Website-Navigation wurden in der Analyse-Phase die Projektcontrolling-Werkzeuge für das Projektmanagement festgelegt, für welche die„MTA“ (Meilensteintrendanalyse), eine fortlaufende Risikoanalyse sowie MMR (Monthly Management Reports) zum Einsatz kamen.

Das Ergebnis dieser Analyse-Phase war eine abgestimmte digitale Strategie sowie ein digitales Ökosystem, das mit dem Projekt geschaffen werden soll. Es wurde festgelegt, nicht nur die Group Seite, sondern auch alle Segment-Webseiten zu relaunchen (Product Category Sites). Zur Stärkung der Masterbrand und des einheitlichen Auftritts wurden die Bezeichnungen der einzelnen Industriesegmente – Semperflex, Sempertrans, Semperform, Semperseal – unter der Marke Semperit zusammengeführt werden.

Aufteilung der Seitenstruktur des B2B Websiterelaunches von Semperit in eine Group und fünf Product Category Websiten.

Die Group Seite beinhaltet sämtliche relevanten Informationen über das international tätige Unternehmen. Der User erfährt beim Besuch der Group-Seite alles Wissenswerte zu Semperit, seinen Industrien, den Produktwelten, aktuellen Unternehmensnachrichten, sowie Investor Relations, Nachhaltigkeit und Karriere. Die einzelnen Produktwelten werden kurz dargestellt und verlinken zu den eigens erstellten Product Category Sites.

Während das Ziel der Group Webseite die Repräsentation des Unternehmens ist, steht bei den Product Category Sites die Verkaufsunterstützung und somit der Kontakt mit den entsprechenden Zielgruppen im Vordergrund. Im Zuge mehrerer Konzeptions-Workshops mit den einzelnen Segmenten ergaben sich in Absprache mit den Vertriebsverantwortlichen sowie Produktmanagern produktspezifische Anforderungen (z.B. Darstellung der Produktdetailseiten, gewünschte Download-Materialien, usw.).

Die Group Webseite soll die einzelnen Produktkategorien und Industrien des Unternehmens Semperit vorstellen. Möchte sich ein User intensiver mit einer Produktkategorie (z.B. Hoses) auseinandersetzen, so bieten wir dieser Person die Möglichkeit, beispielsweise in die Produktwelt ‚Hoses‘ (Schläuche) einzutauchen.
Der Fokus dieser Sparte liegt in der Generierung von Leads. Wichtige Conversions in diesem Zusammenhang sind z.B. die Kontaktaufnahme, der Download von Produktblättern oder die Newsletter-Anmeldung.

Es wurden folgende Produktkategorien definiert: Hoses, Conveyor Belts, Sealings, Smart Polymer Solutions, Gloves
Über diese Produktkategorien hinweg wurde ein Conversion Funnel entwickelt, der das gesamte digitale Ökosystem abdeckt:

Digitales B2B Ökosystem für Semperit AG Holding

Seit dem Sommer 2021 nutzt Google einen neuen Bewertungsmechanismus. Dieser indexiert vorrangig mobile Versionen. Mit diesem Update von Google wird der Ranking-Faktor von Webseiten neu bewertet. Dies wirkt sich unmittelbar auf die Ergebnisseiten der Google Suche. Dieser Ranking Factor heißt „Core Web Vitals“. Durch diese neuen Messwerte werden User Experience und Userfreundlichkeit nochmals deutlich in den Vordergrund gerückt. Es werden 3 Werte herangezogen: Ladezeit, Interaktivität und visuelle Stabilität. Die bisherigen Webseiten der Semperit Group waren mobil noch nicht optimiert.

Mit dem Relaunch der neuen Seite soll neben der Auffindbarkeit in Google ein neuer, moderner Look & Feel der Webseite die digitale Positionierung der Marke betonen. Ebenso soll die Strukturierung der Webseiten-Inhalte gemäß der Zielgruppe erfolgen. Aus diesem Grundgedanken heraus wurde die Differenzierung der Group-Webseite auf Repräsentations-Ebene (= Visitenkarte des Unternehmens) gegenüber den Segment-Webseiten (= Product Category Sites) herausgearbeitet. Die Group Webseite soll v.a. Unternehmensinformationen und den Karrierebereich darstellen sowie Synergien durch Weiterverlinkungen zu der Produkt-Ebene/ Sales-Ebene schaffen. Wichtig in diesem Zusammenhang ist das Tracking, sprich die Messbarkeit.
Der Content (Text und Fotos) soll in deutscher und englischer Sprache für alle Segmente sowie der Gruppe überarbeitet und suchmaschinenoptimiert verfasst werden.

Das Ergebnis

Im Zuge der rund dreimonatigen Analyse-Phase wurden neben der Erhebung der Zielgruppen-Needs sämtlicher Content (rund 3.000 Content Seiten) von SEO Expert*innen gemeinsammit Semperit analysiert.
Gut und zeitgemäß aufbereiteter Content war in diesem Projekt eines der zentralen Kernthemen und dient zur klaren Informationsvermittlung für die Zielgruppen. Informationen sollen verständlich und logisch präsentiert werden, sodass die Inhalte auch für weniger involvierte User nachvollziehbar sind. Neben den gegebenen Anforderungen an die Textqualität  ist eine sinnvolle Gliederung des Textes sowie die richtige Verwendung von Keywords notwendig. Guter Content zeichnet sich durch gezielt eingesetzte und vor allem im Hinblick auf die Suchmaschinenoptimierung relevante Keywords aus. Beim Support für die Keyword-orientierte Content-Erstellung geht es darum, den von den Semperit-Fachbereichen vorbereiteten Text durch eine auf SEO spezialisierte Copy-Writer*in zu überarbeiten. Dadurch sollen unterschiedliche Schreibweisender einzelnen Personen vereinheitlicht und der Text suchmaschinenoptimiert werden und der Text wirkt aus 'einem Guss'. Durch diese Maßnahme wird u.a. Duplicated Content vermieden, die Textlängen geprüft sowie Meta-Descriptions mit korrekten Textlängen für relevanten Seiten erstellt.

Auch die Gestaltung der einzelnen Webpages (Design) hat einen wesentlichen Einfluss auf das Ranking einer Webseite. Im Zuge des menschenzentrierten Gestaltungsprozesses wurden gemeinsam mit dem Auftraggeber-Projektteam sämtliche Nutzungsanforderungen erhoben. Aufgrund der COVID Situation fanden zahlreiche Konzeptionsworkshops (konzeptionelles Design) über MS Teams statt. Als Werkzeug für die Skizzierung der User Journey wurde das Tool Miro eingesetzt. Nach Skizzierung des Ablaufes in Miro wurden Wireframes mit dem Fokus auf Usability erstellt. Nach Abschluss der Konzeptionsphase und den definierten Zielgruppen-Beschreibungen wurden Screendesigns umgesetzt. Diese Design-Templates wurden anhand mehrerer Usability Tests mit definierten Zielpersonen getestet. Ergebnisse der Tests wurden in Testprotokollen festgehalten sowie in die Screendesigns eingearbeitet. Ziel ist es, die User Experience maximal zu erhöhen. Weitere Screendesigns findest du in unserem Case.

Product Category Seite des B2B Website Relaunches von Semperit durch digitalwerk

Zur Performance der Webseite fanden diverse Testings statt. digitalwerk hat ein dezidiertes Development-Team, bestehend aus einem Senior Frontend- und einem Senior Backend-Developer eingesetzt. Es fanden wöchentliche Sprints statt, in denen in JIRA definierte Stories abgearbeitet wurden. Zusätzlich gibt es auch im Development einen eigenen Meilensteinplan (Roadmap).

Zur Versionierung und maximaler Transparenz wurde GitLab (selbstgehostet) genutzt. Für die lokale Entwicklung wurde Docker eingesetzt. Der Vorteil dieser Maßnahme ist, dass jeder Developer dieselbe Arbeitsumgebung hat. Der Code wurde stets vor der Übertragung auf das Testsystem reviewed. Reviews fanden wöchentlich statt. Die Website inklusive aller Bestandteile wurde nach den aktuellsten Sicherheitsstandards programmiert und überprüft. Es wurden automatisierte Tools zur Überprüfung und Validierung des Coding-Standards eingesetzt. Um dies zu erreichen hat digitalwerk die ToolsPHP_CodeSniffer, ESLint sowie SassLint genutzt.

Vor Live Gang des Projekts fand eine ausführliche Sicherheitsüberprüfung der Webseite sowie des Hosting-Servers durch einen unabhängigen Auditor (Solv01Technologies GmbH) statt. Dieses Audit ermöglichte (teils automatisiert) kritische Codestellen zu identifizieren. Diese Maßnahmen hatten vorrangig das Ziel fehlerfreies und SEO-optimiertes HTML5 zu erzeugen. Dies ist eine absolute Voraussetzung, damit die Website gleichmäßig und problemlos in allen Browsern dargestellt werden kann. 

Ein Highlight dieses Projekts war die gewählte Projektmanagement-Methodik aus einer Kombination von Scrum und IPMA. Trotz agiler Methodik gab es feste Meilensteine. Diese Vorgehensweise wurde in der Analyse-Phase gemeinsam mit Semperit festgelegt. In einem Kick-Off Meeting wurden zentrale Meilensteine mit dem Auftraggeber vereinbart und besprochen, welche Arbeitspakete sowie Meilensteine bis zu einem bestimmten Termin zu erreichen sind. Diese Herangehensweise ermöglichte es, das Projekt in eine Struktur zu bringen und die einzelnen Projektressourcen sowohl Auftragnehmer- als auch Auftraggeber-seitig in einem gemeinsamen Ressourcenplan (Projektkalender) zu verwalten.

Sobald die Meilensteine definiert waren, wurde darauf aufbauend die Meilensteintrendanalyse (MTA) aufgesetzt. Dies ist ein wichtiges Instrument im Projektcontrolling, das einen aktuellen Überblick über den Projektstatus schafft und gleichzeitig das Erkennen frühzeitiger Terminabweichungen sowie positiver und negativer „Trends“ im Projekt bezüglich Terminen ermöglicht. Dadurch hat das Projektteam die Möglichkeit, rechtzeitig Maßnahmen einzuleiten, um Problemen im Projekt entgegenzusteuern.

digitalwerk wurde somit mit einem fixen Budget und einem fixen Zeitwunsch des Go-Live Termins für das MVP beauftragt. In den ersten Sprint-Meetings wurde gemeinsam mit dem Auftraggeber ein Product Backlog erstellt und dieser im Anschluss nach Must-Have und Nice-to-Have Features kategorisiert. Ziel war es alle Must-Have Features bis zum Go Live Termin umgesetzt zu haben. Ein Burn-Down-Chart half uns die Menge an User Stories zu überwachen und zu erkennen, wie viele User Stories von Woche zu Woche bearbeitet werden konnten, wie viele noch offen sind und auch, ob neue User Stories dazu kamen.

Das Projekt wurde von einem zertifizierten Senior Projektmanager geleitet und in 3 Hauptphasen eingeteilt:

  • Vorbereitungsphase (Ziel = Festlegung der Sprints, Priorisierung der Features innerhalb der Product Backlogs, erste Wireframes und Designs),
  • Umsetzungsphase (Ziel = wöchentliche Sprints mit Development und Content-Teams) sowie
  • die Abschlussphase (Ziel = Finale Audits, Quality Assurance, Go Live des MVPs).

Weitere Screendesigns findest du in unserem Case.

Let’s get physical, or keep it digital:
Get in touch