Eine gute Herstellerwebsite beginnt nicht mit dem Slogan „Wir sind innovativ“, sondern mit Antworten auf einfache Fragen: Was ist das, woraus besteht es und wie bestellt man es? Für die Marke ECODDC aus Bydgoszcz haben wir ein solches Portal erstellt: ecoddc.pl. Es ist die Unternehmenswebsite eines Herstellers umweltfreundlicher Schreibtisch-Organizer aus Wellpappe, auf der Produkt, Material und Kontakt nur einen Klick voneinander entfernt sind. In dieser Fallstudie zeigen wir, wie wir sie für ein Geschäftskundenpublikum gestaltet haben.
Kurzfassung: Unternehmenswebsite eines Herstellers umweltfreundlicher Büro-Organizer
- Kunde: ECODDC, Hersteller von Schreibtisch-Organizern aus BC-Wellpappe, Bydgoszcz
- Branche: Bürobedarf, ökologisches Design, Verkauf an Unternehmen
- Leistungsumfang: Grafikdesign, mehrseitige Website (Startseite, zwei Produktseiten, Über uns, Kontakt), Anfrageformular, Cookie-Banner, rechtliche Seiten
- Technologien: HTML5, CSS3, JavaScript, PHP (Formularverarbeitung)
- Website-Adresse: ecoddc.pl
Die Herausforderung: ein ungewöhnliches Material erklären und das Produkt für Unternehmen zeigen
Ein Organizer aus Pappe klingt für viele nach einer Übergangslösung. Laut der Beschreibung auf der Seite Über uns will die Marke jedoch zeigen, dass BC-Wellpappe ein langlebiges, ästhetisches Element des Arbeitsplatzes sein kann. Die Website musste also zwei Dinge gleichzeitig leisten: Vertrauen in das Material aufbauen und das Produkt so zeigen, dass man es sich auf dem eigenen Schreibtisch vorstellen kann.
Hinzu kamen Merkmale, die in der Kommunikation leicht verwässern: CNC-Bearbeitung, die Zero-Waste-Philosophie, Recyclingfähigkeit und farbliche Personalisierung. Hätte man alles ohne Ordnung auf eine Seite gepackt, hätte der Besucher das Produkt nicht von den Markenslogans unterscheiden können. Aus dem Briefing ergaben sich vier Anforderungen:
- klare Trennung von Marke und den zwei Produkten: EcoStack und StarLinkPanel,
- konkrete technische Daten statt Allgemeinplätzen,
- einfacher Weg zur Anfrage zu einem Produkt oder zur Personalisierung,
- eine leichte, schnelle Website, die auf dem Smartphone und am Computer gut aussieht.
Das ist keine typische Dienstleistungswebsite. ECODDC verkauft physische Produkte, daher haben wir den gesamten Aufbau des Portals der Produktpräsentation untergeordnet und nicht einem Leistungskatalog.
Wie wir an dem Projekt gearbeitet haben
Wir haben damit begonnen, die Materialien des Kunden zu ordnen: Produktbeschreibungen, Fotos und Parameter. Daraus entstand eine Informationsstruktur, in der die Startseite die Idee der Marke erklärt und jedes Produkt eine eigene Unterseite mit Spezifikation und Galerie erhält. Anschließend haben wir ein grafisches Konzept auf Basis eines ruhigen Grüns und der natürlichen Farben der Pappe erstellt, es im Code umgesetzt und auf verschiedenen Bildschirmbreiten getestet. Zum Schluss haben wir Formular, Cookie-Banner und die rechtlichen Unterseiten geprüft.
Die Lösung: eine Website, die das Produkt durch Erklären verkauft
Das Portal besteht aus der Startseite, den Produktseiten EcoStack und StarLinkPanel, der Unterseite Über uns sowie dem Kontakt. Das Menü ist kurz, und der Kontaktbutton ist im Header hervorgehoben, sodass die Besucher nicht suchen müssen, wie sie sich melden können.
Startseite: drei Säulen der Marke und zwei Produkte
Der erste Bildschirm zeigt das Produkt in realer Umgebung und zwei Buttons zu den Produktseiten. Weiter unten stellt die Seite drei Säulen der Marke vor: CNC-Technologie, Zero Waste und Recycling. Sie sind kurz in drei Kacheln dargestellt, erst danach folgen die Produkte. Die Besucher verstehen also zuerst die Idee und sehen dann, wie sie sich in konkreten Erzeugnissen niederschlägt.
Zero-Waste-Schema statt langer Beschreibung
Statt eines Absatzes über Abfallvermeidung haben wir ein einfaches Schema vorbereitet: Der Eingang ist ein Bogen BC-Pappe, der Ausgang das Panel StarLinkPanel und drei zusätzliche Organizer (für Tablet oder Telefon, für Kabel und für Stifte). Laut der Website entstehen diese zusätzlichen Produkte aus den freien Flächen des Bogens. Eine solche Visualisierung erklärt das Konzept in wenigen Sekunden.
Produktseiten mit Spezifikation und Galerie
Jedes Produkt hat eine eigene Unterseite mit Beschreibung, Liste der Merkmale, Tabelle mit technischen Daten und einer Galerie, deren Fotos in einer leichten Lightbox vergrößert werden. Auf der Seite von EcoStack steht zum Beispiel, dass das Modul für Utensilien aus 25 Pappschichten besteht und das Modul für Kabel aus 6 Schichten und dass sich die Module übereinander oder nebeneinander anordnen lassen. Ergänzt wird das Ganze durch den Ablauf „So funktioniert es“ in drei Schritten: Module wählen, Farbe wählen und nach Bedarf anordnen.
Anfrageformular mit Produktauswahl
Auf der Kontaktseite befindet sich ein Formular: Name, E-Mail, optional Telefon und Firma, eine Produktliste (EcoStack, StarLinkPanel, beide, Personalisierung oder andere Anfrage) und die Nachricht. Daneben stehen die Kontaktdaten des Unternehmens und eine Karte. Das Formular wird ohne Neuladen der Seite gesendet, und die Nutzer sehen sofort eine Bestätigung oder eine Fehlermeldung.
Farbliche Personalisierung als Teil des Angebots
Laut der Website werden die Produkte mit Papier in der gewählten Farbe kaschiert, und auf der Startseite ist die Palette zu sehen: Kraft, Blau, Terrakotta, Grün, Violett, Rosa, Graphit, Stroh und Beige. Unter der Palette steht eine Aufforderung, nach einer anderen Farbe zu fragen. Das ist ein einfacher Weg, die Anpassung des Produkts an die visuelle Identität des Unternehmens zu zeigen, ohne einen Konfigurator zu bauen.
Unterseite Über uns: die Philosophie der Marke an einem Ort
Die Inhalte zu den Werten der Marke wurden nicht über das ganze Portal verstreut. Auf der Seite Über uns haben wir die Philosophie des Unternehmens, die Beschreibung des BC-Materials und eine Liste dessen zusammengetragen, was die Marke laut eigener Aussage auszeichnet: die eigene Methode des wechselseitigen Verklebens, die sternförmigen Verbinder im StarLinkPanel, die Personalisierung und der geschlossene Materialkreislauf. So bleiben Startseite und Produktseiten knapp, und wer mehr wissen will, hat einen Ort, an den er gehen kann.
Responsivität und Barrierefreiheit
Das Layout passt sich der Bildschirmbreite an, dank einer Reihe von CSS-Regeln für Smartphones und Tablets. Die Fotos in den unteren Abschnitten werden verzögert geladen, sodass der erste Bildschirm nicht auf die ganze Galerie wartet, und Nutzer, die im System Animationen deaktiviert haben, bekommen keine Bewegungseffekte. Die Lightbox-Buttons haben Beschreibungen für Screenreader und die Formularfelder Labels.
SEO, DSGVO und Sicherheit
Jede Unterseite hat einen eigenen Titel und eine Meta-Beschreibung, die Startseite hat eine kanonische Adresse und Open-Graph-Tags, sodass der Link nach dem Teilen gut aussieht. Wir versprechen keine Positionen bei Google, denn sie hängen von vielen Faktoren außerhalb des Codes ab, aber der Inhalt ist so geordnet und beschrieben, dass die Suchmaschine ihn verstehen kann.
- DSGVO (RODO): Das Formular verlangt die Einwilligung in die Datenverarbeitung zur Beantwortung der Anfrage; die Website hat eine Datenschutzerklärung und Nutzungsbedingungen.
- Cookies: Banner mit den Optionen „Alle akzeptieren“, „Nur notwendige“ und „Einstellungen verwalten“ sowie ein Link zur Änderung der Präferenzen in der Fußzeile.
- Formular: serverseitige Validierung, ein verstecktes Feld gegen Bots und das Verwerfen von Zeilenumbrüchen in Feldern, die in Nachrichten-Header gelangen.
Technologien
Die Website nutzt kein WordPress. Es sind statische HTML5-Unterseiten mit CSS-Stilen, einer JavaScript-Datei (Animationen beim Einblenden der Abschnitte, Lightbox, Versand des Formulars und Cookie-Verwaltung) und einem PHP-Skript, das das Formular entgegennimmt und die Nachricht an das Postfach des Unternehmens sendet. Die Kontaktkarte wird verzögert geladen, die Schriften stammen von Google Fonts. Diese Wahl ist bei wenigen festen Unterseiten sinnvoll: schnell, einfach und günstig im Unterhalt.
Warum eine eigene Website und nicht nur ein Produktkatalog
Ein Hersteller, der seine Produkte nur in Angeboten auf Portalen beschreibt, gibt die Kontrolle darüber ab, wie sie präsentiert werden, und konkurriert über den Preis mit ähnlichen Artikeln. Eine eigene Website erlaubt es, die Geschichte des Materials und des Prozesses zu erzählen, technische Daten in dem Layout zu zeigen, das die Marke wählt, und Anfragen direkt ohne Zwischenhändler entgegenzunehmen. Bei ECODDC ist das besonders wichtig, denn der Wert des Produkts liegt in der Art seiner Entstehung, und das passt schwer in eine Standardbeschreibung auf einem Marktplatz.
Das Ergebnis
Der Kunde erhielt eine Website, die Marke und zwei Produkte klar trennt, das ungewöhnliche Material erklärt und zur Anfrage führt. Wir nennen keine Verkaufs- oder Besucherzahlen, da wir sie nicht veröffentlichen. Der qualitative Effekt zeigt sich in der Struktur selbst: Jede Information hat ihren Platz, und der Weg vom Produktfoto zum Formular besteht aus wenigen Klicks. Die Aussagen zu Ökologie und Recycling stammen von der Marke, und so präsentieren wir sie auch. Die Website ist für den Ausbau bereit: Weitere Produkte lassen sich als neue Seiten im selben Layout ergänzen, ohne alles umzubauen.
Für wen diese Lösung geeignet ist
Dieser Ansatz eignet sich für Hersteller und kleine Manufakturen, die ein bis mehrere Produkte haben, an Unternehmen verkaufen und eine Website brauchen, die Technologie oder Material erklärt. Wenn ein Produkt vor dem Kauf Absprachen erfordert, etwa zu Farbe, Maßen oder Menge, ist ein Anfrageformular besser als ein Warenkorb. Sehen Sie sich auch unsere Leistungen an.
Herstellerwebsite für Unternehmen: Material zeigen und zur Anfrage bewegen
ECODDC ist laut Beschreibung eine Marke aus Bydgoszcz, die Organizer aus Wellpappe an Unternehmen verkauft. Ein solches Angebot erfordert eine Website, die das Material erklärt, technische Daten zeigt und Anfragen sammelt, statt einen Shop nachzuahmen. Bewährt hat sich hier die Reihenfolge: zuerst die Idee der Marke, dann die Produkte, schließlich das Formular mit Produktauswahl und Personalisierung. Im B2B-Verkauf braucht der Kunde oft Absprachen vor dem Kauf, etwa zu Farbe oder Menge, deshalb ist die Anfrage manchmal besser als ein Warenkorb.
Diese Website ist statisch, ohne WordPress, und das ist bei wenigen festen Unterseiten eine vernünftige Wahl: Sie ist schnell und einfach zu pflegen. Wie die Geschwindigkeit die Wahrnehmung einer Website beeinflusst, erklärt der Artikel über die Optimierung der Geschwindigkeit von WordPress-Seiten. Über die Produktpräsentation auf Bildschirmen unterschiedlicher Größe schreiben wir im Text über Webdesign. Eine ähnliche Philosophie der leichten Visitenkarten-Seite finden Sie in der Umsetzung Website des Saftherstellers Sokoniada.
Möchten Sie wissen, was eine solche Website kostet? Nutzen Sie den Preisrechner, sehen Sie sich die Leistungen an oder kontaktieren Sie uns.
FAQ
Muss die Website eines Herstellers von Produkten für Unternehmen einen Onlineshop haben?
Nicht immer. ECODDC zeigt Produkte, Parameter und die Möglichkeit der Personalisierung, und die Bestellung beginnt mit einer Anfrage über das Formular. Bei Produkten, die an das Unternehmen angepasst werden, zum Beispiel in der Farbe, ist ein solches Modell oft bequemer als ein Warenkorb, weil zuerst die Details geklärt werden müssen.
Warum läuft diese Website nicht mit WordPress?
Das Portal hat wenige feste Unterseiten und kaum Inhalte, die sich im Lauf der Zeit ändern, daher genügt statisches HTML mit einem PHP-Skript für das Formular völlig. Es ist schnell, einfach zu pflegen und hat eine kleinere Angriffsfläche als ein umfangreiches CMS. Wenn die Inhalte zunehmen, kann man es auf WordPress umziehen.
Wie beschreibt man ein ökologisches Produkt, ohne bei den Aussagen zu übertreiben?
Man sollte sich an das halten, was der Hersteller begründen kann: Material, Herstellungsweise, Recyclingfähigkeit. Slogans wie „100 % ökologisch“ auf der Website von ECODDC sind Aussagen der Marke, und so behandeln wir sie auch. Für die Richtigkeit der Behauptungen ist das Unternehmen verantwortlich, wir kümmern uns um ihre übersichtliche Darstellung.
Was bringt ein Anfrageformular statt nur einer E-Mail-Adresse?
Das Formular erfasst sofort die nötigen Informationen: Kontaktdaten, Unternehmen und das Produkt, auf das sich die Frage bezieht. So kann die erste Antwort konkret ausfallen. Zusätzlich sind serverseitige Validierung, DSGVO-Einwilligung (RODO) und ein verstecktes Feld gegen Bots aktiv.
Wie lange dauert die Erstellung einer solchen Visitenkarten-Seite für einen Hersteller?
Die Dauer hängt von der Zahl der Produkte, der Verfügbarkeit von Fotos und Texten und davon ab, ob eine zusätzliche Funktion nötig ist. Deshalb nennen wir ohne Gespräch keine festen Termine. Nach einem kurzen Briefing können wir Umfang und Zeitplan für das konkrete Unternehmen bestimmen.
Sie suchen eine Website für einen Hersteller oder eine Produktmarke? Sehen Sie sich unsere Leistungen an, schauen Sie sich weitere Referenzprojekte an oder schreiben Sie uns, und wir erstellen einen auf Ihr Unternehmen zugeschnittenen Vorschlag.
