Plattformen & Migration
Digitaler Produktkatalog für Industrie und Maschinenbau: CMS, Sprachen, UX und Produktbilder
Kernaussagen
- Ein Industrie-Katalog braucht eine saubere Datenstruktur aus Produktfamilien, Varianten, Zubehör und Downloads, bevor über Design oder Plattform entschieden wird.
- Webflow passt für Kataloge mittlerer Größe mit hohem Designanspruch, WordPress oder Headless kommen bei sehr großen oder stark datengetriebenen Katalogen ins Spiel.
- Mehrere Sprachen brauchen einen festen Übersetzungsablauf mit Deutsch als Quelle und saubere hreflang-Verweise.
- Gute Nutzerführung entsteht durch einheitliche Attribute, Einheiten, Filter und Produktseiten mit festen Modulen.
- Einheitliche Produktfotos sind eine Frage von Briefing, Shotlist und Art Direction, nicht von Zufall.
Kurzantwort: Ein Industrie-Produktkatalog braucht ein CMS für viele Produkte und Varianten, klare Nutzerführung, Datenblätter und bei Bedarf viele Sprachen. Webflow eignet sich für Kataloge mittlerer Größe mit hoher Designqualität, WordPress oder ein Headless-Ansatz bei sehr großen Datenmengen. Wir von Webwavers verbinden UX, Webflow-Entwicklung und Art Direction für einheitliche Produktbilder.
Was ein digitaler Produktkatalog im Maschinenbau leisten muss
Technische Entscheider kaufen keine Maschine im Warenkorb. Sie suchen Daten, Einsatzgebiete und Vergleichbarkeit, und sie wollen am Ende eine fachliche Anfrage stellen. Ein digitaler Katalog muss deshalb drei Dinge können: Produkte ordnen, Informationen belegen und zur Anfrage führen.
Wie wir Katalog-CMS für die Branche angehen, steht auf der Seite Produktkatalog-CMS für Industrie und Engineering. Dieser Ratgeber ist die Entscheidungshilfe dazu: Plattform, Sprachen, UX und Fotos. Einen Überblick über unsere Arbeit in der Branche gibt Industrie und Engineering.
Produktfamilien, Varianten, Zubehör, Downloads
Ein Katalog ist ein Datenmodell. Bevor du über Design redest, klärst du: Was ist eine Produktfamilie, was eine Variante, was Zubehör, was ein Dokument? Wo gelten Daten für die ganze Familie, wo nur für eine Variante? Wer hier schludert, baut später doppelt.
Anfrage statt Warenkorb
In vielen Industriebereichen steht am Ende eine Anfrage, ein Angebot oder ein Gespräch mit dem Vertrieb. Jede Produktseite braucht deshalb einen sichtbaren Weg dahin, zum Beispiel Anfrageformular, Ansprechpartner oder Musterbestellung. Wie du die Anfrage mit deinem CRM verbindest, erklärt unser Ratgeber zur CRM-Anbindung der Website.
Webflow oder WordPress für Produktseiten und Datenblätter
Die Frage, ob Webflow oder WordPress für eine Industrie-Website mit vielen Produktseiten besser passt, lässt sich nicht pauschal beantworten. Es hängt von Anzahl, Struktur und Pflege deiner Daten ab. Wir bauen mit Webflow als Schwerpunkt, aber auch mit WordPress, TYPO3 und Headless, deshalb können wir fair vergleichen.
Webflow-CMS: Collections und Referenzfelder
In Webflow legst du Collections an, etwa Produkte, Produktfamilien, Kategorien, Dokumente und Anwendungen, und verknüpfst sie über Referenzfelder. Design und Entwicklung liegen in einem System, Redakteure pflegen Inhalte ohne Entwickler. Das passt gut, wenn Design und Markenwirkung wichtig sind und der Katalog eine überschaubare bis mittlere Größe hat.
Webflow hat Grenzen bei der Zahl der Einträge und Felder, und diese hängen vom gewählten Plan ab und ändern sich. Wir nennen hier bewusst keine festen Werte. Prüfe die aktuellen Limits auf webflow.com, bevor du planst, und rechne bei mehreren Sprachen mit: Jede Sprachvariante eines Eintrags zählt gesondert, dafür gibt es plan-abhängige Obergrenzen bei den Sprachen.
WordPress: flexible Felder und Importe
WordPress bringt mit benutzerdefinierten Beitragstypen und Feldern viel Flexibilität, und es gibt Import-Werkzeuge für große Datenmengen. Dafür steigt der Aufwand bei Plugins, Updates, Sicherheit und Hosting. Wartung ist dann ein fester Teil des Betriebs. Mehr dazu in unserem Ratgeber Webflow oder WordPress: Betriebskosten.
Wann Headless oder ein PIM sinnvoll wird
Ein PIM (Product Information Management) ist ein System, in dem Produktdaten zentral gepflegt und an Kanäle verteilt werden. Es lohnt sich, wenn Daten aus ERP oder PIM kommen, sehr viele Produkte und Varianten existieren oder mehrere Kanäle dieselben Daten brauchen. Die Website holt sich die Daten dann per Schnittstelle, oft in einem Headless-Aufbau. Das ist mehr Aufwand, kann bei großen Katalogen aber die saubere Lösung sein.
| Kriterium | Webflow | WordPress | Headless / PIM |
|---|---|---|---|
| Katalogumfang | klein bis mittel | mittel bis groß | sehr groß |
| Varianten und Felder | über Collections und Referenzen | sehr flexibel, plugin-abhängig | Datenmodell frei |
| Sprachen | Localization, plan-abhängig | Plugin oder Mehrsprachigkeit nötig | je nach System |
| Pflege | Redaktion im Editor, wenig Technik | Updates und Plugins laufend | Technik und Redaktion getrennt |
| Aufwand | geringer bis mittel | mittel | höher |
Weitere Plattformfälle erklärt unser Ratgeber Webflow oder WordPress: SEO und KI-Sichtbarkeit. Zur Entwicklung siehe Webentwicklung.
Ehrlich gesagt Sehr große Kataloge sind nicht der Sweet Spot von Webflow. Wenn du Zehntausende Datensätze aus einem ERP spiegeln willst, prüfen wir gemeinsam, ob Webflow plus Schnittstelle, WordPress oder ein Headless-Aufbau besser trägt.
Mehrsprachiger Katalog mit Deutsch als Quellsprache
Ein Katalog in vielen Sprachen, etwa 14, stellt eine eigene Aufgabe. Deutsch ist die Quelle, alle anderen Sprachen folgen. Die Frage ist nicht nur, welche Plattform das kann, sondern wie du Übersetzung und Freigabe organisierst.
Übersetzungsworkflow: Quelle Deutsch, Freigabe, Veröffentlichung
- Deutsche Daten sind die Quelle und werden zuerst freigegeben.
- Neue oder geänderte Felder werden markiert und an die Übersetzung gegeben.
- Übersetzungen werden fachlich geprüft, besonders Fachbegriffe und Einheiten.
- Jede Sprache wird eigenständig veröffentlicht, sobald sie freigegeben ist.
- Änderungen an der Quelle lösen einen neuen Durchlauf aus.
Webflow Localization: Grenzen und Alternativen
Laut Webflow-Dokumentation hat eine Website eine Primärsprache und weitere Sprachen, deren Zahl vom Plan abhängt. Einträge können Sprachvarianten haben, die dieselbe ID teilen, und jede Variante lässt sich einzeln veröffentlichen. Bilder lassen sich über die Daten-API nicht lokalisieren, das passiert im Designer. Bei sehr vielen Sprachen prüfst du also Plan, Limits und Pflegeaufwand zuerst. Alternativen sind Übersetzungsverwaltungen, WordPress mit Mehrsprachigkeit oder ein Headless-Aufbau mit eigenem Übersetzungssystem.
hreflang und Sprachumschalter
Google empfiehlt hreflang-Angaben, damit die richtige Sprachversion in der richtigen Suche erscheint. Wichtig ist: Jede Version muss sich selbst und alle anderen nennen, und fehlt ein Rückverweis, ignoriert Google die Angaben. Dazu kommt ein x-default für Nutzer, deren Sprache nicht abgedeckt ist (Google Search Central, lokalisierte Versionen). Der Sprachumschalter sollte auf die gleiche Seite in der anderen Sprache führen, nicht auf die Startseite.
Mehr zum Thema: Mehrsprachige Unternehmenswebsite. Welche mehrsprachigen Projekte wir zeigen können, besprechen wir im Erstgespräch.
UX der Produktdarstellung: Nutzerführung entwirren
Wenn die Nutzerführung eines Katalogs unklar ist, liegt es selten an einem einzelnen Button. Meistens fehlt die Informationsarchitektur: Wie heißen die Kategorien, welche Filter gibt es, wo steht was?
Informationsarchitektur: Kategorien, Filter, Suche
- Kategorien nach dem Denken des Kunden bilden, nicht nach interner Organisation.
- Filter auf echte Entscheidungsmerkmale begrenzen, etwa Leistung, Material, Einsatzgebiet.
- Suche mit Artikelnummern, Produktnamen und Fachbegriffen testen.
- Attribute bei allen Produkten gleich benennen, gleich sortieren und mit Einheit versehen.
Baymard empfiehlt für Spezifikationen, Labels, Reihenfolge und Format einheitlich zu halten, jede Zahl mit Einheit zu versehen, fachliche Begriffe an Ort und Stelle zu erklären und die wichtigsten Angaben nach oben zu stellen (Baymard, Spec-Sheet-UX). Das ist Forschung aus dem Onlinehandel, die Logik gilt aber genauso für technische Kataloge.
Produktseiten-Aufbau
| Modul | Zweck |
|---|---|
| Kurzbeschreibung und Nutzen | Zeigt in einem Satz, wofür das Produkt gedacht ist |
| Technische Daten | Einheitliche Tabelle mit Einheiten und Gruppen |
| Varianten und Zubehör | Auswahl und Vergleich ohne Seitenwechsel |
| Downloads | Datenblätter, Zertifikate, CAD-Daten, je nach Sprache |
| Anfrage und Ansprechpartner | Sichtbarer nächster Schritt auf jeder Seite |
Tests mit Nutzern und Vertrieb
Lass drei bis fünf Personen aus Vertrieb oder Kundschaft typische Aufgaben lösen, etwa „Finde ein Produkt für diese Anwendung“. Beobachte, wo sie zögern. Der Vertrieb weiß oft am besten, welche Fragen Kunden immer wieder stellen. Mehr zu unserer Arbeit am Nutzererlebnis findest du auf der Seite UX/UI-Design.
UX/UI-Agenturen für Industrie und Engineering: Kriterien
Wer UX/UI-Agenturen mit Erfahrung bei Produktdarstellungen in der Industrie sucht, bekommt schnell Namen, aber selten Vergleichbarkeit. Wir nennen keine Rangliste, sondern Kriterien.
Worauf du bei Referenzen achten solltest
- Zeigt die Referenz einen Katalog oder Produktbereich mit ähnlicher Komplexität?
- Erklärt die Agentur, wie sie Daten, Filter und Varianten strukturiert hat?
- Gibt es Nutzertests oder Messdaten, und sind sie freigegeben?
- Arbeitet die Agentur mit Design und Entwicklung zusammen, damit Entwürfe baubar bleiben?
- Kannst du mit Ansprechpartnern sprechen?
Zu unserer Erfahrung: Wir sind seit 2021 im Markt, haben über 140 Projekte und 250 Kunden betreut und sind einer von sieben Webflow Premium Partnern in Deutschland. Welche unserer Projekte für deinen Katalog vergleichbar sind, zeigen wir dir im Erstgespräch. Freigegebene Arbeiten findest du unter Work. Mehr zur Auswahl: UX/UI-Agentur auswählen.
Produktfotos und Art Direction: ein einheitlicher Look
Wenn Produktfotos bei jedem Shooting anders wirken, fehlt meist ein Regelwerk. Fotografen arbeiten dann nach Gefühl, und der Katalog bekommt ein Patchwork aus Lichtstimmungen und Perspektiven.
Bildstil festlegen
Lege vorab fest: Hintergrund, Licht, Perspektiven, Ausschnitt, Schatten, Farbtreue und Dateiformat. Halte das in einem kurzen Bildstil-Dokument fest, mit Beispielbildern. Art Direction heißt, diese Regeln zu entwickeln, zu briefen und beim Shooting zu prüfen. Mehr dazu: Art Direction und der Ratgeber Art-Direction-Agentur auswählen.
Shooting-Briefing und Shotlist
| Punkt | Festlegung |
|---|---|
| Licht | Lichtrichtung, Weichheit, Reflexionen bei Metall |
| Hintergrund | Farbe, Fläche oder Umgebung, immer gleich |
| Winkel | Pflichtansichten je Produkttyp |
| Ausschnitt und Format | Seitenverhältnis, Freisteller ja oder nein |
| Dateien | Format, Auflösung, Benennung |
Checkliste: Produktfoto-Briefing
- Ziel und Einsatz sind klar: Katalog, Datenblatt, Messe, Anzeige.
- Bildstil-Dokument mit Beispielbildern liegt vor.
- Pflichtansichten je Produkttyp sind definiert.
- Hintergrund und Lichtrichtung sind festgelegt.
- Shotlist enthält Produktnummern und Varianten.
- Dateiformat, Auflösung und Dateinamen sind abgestimmt.
- Nutzungsrechte sind geklärt.
- Eine Person prüft am Set gegen das Bildstil-Dokument.
Alternative: 3D-Renderings für Varianten
Bei vielen Varianten kann sich ein Rendering lohnen, weil du ein Modell in allen Ausführungen zeigen kannst. Ob Rendering oder Konfigurator besser passt, erklärt der Ratgeber 3D-Produktkonfigurator oder Rendering, einen Einblick gibt 3D und Motion für Industrie. Art Direction und Content-Produktion gehören zu unseren Leistungen. Welche Form für deine Produktfotos passt, klären wir im Erstgespräch.
Datenblätter, Zertifikate und Downloads
Datenblätter sind oft der wichtigste Download. Im CMS verwaltest du sie am besten als eigene Collection oder Dokumentenliste, die mit Produkten verknüpft ist. So steht ein Dokument an einer Stelle und erscheint überall, wo es gebraucht wird.
Versionen, Sprachen, Dateinamen
- Jede Datei hat Version, Datum und Sprache als eigene Felder.
- Dateinamen folgen einem festen Muster, zum Beispiel Produkt, Dokumenttyp, Sprache, Version.
- Alte Versionen bleiben archiviert, aber nicht verlinkt.
- Zertifikate haben ein Gültigkeitsdatum.
Details dazu in unserem Ratgeber Datenblätter und Zertifikate auf der Industrie-Website. Für die Suche helfen strukturierte Daten: schema.org beschreibt Produkte mit Eigenschaften wie Artikelnummer, Hersteller-Teilenummer, Marke und weiteren Merkmalen, und Google unterstützt Produktauszeichnung auch für Produktseiten ohne Kauf (Google, Produktdaten). Eine Garantie auf besondere Darstellungen gibt es nicht.
Projektablauf und Aufwand
Ein Katalogprojekt läuft bei uns in klaren Phasen. Eine Website dauert in der Regel etwa drei Monate, je nach Umfang zwei bis vier. Bei großen Katalogen kann es länger dauern, weil Datenaufbereitung und Import Zeit brauchen.
| Phase | Inhalt |
|---|---|
| Analyse | Ziele, Zielgruppen, Systeme, Datenquellen |
| Datenstruktur | Produktfamilien, Varianten, Attribute, Dokumente |
| Design | Moodboards, erste Sektionen, Produktseiten, Responsive |
| Aufbau | Entwicklung, CMS, Filter, Sprachen |
| Import und Test | Daten einspielen, Nutzer- und Vertriebstest, Korrekturen |
Was du liefern musst
- Produktdaten in einer sauberen Tabelle oder aus dem PIM.
- Fotos, Renderings und Dokumente mit Zuordnung zum Produkt.
- Übersetzungen oder einen Übersetzungsablauf.
- Ansprechpartner für Technik, Vertrieb und Marketing.
Zum Preis: Webdesign beginnt bei uns ab 8.000 €, reine Entwicklung ab 5.000 € netto. Einen Rahmen für Katalogprojekte nennen wir erst nach Produktanzahl, Sprachen und Datenquellen, das klären wir im Erstgespräch.
Wie wir das bei Webwavers umsetzen
Wir verbinden UX/UI, Webdesign, Webentwicklung, Art Direction, Motion Design inklusive 3D und Content-Produktion in einem Team. Webflow ist unser Schwerpunkt, dazu bauen wir mit WordPress, TYPO3 und Headless. Passende Seiten: Industrie und Engineering, UX/UI-Design, Art Direction, Webentwicklung. Weitere Branchen-Ratgeber: Energie-Websites, Luftfahrt-Websites, Kanzlei-Websites und nachhaltiges Webdesign.
Häufige Fragen
Webflow oder WordPress für eine Industrie-Website mit vielen Produktseiten?
Webflow passt für Kataloge mittlerer Größe mit hohem Designanspruch und einfacher Pflege. WordPress ist flexibel bei Feldern und Importen, braucht aber mehr Wartung. Bei sehr großen oder datengetriebenen Katalogen prüfst du Headless oder ein PIM.
Wie viele Produkte verträgt das Webflow-CMS?
Das hängt vom Plan ab, und die Limits ändern sich. Wir nennen deshalb keine Zahl. Prüfe die aktuellen Werte auf webflow.com und plane bei mehreren Sprachen mit, dass jede Sprachvariante zählt.
Welche Agenturen haben einen Katalog in vielen Sprachen umgesetzt?
Frag jede Agentur nach Projekten mit vergleichbarer Sprachanzahl und lass dir Ansprechpartner nennen. Von uns bekommst du im Erstgespräch eine Einschätzung, welche Projekte vergleichbar sind.
Welche UX-Agenturen haben Erfahrung mit Industrie-Produktdarstellung?
Achte auf Referenzen mit ähnlicher Datenkomplexität, Nachweise zu Tests und eine Zusammenarbeit von Design und Entwicklung. Wir verbinden beides in einem Team.
Wie bekommen wir einheitliche Produktfotos bei jedem Shooting?
Mit einem Bildstil-Dokument, einer Shotlist und jemandem, der am Set gegen die Regeln prüft. Das ist die Aufgabe der Art Direction.
Wie verwalten wir Datenblätter in mehreren Sprachen?
Als eigene Collection mit Feldern für Version, Sprache und Datum, verknüpft mit den Produkten und mit festem Dateinamenmuster.
Brauchen wir ein PIM-System für den Katalog?
Nur wenn Daten ohnehin in einem PIM oder ERP liegen oder mehrere Kanäle dieselben Daten brauchen. Für überschaubare Kataloge reicht oft ein CMS mit sauberem Datenmodell.
Wie lange dauert der Aufbau eines Produktkatalogs?
Eine Website dauert bei uns in der Regel etwa drei Monate, je nach Umfang zwei bis vier. Bei großen Katalogen kommt Zeit für Daten und Import dazu.
Fazit
Ein guter Industrie-Katalog beginnt mit der Datenstruktur, nicht mit dem Design. Die Plattform folgt aus Umfang, Sprachen und Pflege, Nutzerführung und Fotos aus klaren Regeln. Du hast einen Katalog, der wächst und unübersichtlich wird? Schick uns Produktanzahl und Sprachen, im Erstgespräch klären wir Plattform, Struktur und Vorgehen. Projekt anfragen.
Quellen
