Werkveilig

Ausgangslage

Die Bereiche des Instituut voor Veiligheid & Milieu für Besucher mit unterschiedlichen Zielen darstellen: eine Schulung finden, die Leistungen verstehen oder Unterstützung anfragen. Eine große Menge an Inhalten sollte überschaubar bleiben.

Die Aufgabe

Kurse, Branchen, Leistungen und Fachinhalte nicht zu einem einzigen Strom vermischen. Die Navigation soll Besuchern helfen, ihr Anliegen zu erkennen und zu einem konkreten Angebot zu gelangen.

Unsere Lösungen

1. Mehrere Einstiege, eine Architektur

   Die Startseite öffnet die Hauptbereiche, die innere Struktur trennt Schulung, Leistungen, Branchenanforderungen und Wissen. Jeder Einstieg setzt sich als eigener Weg fort.

2. Der Schulungskatalog als Arbeitswerkzeug

   Im UX/UI ist der Weg vom allgemeinen Bereich zum konkreten Kurs ausgearbeitet. Der Katalog hat eine eigene Informationshierarchie und eine responsive Darstellung.

3. Kontakt im richtigen Moment

   Formulare und Kontaktpunkte sind Teil der Angebotsstruktur. Besucher können genau dort eine Frage stellen oder sich anmelden, wo sie die passende Leistung verstanden haben.

4. Ein System für viel Inhalt

   Exo 2 vereint Navigation, Überschriften und Fließtext. Kontraste in Gewicht und Größe trennen die Ebenen, Farbe unterscheidet Flächen und Akzente.

Was wir umgesetzt haben

1. Architektur und Nutzerwege

   Wir haben eine große Informationsmenge nach Leistungen, Branchen, Schulungen und Fachinhalten gegliedert und den Weg zum passenden Bereich und seinem Kontaktpunkt gestaltet.

2. UX/UI und visuelles System

   Wir haben einheitliche Interfaces für Startseite, Katalog und Unterbereiche gestaltet, mit Desktop- und Mobile-Layouts, die die Marke erkennbar und die Hierarchie klar halten.

3. Entwicklung und Konfiguration

   Wir haben Website, Formulare und Kontaktpunkte umgesetzt und die Strukturen für Leistungen und Branchen mit dem Schulungskatalog und den Fachressourcen verbunden.

4. SEO, Tests und Launch

   Wir haben Inhalte und SEO-Struktur organisiert, Tests und die finale Optimierung durchgeführt und das Projekt mit einem durchgängigen Weg vom Angebot bis zur Anfrage zum Launch gebracht.

Visuelles System

Eine grüne Basis, ein Limettenakzent und dunkler blaugrüner Text ergeben ein professionelles, gut lesbares Interface. Auf der Startseite wird ein großes Foto von Einstiegen in die Bereiche begleitet, danach wechseln sich Informations- und Bildblöcke ab.

Schriftfamilie

Exo 2 · Schnitte 300, 400, 700, 800

Fließtext

16 px · 300 · Zeilenabstand 1,5

H1

800 · clamp(32 px, 4vw, 52 px) / 1

H2 / H3

28–44 px / 24–28 px · Gewicht 800

Navigation / Buttons

18 px, 800 / 16 px, 700

Container

1280 px; breite Blöcke bis 1456 px; Ränder 24 px

Referenzbreiten

640 · 768 · 1024 · 1280 · 1456 px

Nutzerwege und Material

Ein Bereich auf der Startseite → Leistungen oder Schulungskatalog → konkretes Angebot → Anfrage. Branchenbereiche und Fachinhalte bieten zusätzliche Einstiege in dieselbe Struktur.

Vermarktung

Wir haben die Website für Suchmaschinen optimiert, ein Google-Ads-Konto eingerichtet und Werbung sowie Suchmaschinenmarketing gestartet.

Das Ergebnis

IVM hat eine funktionierende Unternehmenswebsite für den niederländischen Markt. Unternehmen, Leistungen, Schulungen und Fachressourcen teilen sich eine Struktur. Besucher wählen einen Bereich und melden sich mit ihrem Anliegen – am großen Bildschirm wie am Smartphone. Architektur, Design und die komplette Umsetzung liefen in einem Projekt bis zum Launch.

Werkzeuge und Umsetzung

UX/UI · responsive Webentwicklung · HTML / CSS · SEO-Struktur