Das Update der Seite wird an einer Kopie der Webseite auf einem Entwicklungsserver durchgeführt. Dadurch ist der Betrieb der vorhandenen Webseite auch während des Updates gewährleistet. Damit es bei Aktualisierungen während des Updates nicht zu Überschneidungen kommt, legen wir gemeinsam mit dem Auftraggeber ein Zeitfenster für einen Redaktions-Stop fest.

Jetzt wird die komplette Webseite inklusive Inhalten in einen DEV-Account gespiegelt. Wir legen DEV-URLs an und konfigurieren den Server lt. der technischen Anforderungen für die TYPO3-LTS-Version 11.5. Nach Fertigstellung und Freigabe durch den Auftraggeber bleibt die finale Seite in dieser Umgebung. Dann werden die URLs auf die neue Umgebung eingestellt (Änderung der DNS-Einträge) und das Update ist erledigt.

Auf Wunsch können wir die alte Webseite noch für einen vereinbarten Zeitraum verfügbar machen.  

Alle im System verwendeten Extensions werden auf Kompatibilität zur aktuellen TYPO3-Version 11.5. LTS überprüft. Sämtliche nicht kompatiblen Erweiterungen werden deaktiviert/deinstalliert.

In diesem Schritt tauschen wir auch nicht zur DSGVO kompatible Extensions aus. Das sind zum Beispiel TYPO3-Extensions von Drittanbietern, die aus externen Quellen Schriftarten oder andere Ressourcen einbinden. 

Häufig sind ältere, im „alten“ System eingesetzte TYPO3-Extensions nicht kompatibel zu den neueren TYPO3-Versionen. Diese werden in diesem Schritt entweder deaktiviert (die Datensätze und Datenbank-Felder bleiben erhalten) oder gelöscht. 
 

Wir aktualisieren die momentan eingesetzte TYPO3-Version auf die derzeit aktuelle LTS-Version 11.5. Das Update findet in „LTS-Schritten“ statt – hier ein Beispiel:

4.5 LTS > 6.2 LTS
6.2 LTS > 7.6 LTS
7.6 LTS > 8.7 LTS
8.7 LTS > 9.5 LTS 
9.5 LTS > 10.4 LTS
10.4 LTS > 11.5 LTS

Das Zielsystem ist TYPO3 11.5. LTS. Je höher die Anzahl der Schritte, desto komplexer können die durchzuführenden Anpassungen sein. Daher entscheiden wir VOR dem Update gemeinsam mit dem Auftraggeber, ob nicht ein kompletter Relaunch der Webseite geeigneter wäre.

Die gute Nachricht: TYPO3 hat eine exzellente Aufwärts-Kompatibilität, was das Kernsystem angeht. Das heißt: Auch Inhalte von sehr alten TYPO3-Version können in der Regel gut in aktuelle TYPO3-LTS-Versionen migriert werden. 

In jedem Schritt finden auch Anpassungen am Template bzw. am Framework mit dem Ziel statt, einen großen Teil der Inhalte übernehmen und zeitgemäße/neue Funktionen hinzufügen zu können.

Nach jedem Schritt werden Frontendfunktionalität, Funktionsbereiche und die Darstellung von Inhaltselementen überprüft.
 

Seit der TYPO3-LTS-Version 9.5 werden für Suchmaschinen freundliche URLs, Sprachverwaltung, Mehrsprachigkeit und Domainverwaltung über Core-Funktionen abgebildet. Die Site-Konfiguration und Umstellung finden in diesem Schritt statt. 

Site-Konfiguration > Core
Seit der Version 9.5. werden die Basis-Seiten-Konfiguration und die Verwaltung der Sprachen über eine Core-eigene site-Konfiguration geregelt. Diese löst alle externen Extensions ab. Für die Hauptdomain, ggf. Subdomains und die verwendeten Extensions wird eine entsprechende Konfiguration erstellt.

Suchmaschinen freundliche URLs > Core
Seit der Version 9.5. werden unter anderem die Konfiguration von Domains und suchmaschinenfreundlichen URLs über eine Core-eigene Funktionalität konfiguriert.
Es ist keine zusätzliche Extension (realurl) mehr notwendig. Damit alle vorhandenen URLs in die Core-Funktionalität übernommen werden können, werden zusätzliche Migrationen per Planer und per Hand (Datenbank) durchgeführt.

In diesem Schritt werden Extensions aktualisiert, angepasst und ggf. neu konfiguriert. Dieser Step stellt im TYPO3-Update-Workflow meistens den größten Batzen dar. 

Nicht kompatible Extensions werden durch Alternativen ausgetauscht. Dabei legen wir den Schwerpunkt auf Sicherheit, Skalierbarkeit und zukünftige Updates. 

Hintergrundinformation TYPO3-Extensions: 
Über Extensions kann man TYPO3 für spezifische Anforderungen oder mit Funktionen sehr flexibel erweitern. Es gibt tausende, von der Community bereitgestellte Extensions. Die meisten davon werden aber nicht ständig weiterentwickelt. Daher setzen wir bei unseren TYPO3-Projekten und TYPO3-Updates einen Fokus darauf, von externen Extensions möglichst unabhängig zu werden. Wenn wir Community-Extensions verwenden, dann nur diese, die stetig und optimal gepflegt werden (Beispiele: tx_news, powermail). Unsere eigene Provider-Extensions modernisieren und entwickeln wir parallel immer weiter. Diese basieren auf Standard-TYPO3-Core-Funktionen und entsprechen den TYPO3-Programmierrichtlinien. 
 
Die Basis für unsere TYPO3-Projekte ist eine für TYPO3 11.5. LTS von made in nature entwickelte Provider-Extension (min_sitecore). Diese ersetzt zahlreiche externe Extensions und integriert ein aktualisiertes Framework (Foundation 6.7.5 XY-Grid). Im Verlauf eines Updates wird diese Provider-Extension im System installiert und für das Projekt spezifisch angepasst. 

In weiteren Schritten werden externe Extensions aktualisiert und ggf. neu konfiguriert – Beispiele:

• News
• Events
• Slider/Layerslider
• Bildergalerien

ggf. müssen die Slider oder Bildergalerien dabei neu angelegt werden.

Weitere Anpassungen oder Neukonfigurationen von Extensions:

• Video-Einbindung DSGVO-konform (Entweder binden wir die Videos lokal ein oder wir verlinken auf eine externe Youtube-/Video-Webseite
• Formulare (DSGVO-Anpassungen)
• Mehrspaltige Inhalte werden in das aktualisierte Framework für mobile Endgeräte optimiert importiert
• Slider, Accordion, Tabs, etc. werden über ein modernisiertes Content-Element angelegt und entsprechend angepasst
• Bildmenüs (Card-/Thumbmenüs - gerne auch Kachelmenüs genannt) werden über die Provider Extension neu angelegt
• Individuelle Extensions: Wenn für das Projekt individuelle Extensions programmiert wurden, müssen diese für die Verwendung in der neuen TYPO3-Version aktualisiert werden.

Im Anschluss stellen wir den Funktionsstatus der bestehenden Webseite mit den neuen Extensions wieder her. Hier kann es sein, dass Layoutbereiche ggf. etwas anders dargestellt werden. 
 

Wie im Punkt "Extension Management" beschrieben aktualisieren wir das System mit unserer eigenen Provider-Extension, min_sitecore. Im Rahmen dieser Aktualisierung werden diverse neue Funktionen im System verfügbar gemacht. Diese können bei Bedarf mit geringem Aufwand eingebunden werden. 

Beispiele:

• Foto-Handling: Der Bilder-Workflow wird so optimiert, dass vom User hochgeladene Fotos direkt komprimiert und ein webtaugliches Format gebracht werden. Fotos können im Inhaltselement direkt zugeschnitten werden. Hierfür stehen diverse Vorlagen-Formate für verschiedene Endgeräte zur Verfügung. 
• Bildergalerien: Ein neues Bildergalerie-Element vereinfacht das Anlegen von Galerien - auch mit Fotos unterschiedlicher Formate.
• Responsive Slideshow: Über das Standard­­-TYPO3-Inhaltselement (Text & Medien) können Foto-Slideshows erstellt werden. Dazu müssen keine externen Erweiterungen mehr installiert werden. 
• Kacheln/Cards: Die Auswahl an Card-Menüs wurden erheblich erweitert und optimiert. Cards sind als Inhaltselement, Menüs oder News verfügbar. 
• KI: Über den Editor können KI-generierte Texte direkt eingegeben werden. Hierfür ist von Kundeseite ein API-Key erforderlich.
• Navigation: Es stehen neue Menütypen zur Verfügung. Im Rahmen eines Updates modernisieren wir die Haupt-Navigation und optimieren die mobile Menüführung. 
• Ladezeiten & Speed: Zusätzliche Bibliotheken werden nur bei Bedarf eingebunden. Vorhandene Funktionsbibliotheken wurden so geteilt, dass nur erforderliche Bereiche geladen werden. 

Auf dieser Webseite, min-themes.de sind zahlreiche Beispiele für Funktionen der Provider-Extension zu finden. 

Es gibt elementare Erweiterungen für TYPO3, ohne die eine moderne Webseite kaum realisierbar wäre. Dazu gehören zum Beispiel die äußerst beliebten gridelements. Damit lassen sich Rasterelemente, wie Mehrspalter, individuelle Inhaltselemente, Slider und auch aufwändigere Funktionsbereiche in TYPO3 nachrüsten. 

Das Problem: gridelements ist technologisch komplex und - da schon sehr lange im TYPO3-Kosmos im Einsatz - auch aufwändiger zu skalieren. Updates auf höhere LTS-Versionen hingen in der Vergangenheit nicht selten am hohen Aufwand für die Aktualisierung dieser Extension und damit häufig erst späten Kompatibilität zu höheren LTS-Versionen von TYPO3. Auf keinen Fall soll das eine Kritik sein, da viel Entwicklungsarbeit aus der Community (unbezahlt) kommt, wir diese auch finanziell (crowdfunding) unterstützen und die Grundidee weiterhin supporten. 

Jetzt ist es aber so, dass wir unseren Kunden maximale Kompatibilität bei möglichst geringen Kosten bieten möchten. Also setzen wir bei TYPO3-Webseiten auf möglichst wenige proprietäre Erweiterungen und grösstmögliche Nähe zum TYPO3-Core. 

Lange Rede, kurzer Sinn: wir haben die gridelements-Extension 2021 durch eine andere, sehr Core-nahe Extensions namens "container" ersetzt. Da wir eigene Content Elemente (fce) sowieso selber per Hand nach TYPO3-Coding-Richtlinien implementieren, war uns der technische Ansatz der container-Extension von Anfang an sympathisch.  

In diesem Schritt migrieren wir also die bestehenden Rasterelemente in ein neues Format. 

Damit sind unter anderem die interne Bild-Verwaltung in TYPO3 und optimale Ausgabe von Fotos auf der Webseite gemeint. Bei einem Update rüsten wir Funktionen nach, die einige sehr sinnvolle Fotobearbeitungs-Features implementieren.

Beispiele:

• Fotos können im Backend von TYPO3 auf das richtige Format gebracht und müssen nicht vor dem Upload beschnitten werden. Bilder für Kachelmenüs oder News können so direkt im Medien-Einfügen-Dialog zugeschnitten werden.
• Fotos werden automatisch im webp-Format ausgegeben. Das ist ein relativ neues Grafikformat, das Fotos in sehr guter Qualität und gleichzeitig sehr geringer Dateigröße komprimiert:  https://de.wikipedia.org/wiki/WebP.
• Unterstützung von Geräten mit hoher Pixeldichte (Retina-Display).
• Bilder müssen vor dem Upload nicht mehr verkleinert oder umständlich komprimiert werden - das passiert automatisch beim Upload.

Schwerpunkte dieser "Image-Processing-Aufrüstung":

• Benutzerfreundlichkeit: Das Foto-Handling im Backend wird wesentlich einfacher
• Suchmaschinenfreundlichkeit: Bilder werden automatisch für Suchmaschinen optimiert

In Absprache mit unseren Kunden optimieren wir während des Updates auf der Basis des aktualisierten Frameworks vorhandene Inhaltselemente und Funktionsbereiche. Beispiele:

• Optimierung von Überschriften und bodytext
• Vergrößerung des Hauptinhaltsbereiches auf 1440 px
• Optimierung der Mehrspalter
• Optimierung der Ausgabe für mobile Endgeräte (Responsive)

Die Darstellung vorhandener Seiten und Inhalte können durch diese Änderungen verändert werden. 

Im Zuge des Redesigns führen wir unter anderem nachstehende Maßnahmen zur Barrierefreiheit und Zugänglichkeit der Webseite durch. Die Grundlagen dafür sind: Web Content Accessibility Guidelines (WCAG), Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz (Barrierefreie Informationstechnik-Verordnung - BITV 2.0) und der EU-Richtlinie 2016/2102.

• Globale Erhöhung der Kontraste. Bei kritischen Farbkontrasten, die durch das Corporate Design entstehen können, bieten wir ein alternatives, kontrastreiches Layout an. 
• Optimierung der Lesbarkeit und Größen der Schrift: im Standardlayout werden die Schriftgrößen erhöht. Über einen Button können Schriftgrößen alternativ nutzerspezifisch eingestellt werden. 
• Eine browserseitige Vorlesefunktion von Texten (z.B. ab Firefox 49.0) wird unterstützt.
• Nutzung mit Screenreadern: Diese finden Sprungmarken und Inhaltsverzeichnisse.
• Die Webseiten werden weitgehend semantisch korrekt (valide) aufgebaut. So können Benutzer zum Beispiel mit der Überschriftenfunktion des Screenreaders schnell und gezielt zum gewünschten Bereich der Seite navigieren.

Beispiel: Die von made in nature entwickelte Webseite der Stadt Dülmen, www.duelmen.de 

Häufig wird das Aktualisieren der TYPO3-LTS-Version zu einem Layout-Refresh genutzt. Auf der Basis des vorhandenen Designs entwickeln wir dann mit dem Styleguide, den vorhandenen Design-Elementen und den Kundenwünschen Layoutentwürfe, die wir in der Entwicklungsumgebung präsentieren.

Nach Freigabe durch den Auftraggeber werden diese global umgesetzt.

Übernommene Inhalte werden händisch von uns überprüft und ggf. optimiert. 

Bei Updates älterer TYPO3-Versionen kann der Aufwand größer sein, denn in den neueren TYPO3-Versionen werden Inhaltselemente neu gerendert. Rendern bedeutet die Ausgabe der in der Datenbank gespeicherten Rohdaten auf der Webseite. 
TYPO3 nutzt dafür unter anderem folgende Extensions: 

•  alt = css_styled_content
• neu = fluid_styled_content

Im Rahmen eines Updates älterer TYPO3-Versionen werden Inhalte – sofern möglich – in den neuen Mechanismus migriert.
Die Inhalte werden in die neue TYPO3-Content-Rendering-Engine "fluid_styled_content" migriert. 

Auf Wunsch binden wir Rechts-Texte aus unserem Agentur-Portal von E-Recht24 ein. Die Texte werden von uns in Abstimmung mit dem Auftraggeber und nach Fertigstellung der Seite zusammengestellt. Wir übernehmen keine rechtliche Garantie für die Texte!

Wenn möglich, verzichten wir beim Relaunch auf die Verwendung zustimmungspflichtiger Cookies. Auf Wunsch wird die aktualisierte Webseite an DSGVO-konforme Statistiktools auf eigenen Servern von made in nature angebunden (Plausible Analytics, Matomo ohne Cookies).

Nur, wenn erforderlich, wird eine Cookie-Bar, die das Steuern von Cookies sowie Optin und/oder Optout unterstützt, im System installiert und für die verwendeten Sprachen konfiguriert. Die Einbindung von Marketing-Tools wie Google Analytics oder Matomo wird entsprechend eingerichtet.

Die Maßnahmen zur DSGVO-Absicherung der Webseite sind rechtlich unverbindlich.

Auf Wunsch/nach Aufforderung pflegen wir explizite Datenschutzerklärungen/-passagen oder zusätzliche Maßnahmen zur DSGVO-Absicherung ein. Diese Maßnahmen werden via Zeit abgerechnet.

Die aktualisierte Webseite wird in einen Serveraccount gespiegelt, der die automatische Zuweisung eines kostenlosen SSL-Zertifikats (Lets Encrypt) unterstützt. TYPO3 wird global auf SSL umgestellt: Die gesamte Seite ist dann nur noch über https... erreichbar.

Den finalen Entwurf der aktualisierten Webseite präsentieren wir dem Auftraggeber. Sollten Korrekturschleifen erforderlich sein, führen wir diese zeitnah durch. Nach Freigabe wird die Domain für die neue Seite umgestellt. 

Projektmanagement, Kommunikation und Schulungen

Mit dieser Position werden Zeiten für Projektkommunikation, wie Kundengespräche, Kundenabstimmungen, Schulungen, E-Mail-Verkehr, Telefon-, Online-Meetings, sowie interne Projektplanung und Organisation über den kompletten Projektzeitraum aufgefangen.

Kommt es während der Ausführung eines Projekts zu zusätzlichen, nicht im voraus definierbaren Anforderungen (zum Beispiel im Rahmen eines Updates von Webseiten, die von Fremddienstleistern erstellt wurden), formulieren wir im Vorfeld einen Puffer.

Das kann zum Beispiel eine Anzahl an Stunden sein, in deren Rahmen der Auftraggeber – nach schriftlicher Absprache – die Zusatzanforderungen und damit das Budget zeitnah erweitern kann.