Portfolio

Corporate Website: centrum-csr.com

centrum-csr.com ist eine moderne Online-Plattform, die der Förderung der Ideen der Corporate Social Responsibility (CSR) und der nachhaltigen Entwicklung gew...

#Logotypen#Webseiten
Corporate Website: centrum-csr.com

#centrum-csr.com, Ihr Wissenszentrum zur unternehmerischen Gesellschaftsverantwortung

Ein Projekt aus dem Jahr 2012 ehrlich zu beschreiben heißt zuerst zu sagen, welche Teile gealtert sind und welche nicht. centrum-csr.com ist ein Fachportal zur unternehmerischen Gesellschaftsverantwortung und zur nachhaltigen Entwicklung, gerichtet an Unternehmen, Nichtregierungsorganisationen und alle, die solche Praktiken in der eigenen Organisation einführen. Es läuft auf WordPress, nutzt Redis als Objekt-Cache und eine REST-API-Schicht, das Frontend entstand in HTML5, CSS3 und SASS, die Mediendateien laufen über ein CDN. Die Umsetzung dauerte etwa sechs Wochen, Layout und Elementanordnung kamen vom Kunden.

Die Präsentationsschicht altert in solchen Projekten am schnellsten. Die Responsive-Konventionen von 2012 und die damals üblichen Rastersysteme sind heute genau der Teil, den ein ernsthafter Umbau vollständig ersetzt. Das Inhaltsmodell und die Art, wie Daten über die API ausgeliefert werden, haben sich deutlich besser gehalten. Diese Beobachtung lässt sich auf jedes neue Vorhaben übertragen: Geld, das in die Datenstruktur fließt, arbeitet länger als Geld, das in die Oberfläche fließt.

#Wissensbasis und Nachrichten altern unterschiedlich schnell

Die wichtigste redaktionelle Entscheidung war die Trennung der Wissensbasis vom Nachrichtenstrom. Beides sieht gleich aus, Text mit Überschrift und Datum, verhält sich aber in jeder wichtigen Hinsicht anders.

Eine Meldung trägt eine Woche, gehört auf die Startseite und muss nicht zurückkommen. Ein Leitfaden aus der Wissensbasis ist so viel wert wie seine Richtigkeit zwei Jahre später. Er braucht eine Prüfung, ein sichtbares Datum der letzten Durchsicht und einen Platz in der Struktur, der nicht vom Veröffentlichungszeitpunkt abhängt. Praktisch heißt das: dauerhafte Inhalte bekommen eigene Themenkategorien wie Ökologie oder Unternehmensethik und eigene Templates, der Nachrichtenstrom bleibt ein Strom.

Der Preis ist redaktionelle Disziplin. Jemand muss entscheiden, in welche Schublade ein Text gehört, und diese Entscheidung lässt sich nicht automatisieren, weil sich dasselbe Material als Veranstaltungsnotiz oder als Themeneinführung schreiben lässt. Der Gewinn zeigt sich erst Jahre später, wenn eine Durchsicht zwanzig Leitfäden betrifft und nicht zweihundert Beiträge, von denen die meisten ohnehin Geschichte sind.

Dieselbe Logik steht hinter dem eigenen Bereich für Umsetzungsbeispiele. Das ist keine Zierde, sondern eine Sammlung von Fällen, auf die aus den Fachtexten verwiesen wird. Damit sie pflegbar bleibt, braucht jeder Fall eigene Felder statt eines weiteren Absatzes mit eingeklebtem Bild.

#Wer hier liest und was daraus folgt

Das Publikum war nie die Allgemeinheit, sondern Geschäftsführung, Personal- und Marketingabteilungen, Fachleute für Nachhaltigkeit und Beratende. Sie kommen mit einer konkreten Frage und wenig Geduld: Was verlangt ein bestimmter Standard, wie wird eine Initiative üblicherweise berichtet, was haben vergleichbare Organisationen tatsächlich getan.

Dieses Profil prägt den ganzen Aufbau. Die Leserschaft kommt aus einem Suchergebnis oder aus einem Newsletter, landet tief in der Seite statt auf der Startseite und findet entweder im ersten Bildschirm, was sie braucht, oder verlässt die Seite. Also müssen tiefe Seiten für sich allein stehen, die Navigation muss von der Mitte nach außen funktionieren, und das Veröffentlichungsdatum muss sichtbar sein, denn in diesem Fachgebiet ist ein Dokument ohne Datum ein Dokument, auf das sich niemand berufen kann.

#Formulare sind die Stelle, an der das Portal auf Menschen trifft

Ein Kontaktformular auf einem Fachportal erfüllt eine andere Aufgabe als eines im Shop. Es nimmt keine Bestellungen entgegen, sondern Anfragen nach Beratung, Bitten um Materialien und Meldungen von Organisationen, die ihre eigene Praxis vorstellen möchten. Die Nachrichten sind lang, und die Absender erwarten eine Antwort, keine Empfangsbestätigung.

Technisch sind drei Punkte zu klären. Erstens die Zustellbarkeit: Post, die der eigene Server mit der Besucheradresse im Absenderfeld verschickt, landet häufiger im Spam, als man erwartet, also gehört die Absenderadresse zur Domain der Seite und die Adresse aus dem Formular in das Antwortfeld. Zweitens der Spam: Jedes öffentlich erreichbare Formular wird binnen Wochen von automatisiertem Verkehr gefunden, Filterung und Ratenbegrenzung sind also Voraussetzung dafür, dass das Postfach lesbar bleibt. Drittens die Feldlänge: Eine Nachricht an einer Zeichengrenze abzuschneiden ist ein Fehler, der erst auffällt, wenn jemand seinen Fall in drei Absätzen geschildert hat und zwei davon angekommen sind.

#Herausforderungen und implementierte Programmierlösungen

Asynchrones Nachladen wurde eingeführt, damit Listen und Bereiche weitere Einträge holen können, ohne die Seite neu zu laden. Bei einer großen Menge an Artikeln und Berichten ist das ein spürbarer Komfortgewinn: Die Leserin blättert, schränkt ein und zahlt nicht jedes Mal den vollen Preis für den Aufbau einer Seite.

Es gibt genau eine Grenze, die man vor der Umsetzung kennen sollte. Inhalt, der erst nach einem Skriptlauf existiert, existiert für einen Teil des Publikums gar nicht: im milden Fall für einen Crawler, im ernsten für einen Screenreader. Jeder Artikel und jeder Bericht hat deshalb eine eigene Adresse und seinen vollständigen Text im normalen HTML-Dokument, und die asynchrone Schicht beschleunigt nur die Navigation durch Listen.

Die REST-API leistet hier dasselbe wie ein gut geschnittener Endpunkt in jedem anderen Projekt: Sie liefert genau die Daten, die für einen Ausschnitt der Oberfläche gebraucht werden. Würde die Artikelliste vollständige Beiträge anfordern, zöge jedes Nachladen den gesamten Fließtext mit, um Titel, Kategorie und zwei Zeilen Anriss anzuzeigen. Die kleinere Antwort ist nicht nur schneller, sie verhält sich auch besser im Cache, weil sich diese Ressource seltener ändert als der Artikeltext.

Redis übernimmt das Objekt-Caching. Eine WordPress-Seite entsteht aus vielen kleinen Lesezugriffen: Optionen, Metadaten, Taxonomiebeziehungen. In einer Listenansicht mit Kategorien, Schlagwörtern und Anrissen wächst deren Zahl schneller, als die Menge sichtbarer Elemente vermuten lässt. Interessant ist, wem dieser Cache nützt. Ein vollständiger Seiten-Cache bedient die anonyme Leserschaft und erledigt aus deren Sicht die Sache. Für angemeldete Redaktion, für parametrisierte Ansichten und für API-Antworten tut er nichts, und genau dort arbeitet das Team, das publiziert. Eine Seite, die für Lesende schnell und im Backend zäh ist, bremst das Veröffentlichen, und das kostet mehr als ein paar hundert Millisekunden auf der Startseite.

Mediendateien, also Fotos, Infografiken und Videomaterial zu den Initiativen, laufen über ein CDN. Der Grund ist nüchtern: Es sind die größten Dateien im Projekt, und ihre Auslieferung vom Anwendungsserver bindet Kapazität, die besser dem Seitenaufbau zur Verfügung steht.

Gemessen wurde gegen eine Kopie der Produktion, nicht gegen eine leere Installation. Ein leeres WordPress antwortet immer schnell, weil es nichts zu durchsuchen gibt. Erst eine Datenbank mit dem vollständigen Bestand an Artikeln, Berichten, Kategoriebeziehungen und Kommentarhistorie zeigt, welche Abfrage einen halben Tabellenscan auslöst.

Auf der Suchmaschinenseite standen semantische Auszeichnung, saubere Metaangaben, lesbare Adressen, strukturierte Daten nach schema.org und eine XML-Sitemap. Ziel ist eng gefasst: der Maschine beschreiben, was ein Mensch am Layout abliest. Strukturierte Daten stellen keinen schwachen Text vor einen guten; sie verhindern, dass ein guter Text übersehen wird, weil der Crawler die Seitenart nicht erkennen konnte. Belastbare Messwerte zur Wirkung dieser Arbeit habe ich nicht, deshalb nenne ich keine.

#Support und Wartung der Webseite

Die laufende Betreuung umfasst Updates von Kern, Theme und Plugins, die Durchsicht der Logs, Sicherungen sowie kleinere funktionale und gestalterische Änderungen. Updates werden auf einer Kopie getestet, denn ein Projekt mit eigenen Templates, API-Anbindung und öffentlichen Formularen hat mehrere Stellen, an denen eine Plugin-Änderung das Verhalten ohne Fehlermeldung verschiebt: Ein Filter, auf dem eine Ansicht beruhte, verschwindet, eine Abfrage wird anders zusammengesetzt, der Formularversand stellt sich still ein.

Eine Sicherung ist eine Wiederherstellungsprozedur und keine Datei auf einer Platte. Wert hat die Sicherung, aus der schon einmal eine lauffähige Kopie entstanden ist, samt Notiz über die benötigte Zeit.

#Zusammenfassung

Bei centrum-csr.com ist der fachliche Inhalt das Produkt, und die Technik hat die Aufgabe, ihn über Jahre lesbar zu halten. Entschieden haben Dinge, die von außen unsichtbar sind: die Trennung von Wissensbasis und Nachrichtenstrom, das Nachladen als Beschleunigung statt als einzigen Weg zum Text, ein Objekt-Cache, der auf die Arbeit der Redaktion abgestimmt ist, und eine Datenstruktur, die von der Oberfläche getrennt bleibt, weil diese ohnehin zuerst altert.

Übertragbar sind die technische Schicht und die Methode: WordPress, Redis, REST-API, CDN, Messung gegen eine Produktionskopie. Nicht übertragbar sind das Inhaltsmodell dieses Portals und seine Integrationen, geschrieben für einen Materialbestand und eine redaktionelle Routine. Ein neues Vorhaben beginnt mit der Aufnahme des Umfangs, das Angebot folgt danach.

Welchen Umfang hatte das Projekt centrum-csr.com?#
centrum-csr.com ist ein Projekt der Kategorie Logotypen, 2025 übergeben. Dahinter stehen WordPress, Redis, HTML5, CSS3 und SASS.
Wie lief die Umsetzung bei centrum-csr.com?#
Der Build lief rund sechs Wochen und ging 2025 live. Er steht auf WordPress, Redis, HTML5, CSS3 und SASS. Das Layout kam vom Kunden. Darauf habe ich Templates und Content-Modell gebaut und die Pfade mit Traffic auf einer Produktionskopie geprüft, nicht auf einer leeren Installation.
Was war technisch am anspruchsvollsten bei centrum-csr.com?#
Am meisten Sorgfalt kostete es, WordPress, Redis, HTML5, CSS3 und SASS zusammenzuhalten. Content, Konfiguration und Code liegen in getrennten Schichten, ein Zurücksetzen nach dem Launch bewegt also eine davon und nicht alle drei. Edge Cases zeigen sich auf einer Produktionskopie, dort laufen die Prüfungen.
Welcher Teil von centrum-csr.com lässt sich bei einem weiteren Build wiederverwenden?#
Übertragbar ist die technische Schicht: WordPress, Redis, HTML5, CSS3 und SASS. Sie sieht beim nächsten Build ähnlich aus. Nicht übertragbar sind das Content-Modell dieses Projekts und seine Integrationen, geschrieben auf die Daten eines Kunden und ein Briefing der Kategorie Logotypen. Ein zweiter Build beginnt mit einer Umfanganalyse, das Angebot folgt danach.

Sie brauchen ein FAQ für Branche und Zielmarkt? Wir erstellen eine Version passend zu Ihren Business-Zielen.

Kontakt aufnehmen