Consent Management
Unsere eigene Consent-Engine. Sie verwaltet Einwilligungen, schaltet zustimmungsabhängige Dienste frei und bereinigt Cookies beim Widerruf – während Daten, Sprachen und Gestaltung pro Projekt frei bestimmbar bleiben.
Für den Künstler Ralph D. Woop entwickelten wir einen individuellen digitalen Auftritt, der die Atmosphäre einer Ausstellung mit einem strukturierten, mehrsprachigen Werkverzeichnis verbindet.
Die Kunstwerke, die Werkfotografien und die fachlichen Werkangaben stammen vom Künstler.


digital dokumentierte Unikate
indexierbare Adressen
vollständig integrierte Sprachen
Lighthouse SEO
Lighthouse Accessibility
Cumulative Layout Shift
Die Website umfasst 107 Adressen pro Sprache; 196 der insgesamt 214 URLs entstehen automatisch aus den zentral verwalteten Werkdaten. Die Lighthouse-Werte stammen aus der Desktop-Messung vom 7. August 2026, die zusätzlich einen Performance-Score von 99 bei 0,8 Sekunden Largest Contentful Paint erreicht.
Das künstlerische Werk von Ralph D. Woop umfasst Cyanotypien, Pyrographien, Porträts, Auftragsarbeiten und experimentelle Arbeiten mit sehr unterschiedlichen Formaten, Geschichten und Verfügbarkeiten.
Die Herausforderung bestand deshalb nicht einfach darin, Bilder online zu präsentieren.
Die neue Website sollte gleichzeitig
Daraus entstand die Anforderung an einen digitalen Auftritt, der Ausstellung, Werkverzeichnis und Kommunikationsplattform in einem System verbindet.
Ein Kunstwerk funktioniert anders als ein klassisches Produkt. Jedes Werk ist ein Unikat. Formate und Proportionen unterscheiden sich stark. Manche Arbeiten sind verfügbar, andere reserviert, Teil einer Privatsammlung oder grundsätzlich nicht verkäuflich.
Ein gewöhnliches Kartenraster hätte diese Vielfalt visuell vereinheitlicht. Eine rein experimentelle Galerie wiederum hätte zwar Atmosphäre geschaffen, wäre für gezielte Recherche, Suchmaschinen und Besucher mit einem konkreten Interesse an einem Werk jedoch nur eingeschränkt geeignet gewesen.
Die zentrale Frage lautete deshalb: Wie verbindet man ein digitales Galerieerlebnis mit einem strukturierten Werkverzeichnis? Die Antwort war keine einzelne Oberfläche, sondern zwei unterschiedliche Zugänge zum gleichen Werkbestand.
Die Informationsarchitektur wurde so entwickelt, dass Besucher selbst entscheiden können, wie sie sich dem Werk nähern möchten.
Die visuelle Gestaltung orientiert sich an der Atmosphäre eines historischen Ateliers und eines kuratierten Galerieraums.
Dunkle Blau- und Schwarztöne schaffen einen ruhigen Hintergrund. Warme Gold- und Lichtakzente greifen Materialien und Farbstimmungen der Werke auf. Klassische Serifentypografie verbindet die digitale Oberfläche mit der Ästhetik einer Ausstellung. Die Benutzeroberfläche tritt dabei bewusst hinter die Kunst zurück.
Querformat, Hochformat oder ungewöhnliche Proportionen werden nicht in identische Bildcontainer gezwungen. Für die Galerie wurde eine eigene Layoutlogik entwickelt, die die tatsächlichen Seitenverhältnisse der Werke berücksichtigt und daraus ausgewogene Reihen erzeugt.
Auch beim Nachladen weiterer Werke bleiben bereits sichtbare Bilder stabil. Die Inhalte werden zeilenweise ergänzt, damit sich bestehende Elemente nicht nachträglich neu skalieren.
Die Museumswand ist kein Hintergrundbild. Wand, Sockelleiste, Parkettboden, Deckenstrahler und die Rahmen um jedes Werk entstehen im Browser – aus Farbverläufen, Schatten, Lichtkegeln und wenigen Materialtexturen. Ein Foto hätte denselben Raum gezeigt, aber immer nur diesen einen: feste Lichtstimmung, feste Rahmenfarbe, feste Bildgrösse.
Weil jede Ebene aus Gestaltungswerten entsteht, bleibt sie jederzeit veränderbar. Eine hellere Wand, ein anderes Holz, ein zusätzlicher Strahler oder ein schmaleres Passepartout sind die Änderung eines Wertes im Code – kein neues Rendering, kein neuer Fototermin. Der Raum wächst mit der Sammlung, statt sie in ein einmal festgelegtes Bild zu zwingen.
Damit dieses Bühnenbild beim seitlichen Scrollen nicht jede Bewegung teuer macht, wird es einmal je Bildschirmgrösse auf eine Zeichenfläche (Canvas) gerechnet und als fertiges Bild hinter die Werke gelegt. Die Werke selbst bleiben eigenständige Elemente im Vordergrund – anklickbar, verlinkbar, mit ihren echten Bilddaten. Ändert sich die Fenstergrösse, entsteht der Raum neu; beim Scrollen bewegt der Browser nur noch eine einzige Ebene.
Die digitale Galerie übersetzt Elemente eines klassischen Ausstellungsraums in den Browser. Auf grösseren Bildschirmen bewegen sich Besucher horizontal entlang einer virtuellen Museumswand. Unterschiedliche Bildformate behalten ihre tatsächlichen Proportionen und werden innerhalb einer räumlich inszenierten Umgebung dargestellt. Wandstrukturen, Passepartouts, Beleuchtung und zurückhaltende räumliche Elemente schaffen einen Rahmen, ohne mit den Kunstwerken zu konkurrieren. So steht zunächst nicht die Information, sondern die visuelle Entdeckung im Mittelpunkt.
Wer ein bestimmtes Werk sucht oder den Bestand gezielt durchsuchen möchte, gelangt über das Werkverzeichnis direkt zu den relevanten Informationen. Für jedes Werk werden unter anderem Vorschaubild, Titel, Entstehungsjahr, Werknummer, Technik und Verfügbarkeitsstatus übersichtlich dargestellt.
Das vollständige Werkverzeichnis wird serverseitig bereitgestellt und bleibt damit unabhängig vom interaktiven Galerieerlebnis klar strukturiert, direkt zugänglich und für Suchmaschinen erfassbar.

Die Desktop-Galerie wurde bewusst nicht auf kleinere Displays zusammengeschrumpft. Für mobile Geräte entstand ein eigenes Interaktionskonzept:
Dadurch bleibt die gestalterische Identität erhalten, während die Bedienung an das jeweilige Gerät angepasst wird.
Jede dieser Ebenen ist ein Gestaltungswert im Code – Farbe, Breite, Deckkraft, Anzahl. Die Ausstellung lässt sich damit jederzeit umhängen und neu ausleuchten, ohne dass ein einziges Bild neu erstellt werden muss.
Die zentrale Grundlage der Website ist nicht der Seitentitel, sondern die Werknummer. Ein Werk behält seine Identität unabhängig davon, ob sich später sein Titel oder seine URL verändert. Dadurch bleiben Übersetzungen, Empfehlungen, Galeriepositionen und weitere Verknüpfungen zuverlässig miteinander verbunden.
Beispiel einer Werknummer
Auch die Werknummer selbst wird zum digitalen Einstiegspunkt. Wer eine Werknummer beispielsweise auf einem physischen Werk, einer Dokumentation oder einem Zertifikat findet, kann diese als Adresse verwenden. Das System leitet automatisch auf die kanonische Werkseite weiter.
Damit entsteht eine direkte Verbindung zwischen physischem Kunstwerk und digitalem Werkverzeichnis, ohne zusätzliche konkurrierende URLs für Suchmaschinen zu erzeugen.
Alle relevanten Werkdaten werden zentral verwaltet.
Daraus entstehen automatisch
Von den 214 indexierbaren Adressen der Website werden 196 auf diese Weise aus den Werkdaten erzeugt.
Werknummern, Übersetzungen und weitere werkbezogene Strukturen sind miteinander typisiert. Fehlt beispielsweise eine Übersetzung oder wird eine Werknummer falsch geschrieben, schlägt der automatisierte Build fehl, statt unvollständige Inhalte unbemerkt auf die Live-Website zu übertragen. Diese Prüfung läuft bei jedem Push und Pull Request automatisch mit.
Werkseite, Verzeichniseintrag, Galerieposition, Metadaten, Sitemap-Eintrag und Weiterleitungen entstehen aus derselben Quelle. Ein zusätzliches Werk ist deshalb ein Datensatz mehr – keine neue Seite, keine neue Route und kein zweiter Ort, an dem dieselbe Angabe gepflegt werden müsste.
Jedes Werk besitzt eine eigene Detailseite. Dort werden visuelle Präsentation und strukturierte Informationen miteinander verbunden.
Je nach Werk können dargestellt werden
Besucher können ausserdem zwischen vorherigen und nächsten Werken wechseln. Die Reihenfolge folgt dabei der kuratierten Galerie und nicht einfach der Reihenfolge in einer Datenbank.
Für verwandte Arbeiten wurde eine eigene Empfehlungslogik entwickelt. Sie berücksichtigt unter anderem:
Insgesamt werden acht gewichtete Merkmale berücksichtigt. Die Empfehlung kann dem Besucher zusätzlich erklären, warum ein anderes Werk als ähnlich eingestuft wurde. So endet die Entdeckung nicht auf einer einzelnen Detailseite, sondern führt thematisch durch den Werkbestand weiter.
Woop Art wurde bewusst nicht als Onlineshop aufgebaut. Der Schwerpunkt liegt auf Kunstvermittlung, Werkdokumentation und persönlichem Kontakt.
Deshalb passt sich die Handlungsaufforderung an den Status des jeweiligen Werks an.

Das Werk kann noch den Besitzer wechseln – es ist erhältlich oder für jemanden vorgemerkt. Die Schaltfläche führt deshalb zu einer Anfrage, die sich auf genau dieses Werk bezieht.
Das Werk ist in Privatbesitz oder steht nicht zum Verkauf. Eine Anfrage danach liefe ins Leere – deshalb führt die Schaltfläche nicht zum Werk, sondern zu einem Gespräch über eine vergleichbare Arbeit.
Die Anfrage entsteht auf der Werkseite selbst. Bezeichnung beziehungsweise Werknummer und die Art der Anfrage werden dabei mitgeführt – Besucher müssen sie nicht abschreiben.
Eine wesentliche Anforderung bestand darin, einzelne Kunstwerke dauerhaft auffindbar und technisch eindeutig beschreibbar zu machen.
Dafür verwendet die Website sechs verschiedene Schema.org-Typen
Alle 98 Werkseiten werden als VisualArtwork ausgezeichnet und mit Informationen wie Technik, Material, Werknummer und Abmessungen ergänzt. Über stabile Entitätsverknüpfungen werden Kunstwerk, Künstler und Website miteinander verbunden.
Auf Preis- oder Offer-Markup wurde bewusst verzichtet, da Woop Art eine Galerie und kein klassischer Onlineshop ist.
Mehrsprachigkeit wurde nicht lediglich über übersetzte sichtbare Texte gelöst. Alle 98 Werke sind vollständig auf Deutsch und Englisch gepflegt. Insgesamt umfasst dies 196 Werkdatensätze mit 1'372 ausgefüllten übersetzten Textfeldern.
Auch die URLs sind sprachspezifisch aufgebaut
Canonical-, hreflang- und x-default-Verknüpfungen sorgen dafür, dass Suchmaschinen die Sprachversionen korrekt miteinander verbinden. So wird Mehrsprachigkeit nicht als Zusatzfunktion behandelt, sondern als Teil der grundlegenden Informationsarchitektur.
Die Sitemap wird automatisch aus dem tatsächlichen Seiten- und Werkbestand erzeugt und umfasst aktuell 214 Adressen. Für jede URL werden unter anderem Sprachalternativen, Aktualisierungsdatum, Priorität und Canonical-Zuordnung gepflegt.
Das Änderungsdatum orientiert sich dabei am tatsächlichen Inhaltsstand und nicht lediglich am Zeitpunkt des letzten Deployments. So wird vermieden, dass bei jeder technischen Veröffentlichung fälschlicherweise signalisiert wird, sämtliche Inhalte seien aktualisiert worden.
Woop Art wurde als individuelle Webanwendung auf Basis von Next.js, React und TypeScript entwickelt. Die Anwendung wird als eigenständiger Container ausgeliefert und ist damit nicht an eine bestimmte Website-Plattform oder einen einzelnen Hosting-Anbieter gebunden.
Zum technischen Betrieb gehören
Jede veröffentlichte Version lässt sich reproduzierbar bereitstellen oder bei Bedarf auf einen vorherigen Stand zurücksetzen.
Auch der E-Mail-Versand für Kontaktanfragen läuft über eine zentrale Infrastruktur mit Amazon SES.
Die Oberfläche entsteht bei uns je Projekt in einem eigenen Repository. Woop Art lässt sich deshalb als abgeschlossener Quellcodestand übergeben, ohne dass Teile fremder Projekte mitgehen.
Beschrieben ist, was vorgesehen ist. Was im Einzelfall gilt, regelt der jeweilige Vertrag.
Auch das Consent Management basiert auf einer eigenen wiederverwendbaren Komponente von Woop Technology. Für Woop Art umfasst die Konfiguration:
Consent-Kategorien
Services
deklarierte Cookies
Sprachen: Deutsch und Englisch
Änderungen an der Consent-Konfiguration werden versioniert und können eine erneute Entscheidung des Besuchers auslösen.
Google Consent Mode v2 wird standardmässig mit verweigerten Zuständen initialisiert. Analytics wird erst geladen, nachdem die entsprechende Zustimmung erteilt wurde. Consent-Entscheidungen werden serverseitig mit Zeitstempel, Consent-Version und anonymisierter IP-Adresse protokolliert.
Die Website berücksichtigt auch Nutzer, die mit Screenreadern, reduzierter Bewegung oder Zoomfunktionen arbeiten.
Unter anderem wurden umgesetzt
Gerade bei einer Kunstwebsite wurde bewusst darauf verzichtet, das Zoomen auf mobilen Geräten einzuschränken – Besucher sollen Werke vergrössert betrachten können.
Ein formales WCAG-Konformitätsaudit wurde nicht durchgeführt; deshalb werden keine entsprechenden Zertifizierungs- oder Konformitätsaussagen gemacht.
Woop Art ist heute nicht nur eine Website mit Bildern. Entstanden ist ein digitaler Kunstraum, der unterschiedliche Anforderungen miteinander verbindet:
Eine atmosphärische Galerie für die visuelle Entdeckung.
Ein vollständiges digitales Werkverzeichnis.
Eigene Werk-, Technik-, Projekt- und Künstlerseiten.
214 indexierbare Adressen mit mehrsprachiger SEO-Struktur.
Werkbezogene Anfragen statt anonymer Kontaktformulare.
Neue Arbeiten werden zentral ergänzt und automatisch in die bestehende Struktur integriert.
Damit kann der digitale Auftritt gemeinsam mit dem künstlerischen Werk weiterwachsen – ohne für jedes neue Kunstwerk eine neue technische Lösung zu benötigen.
Performance
Accessibility
Best Practices
SEO
Die Werte stammen aus der aktuellen Lighthouse-Desktop-Messung vom 7. August 2026.
Unsere eigene Consent-Engine. Sie verwaltet Einwilligungen, schaltet zustimmungsabhängige Dienste frei und bereinigt Cookies beim Widerruf – während Daten, Sprachen und Gestaltung pro Projekt frei bestimmbar bleiben.
Eine klar strukturierte Plattform für zyklusorientiertes Training, Ernährungs- und Lebensstilberatung – mit Angebotsvergleich, Terminanfrage und Buchung.


Im Erstgespräch sprechen wir über Ihre Ziele und darüber, wie daraus eine passende digitale Lösung entstehen kann.