Umstellung von über 10 Websites verbundener Unternehmen der Kashiwabara-Gruppe auf Cloudflare / microCMS

Zentralisierung von Sicherheit und Betrieb bei Beibehaltung der unterschiedlichen Website-Strukturen

Wir haben die Infrastruktur für über 10 Websites des Kashiwabara-Konzerns und seiner Konzerngesellschaften auf Basis von Cloudflare als gemeinsamer Plattform neu aufgebaut.
Innerhalb der Gruppe gibt es mehrere Websites mit unterschiedlichen Zielen und Betriebsstrukturen, etwa Unternehmensseiten, Markenseiten, Karriereseiten und Kampagnenseiten.
Im Projekt wurden nicht alle Websites einheitlich auf dieselbe Technologie umgestellt. Stattdessen wurden DNS, Sicherheit, Auslieferung und Monitoring unter Cloudflare zusammengeführt, wobei der jeweilige Aufbau und die Betriebsweise jeder Website berücksichtigt wurden.

Bei den zentralen Unternehmens- und Markenseiten haben wir das Frontend mit Astro und microCMS neu entwickelt. Damit verbinden wir eine stärkere Governance für den gesamten Konzern mit einem flexiblen Betrieb, der auf die jeweilige Website abgestimmt ist.

Hintergrund des Projekts

Mit der Expansion der Gruppe und dem Ausbau ihrer Markenpräsenz ist die Zahl der Websites sowie die Menge an Videos, Bildern und weiteren Inhalten gestiegen. Da die Websites zu unterschiedlichen Zeitpunkten mit verschiedenen Technologien und Betriebsstrukturen entstanden sind, ergaben sich folgende Herausforderungen:

  • Server- und DNS-Verwaltung sind je nach Website auf unterschiedliche Anbieter verteilt.
  • Sicherheitsmaßnahmen und Wartungsprozesse unterscheiden sich von Website zu Website.
  • Durch den Anstieg hochauflösender Videos und Bilder steigt die Last bei der Auslieferung.
  • Mehrere Beteiligte, darunter externe Dienstleister, betreiben jeweils eigene Umgebungen.
  • Updates für Betriebssysteme und Middleware sowie Störungsüberwachung verursachen laufend Wartungskosten.
  • Der Überblick über alle Websites der Gruppe ist nur schwer zu gewinnen.

Ein bloßer Serverumzug würde diese Herausforderungen nicht lösen. Deshalb haben wir die Infrastruktur für über 10 öffentliche Websites des Kashiwabara-Konzerns und seiner Konzerngesellschaften auf Basis von Cloudflare als gemeinsamer Webinfrastruktur neu aufgebaut.

Migrationsdesign ohne einheitliche Struktur für alle Sites

Bei der Konsolidierung der Gruppenwebsites hätte die Umstellung aller Websites auf dasselbe CMS oder dasselbe Framework erhebliche Auswirkungen auf bestehende Betriebsabläufe und die Zusammenarbeit mit externen Dienstleistern gehabt. Wir haben daher die Rolle, Aktualisierungsfrequenz, Verantwortlichkeit und künftige Weiterentwicklungsplanung der einzelnen Websites analysiert und für jede Website den passenden Migrationsansatz gewählt.

Gesamtablauf des Migrationsdesigns

  1. Analyse von Aufbau, DNS, Servern, CMS und Betriebsstruktur der Konzern-Sites
  2. Strukturierung von Rolle, Aktualisierungsweise und zuständigen Dienstleistern je Site
  3. Einteilung in Sites, die modernisiert werden, und Sites, deren bestehender Aufbau erhalten bleibt
  4. Neugestaltung der Hauptsites mit Astro und microCMS
  5. Sites mit bestehendem CMS werden von den Hauptsites getrennt betrieben
  6. DNS und Netzwerkrouting aller Websites werden in Cloudflare zusammengeführt
  7. Sicherheitseinstellungen und Überwachungsmethoden werden in einer gemeinsamen Richtlinie für die Unternehmensgruppe vereinheitlicht
  8. Die Umstellung erfolgt schrittweise und mündet in einen Betrieb mit anschließender Überwachung nach der Veröffentlichung

Dabei berücksichtigen wir die individuellen Anforderungen der einzelnen Websites und schaffen mit einer übergeordneten, auf Cloudflare basierenden gemeinsamen Infrastruktur die nötige Flexibilität bei gleichzeitiger zentraler Steuerung.

Ablaufdiagramm

Aufbau einer gemeinsamen Infrastruktur auf Cloudflare

Die DNS-Verwaltung und der Netzwerkverkehr von mehr als 10 Websites wurden bei Cloudflare zusammengeführt.
Auch wenn die Server und CMS der einzelnen Websites unterschiedlich sind, lassen sich durch die einheitliche Anbindung an das Internet über Cloudflare Sicherheits- und Auslieferungsrichtlinien für die gesamte Gruppe leichter umsetzen.

Zentralisierung der DNS-Verwaltung

Die DNS-Verwaltung, die zuvor auf die einzelnen Websites verteilt war, wurde bei Cloudflare zusammengeführt.
Die Konfigurationen aller Domains lassen sich nun übergreifend überblicken, und die Betriebsgrundlage ist so aufgebaut, dass Websites einfacher hinzugefügt, migriert und angepasst werden können.

Inhaltsauslieferung über CDN

Statische Dateien wie Bilder, Videos, CSS und JavaScript werden über das Netzwerk von Cloudflare ausgeliefert, wodurch die Last auf den Ursprungsservern reduziert wird.
Für Websites mit umfangreichen Rich-Content-Elementen wurde so eine Auslieferungsbasis geschaffen, die eine stabile Darstellung gewährleistet.

Einheitliche Sicherheitsrichtlinien

Cloudflare wurde jeweils vor den einzelnen Websites platziert, sodass Sicherheitsfunktionen wie WAF und DDoS-Schutz genutzt werden können.
Anstatt sich allein auf die einzelnen Server zu stützen, wird der Datenverkehr über einen gemeinsamen Zugangspunkt für die gesamte Gruppe gesteuert, wodurch die zuvor website-spezifischen Sicherheitsmaßnahmen einheitlich umgesetzt werden können.

Entwicklung gemeinsamer Astro × microCMS-Komponenten und Ausrollung auf mehrere Websites

Bei zentralen Unternehmens- und Markenwebsites haben wir Astro und microCMS eingesetzt und so das Frontend sowie die Inhaltsverwaltung erneuert.

Anstatt für jede Website eine eigene Umgebung von Grund auf neu aufzubauen, haben wir Implementierungen und Einstellungen, die sich über mehrere Websites hinweg nutzen lassen, strukturiert und auf Basis von Astro gemeinsame Komponenten entwickelt. Auf dieser Grundlage wurden Design, Inhalte und benötigte Funktionen für jede Website individuell umgesetzt.

Die Struktur berücksichtigt die Marken und Betriebsrichtlinien der einzelnen Websites und hält Qualität, Wartbarkeit und Entwicklungseffizienz über die gesamte Gruppe hinweg auf einem einheitlichen Niveau.

Gemeinsame Basis bei erhaltener Eigenständigkeit jeder Website

Anstatt alle Websites auf dasselbe Design und dieselben Funktionen zu vereinheitlichen, haben wir lediglich die technische Grundlage gemeinsam genutzt.
Design, Inhaltsstruktur und benötigte Funktionen lassen sich für jede Website separat planen, sodass markenspezifische Gestaltung und Betriebsweise erhalten bleiben und dennoch die Vorteile einer gemeinsamen Basis genutzt werden können.

Ein Frontend, das nur dort arbeitet, wo es nötig ist

Mit der Island-Architektur von Astro wird JavaScript nur dort ausgeführt, wo interaktive Verarbeitung erforderlich ist.
Durch den Verzicht auf JavaScript für die gesamte Seite werden sowohl eindrucksvolle Gestaltung mit Videos und hochauflösenden Bildern als auch schlanke Webseiten ermöglicht.

Inhaltsverwaltung mit microCMS

Für die Inhaltsverwaltung wurde das Headless CMS microCMS eingesetzt.
Durch die Trennung von Frontend für die Darstellung und CMS für die Verwaltung der Informationen lassen sich Design und Funktionen jeder Website flexibel gestalten, während Redakteure Inhalte täglich selbst aktualisieren können.

Eine Basis, die sich leicht weiterentwickeln und warten lässt

Durch die Nutzung gemeinsamer Pakete wurde verhindert, dass sich unterschiedliche Implementierungen und Einstellungen zwischen den Websites unkontrolliert vermehren.
Neue Websites aufzusetzen, bestehende Websites um Funktionen zu erweitern und gemeinsame Bestandteile zu aktualisieren, ist dadurch einfacher, sodass sich mehrere Websites der Gruppe mittel- bis langfristig betreiben lassen.

Zudem wurde die Architektur überwiegend auf statische Auslieferung ausgelegt. Dadurch reduziert sich der Aufwand für die Verwaltung von Betriebssystemen und Middleware, die bisher erforderlich waren. Das Team kann sich so stärker auf die Content-Pflege und die Weiterentwicklung der Websites konzentrieren, statt den Großteil der Ressourcen in Wartungsarbeiten zu binden.

Referenzartikel
https://www.liberogic.jp/topics/20250804-AstroComponent/

Trennung der Umgebungen zur Weiternutzung bestehender CMS

Für Websites wie Recruiting- und Kampagnenseiten, bei denen die Zusammenarbeit mit externen Dienstleistern und die Geschwindigkeit von Aktualisierungen im Vordergrund stehen, werden weiterhin bestehende CMS wie WordPress und Movable Type eingesetzt. Aus Sicherheitsgründen wurden diese Systeme jedoch nicht in derselben Umgebung wie die Hauptwebsites betrieben, sondern Server und Betriebsumgebungen wurden voneinander getrennt.
Sollte es bei einem der CMS oder Server zu einem Problem kommen, lässt sich der betroffene Bereich so leichter eingrenzen.
Die bestehenden Produktions- und Betriebsabläufe bleiben dabei weitgehend unverändert, während das Risikomanagement der gesamten Gruppe gestärkt wird.

Individuelle Websites-Architekturen über Cloudflare verbunden

Die Hauptwebsites und die Websites mit bestehenden CMS werden jeweils in eigenständigen Umgebungen betrieben.
DNS, Kommunikation, Sicherheit und Monitoring werden dagegen über eine gemeinsame, auf Cloudflare basierende Richtlinie gesteuert.

Auf diese Weise bleiben für jede Website passende Technologien und Betriebsstrukturen erhalten, während die gesamte Unternehmensgruppe auf einer einheitlich gesteuerten Web-Infrastruktur basiert.

Ablaufdiagramm

Veränderungen nach der Einführung

Punkt

Vor der Migration

Nach der Migration

Infrastrukturverwaltung

Verwaltung und Aufbau je nach Website verteilt

Zusammenführung auf eine gemeinsame, auf Cloudflare basierende Plattform

DNS-Verwaltung

Einzeln pro Domain verwaltet

Übergreifend über Gruppenseiten verwaltet

Frontend

Architektur mit Abhängigkeit von Servern und CMS

Modernisierung der Hauptseiten mit Astro × microCMS

Content-Auslieferung

Auslieferung zentral über den Origin-Server

Nutzung des Cloudflare-Netzwerks

Sicherheit

Individuelle Lösung pro Website

Struktur, die die Anwendung einheitlicher Richtlinien erleichtert

Zusammenarbeit mit externen Dienstleistern

Nebeneinander unterschiedlicher Umgebungen

Bestehendes CMS als eigenständige Umgebung getrennt

Wartung und Monitoring

Wartung und Betrieb pro Server

Übergang zu einem websiteübergreifenden Monitoring

Verbesserungsmaßnahmen

Erleichtert die Bereitstellung von Ressourcen für Wartung und Betrieb

eine Umgebung, in der sich die Pflege und Verbesserung der Inhalte leichter vorantreiben lässt

Ziel war nicht die „Vereinheitlichung“, sondern die „Konsolidierung“ mehrerer Websites

Im Rahmen dieses Projekts haben wir nicht alle über 10 Websites auf dieselbe Technologie umgestellt, sondern für jede Website einen Aufbau beibehalten, der ihrem Zweck und ihrer Betriebsstruktur entspricht.

Darüber hinaus haben wir Cloudflare als gemeinsame Basis für die gesamte Gruppe eingesetzt und DNS, Datenübertragung, Sicherheit und Monitoring darin zusammengeführt.

Die wichtigsten Websites haben wir mit Astro × microCMS modernisiert, während Websites, die ihr bestehendes CMS weiter nutzen, in eine eigenständige Umgebung ausgelagert wurden. So konnten wir Performance, Betreibbarkeit und Sicherheit in ein ausgewogenes Verhältnis bringen.

Entscheidend für die Erneuerung der Web-Infrastruktur war nicht, verschiedene Websites künstlich anzugleichen, sondern einen Zustand zu schaffen, in dem sich das Gesamtsystem verwalten lässt und dabei die Unterschiede der einzelnen Websites erhalten bleiben.

Ein Projekt, das durch das Verständnis und die Zusammenarbeit des Teams ermöglicht wurde

Das Projekt umfasste über 10 Websites, die während ihres laufenden Betriebs auf eine gemeinsame Plattform migriert wurden. Es war nicht nur technisch, sondern auch in der Abstimmung zwischen den Beteiligten eine äußerst anspruchsvolle Aufgabe.

Dass die unterschiedlichen Zielsetzungen, Betriebsstrukturen und bestehenden Produktionsabläufe der einzelnen Websites geordnet werden konnten und eine zukunftsfähige neue Plattform entstanden ist, verdanken wir dem tiefen Verständnis und der offenen Haltung der Mitglieder der KASHIWABARA-Gruppe, die den Wandel aktiv mitgetragen und das Projekt vorangebracht haben.

Ebenso danken wir der NDC Co., Ltd. für Branding und Kreation sowie der Original Text Co., Ltd. für die Unterstützung bei Gesamtfortschritt und Struktur des Projekts. Außerdem gilt unser Dank allen weiteren beteiligten Unternehmen, die an Erstellung und Betrieb der einzelnen Websites mitgewirkt haben.

Mitglieder mit unterschiedlichen Standpunkten und Fachgebieten brachten ihr jeweiliges Know-how ein und arbeiteten gemeinsam auf das gemeinsame Ziel einer besseren Web-Grundlage hin, während sie die bestehenden Strukturen respektierten. Genau das war eine wesentliche Triebkraft, die dieses Projekt zum Abschluss führte.

Projektverantwortlicher
Original Text Co., Ltd.
Branding & Motion Design
Nippon Design Center Co., Ltd.
Chief Director
Liberogic Inc. Oya
Technical Director
Liberogic Inc. Otsuka
Director
Liberogic Inc. Shigeta
UI/UX-Designer
Liberogic Inc. Nagahashi
Leitender Ingenieur
Liberogic Inc. Futatamata
Frontend-Entwickler
Liberogic Inc. Matsutsuka / Hirabayashi
Projektmanager
Liberogic Inc. Morimoto
Firmen- und Dienstleistungsnamen
Kashiwabara Group

Kashiwabara Group

Die Kashiwabara-Gruppe ist ein Unternehmensverbund, der eine breite Palette von Dienstleistungen rund ums Wohnen anbietet, von Grundstücksentwicklung über Bau, Reparatur und Instandhaltung, Verwaltung und Versicherungen bis hin zu Wohnungsbaufinanzierungen. Unter Nutzung der Stärken der einzelnen Unternehmen wachsen und entwickeln wir uns stetig weiter, um auch in der kommenden Zeit neue Lösungsvorschläge bieten zu können.