Das Deutsche Rote Kreuz (DRK) ist eine der führenden humanitären Organisation in Deutschland und Teil der weltweiten Internationalen Rotkreuz- und Rothalbmond-Bewegung.
Projektübersicht
Die neue Webseite des Deutschen Roten Kreuz
Der Deutsche Rote Kreuz Bundesverband hat seine Website grundlegend erneuert und dabei den Fokus auf "Mobile First" in UX und UI gelegt. Damit soll eine der Hauptzielgruppen - Smartphone-Nutzer, die ihr Handy für Spenden nutzen - besser angesprochen werden. Zudem waren die umfangreichen Inhalte der alten Website schwer zugänglich und wenig sichtbar, was auch die Arbeit der DRK-Redakteure erschwerte.
Für den Relaunch wurde TYPO3 in der Version 11.5 LTS eingesetzt, unterstützt durch ein leistungsfähiges Docker-Hosting. Eine Bestandsaufnahme der Inhalte führte zur Neustrukturierung von über 4.000 Inhaltsseiten. Auch das wichtige Spendenmodul wurde für die Bewältigung von Lastspitzen stark verbessert und bietet hohe Performance über alle vorhandenen Zahlungsmöglichkeiten. Belastungstests stellten die Performance des neuen Moduls sicher.
Die Neugestaltung des Frontends beinhaltet emotionale Bilder und Grafiken, um die Zielgruppe besser anzusprechen und die Spendenbereitschaft langfristig und nachhaltig zu erhöhen. Insgesamt wurde durch den Relaunch die User Experience und die Benutzeroberfläche verbessert. Dies hat, unterstützt durch schnellere Ladezeiten und weitere SEO-Optimierungen, messbar und nachhaltig zu höheren Google-Rankings geführt.
Im Ergebnis stehen die Nutzer stärker im Mittelpunkt
Der Relaunch der Website des Deutschen Roten Kreuzes (DRK) durch +Pluswerk hat beachtliche Ergebnisse gebracht. Ein zentraler Erfolg war die Umsetzung der neuen „Mobile First“-Ansicht inklusive einer darauf aufbauenden Desktop-Ansicht. Die neue TYPO3-Basis ermöglichte eine verbesserte Navigationsstruktur mit geführten Menüs, die den Nutzer effizient und intuitiv zu den gewünschten Inhalten führen. Diese Menüs sind optisch ansprechend gestaltet und verfügen über ein seitenübergreifendes Over-Top-Menü, das beim Scrollen minimiert wird, was zu einer ästhetischen und funktionalen Verbesserung beiträgt.
All dies hat die User Experience (UX) und das User Interface (UI) deutlich verbessert. Insbesondere das schnellere Frontend mit stark reduzierten Ladezeiten trägt zu einer angenehmeren Benutzererfahrung bei. Zusammen mit weiteren, gleichzeitigen SEO-Optimierungen wie optimierter Page Speed und bildschirmgrößenbasierten Mediendateien werden alle maßgeblichen Kriterien für ein hohes Ranking bei Google erfüllt. Unterm Strich ist die neue DRK-Homepage also einfacher und schöner - für Redakteure wie für Nutzer.
Use Cases
Von unübersichtlich zu unübersehbar
Der DRK Bundesverband hatte sich während der Covid 19 Pandemie die Aufgabe gestellt, seine bestehende Website grundlegend zu erneuern. Der zentrale Fokus lag dabei auf einem durchgängigen und konsequenten "Mobile First"-Ansatz sowohl in der UX als auch in der UI. Das DRK finanziert sich zu einem sehr großen Teil über Spenden und die meisten Spender nutzen dafür heute ihr Smartphone - diese Zielgruppe sollte nach dem Relaunch optimal abgeholt werden.
Ein weiterer Grund für den Relaunch war die inhaltliche Neustrukturierung der Homepage. Die DRK-Homepage enthielt eine sehr große Menge an Inhalten mit mehreren tausend einzelnen Websites, die jedoch nur noch unzureichend erreichbar waren. Teilweise waren die Websites von der Homepage aus für den Nutzer praktisch unsichtbar - sie tauchten weder in der Menüstruktur auf, noch waren sie durch interne Links miteinander verbunden. Dies führte zu erheblichen Schwierigkeiten - auch für die Online-Redakteure des DRK, die teilweise auf die Google-Suche zurückgreifen mussten, um Inhalte auf der eigenen Homepage zu finden.
Einer der wichtigsten Bestandteile der DRK-Homepage ist das Online-Spendensystem. Hier sollte die UX und das UI der Spendenseite nach dem Mobile-First-Ansatz grundlegend erneuert werden. Zudem wies das alte System erhebliche Performanceprobleme auf, insbesondere in Hochlastzeiten wie Krisensituationen oder während der Weihnachtszeit. Bei mehr als einem halben Dutzend angebundenen Zahlungsdienstleistern war die Entwicklung eines leistungsfähigeren Systems zwingend erforderlich. Bisher führte ein Zusammenbruch der Spendenseite in Krisenzeiten regelmäßig zu einem Rückgang der Spenden.
Besser und Schöner: Content-Inventur und Frontend-Design
Für den Relaunch der DRK-Website haben wir in einem ersten Schritt TYPO3 in der Version 11.5 LTS neu aufgesetzt. Dabei wurden alle bestehenden Inhalte übernommen und in das neue System importiert. Ein wesentliches Feature der Neuinstallation ist ein hochperformantes Docker-Hosting, das speziell für die Anforderungen des DRK entwickelt wurde. Zusätzlich implementierte das +Pluswerk eine übergreifende Solr-Suche von Apache.
Der zweite entscheidende Schritt war die Durchführung einer umfassenden Content-Inventur der mehrere tausend Einzelseiten umfassenden DRK-Homepage. Auf Basis dieser Bestandsaufnahme entwickelten wir neue technische und inhaltliche Bewertungskriterien, die es den Wissensträgern des DRK ermöglichten, über die Beibehaltung, Modifikation oder Löschung von Content-Elementen zu entscheiden.
Nach der erfolgreichen Bestandsaufnahme wurden die Inhalte neu strukturiert, wobei der Großteil in das überarbeitete Redaktionsmodul von TYPO3 übernommen und auf den oberen Menüebenen neu angeordnet wurde. Diese Umstrukturierung führte zu mehreren tausend einzelnen, aber nun sinnvoll erreichbaren Inhaltsseiten, was die Arbeit der DRK-Redakteure erheblich vereinfacht und die Homepage für die Nutzer attraktiver macht.
Performantes Spendenmodul für Hochlast-Zeiten
Ein weiteres, zentrales Element des Projekts war die Überarbeitung des Spendenmoduls, um es auch bei hoher Anfragenzahl leistungsfähig zu halten. Die verfügbaren Zahlungsdienstleister wurden gebündelt, so dass jetzt Spenden per Lastschrift, PayPal, Onlineüberweisung und Kreditkarten möglich sind. Zudem ist jetzt ein klarer „Spenden“ CTA-Button auf jeder Website deutlich sichtbar, der an den jeweiligen Content angepasst ist.
Auch die Bedienung des Spendenmoduls für die Fundraising-Mitarbeiter im Backend wurde vereinfacht und besser benutzbar gestaltet. Um die Verfügbarkeit des Spendenmoduls auch bei vielen parallelen Anfragen zu garantieren, haben wir umfangreiche Belastungstests durchgeführt, die eine hohe vierstellige Anzahl gleichzeitiger Spender simulierten. Mit dem neuen Spenden-Modul ist das DRK jetzt für viele Jahre optimal aufgestellt.
Auf der gestalterischen Ebenen haben wir das Frontend der DRK-Homepage komplett überarbeitet. Im neuen Design nutzt die Homepage jetzt attraktive, großformatige Bilder und Grafiken für eine emotionale Ansprache der DRK-Zielgruppen. Die neue Informationsqualität, die jetzt zu den konkreten Projekten vorliegt, steigert die Spendenbereitschaft und fördern das nachhaltige Interesse an konkreten Hilfsprojekten.
