Die Arbeit spricht für sich. Auch auf der Website.
Die Aufgabe
Die Aufgabe bestand darin, vier Leistungsbereiche von ANCHORDEI in einer klaren Unternehmenswebsite zu verbinden: Klimatechnik, Abbruch und Abtransport, Asphaltierung und Pflasterarbeiten. Besucher sollen die passende Leistung erkennen, ihren Umfang verstehen und den nächsten Schritt für ihr Objekt finden.
Die Lösung
Wir gestalteten eine individuelle Website mit acht Seiten, einer dunklen graphitgrünen Farbwelt, feiner kyrillischer Typografie und großen thematischen Bildern. Klimatechnik steht im ersten Bildschirm im Mittelpunkt; jede Leistung hat eine eigene Seite, konkrete Erläuterungen und direkte Kontaktlinks.
Design mit Bezug zur Arbeit
Die Bildsprache greift Materialien und Technik auf: Klimasysteme, Asphalt, Walzen, Pflastersteine und Bauoberflächen. Wir entwickelten ein geometrisches Zeichen, eine klare Navigation, illustrative Bilder und eigene SVG-Details.
Unterschiedliche Aufnahmen auf den einzelnen Seiten geben jeder Leistung ihren eigenen Charakter.
Scrollgesteuerte Animationen mit natürlichem Rücklauf
Wir entwickelten umkehrbare Animationen mit GSAP und ScrollTrigger. Das Hero-Bild öffnet sich bildschirmfüllend und legt die Botschaft zur Klimatechnik frei. Die Leistungen wechseln über eine gemeinsame Maske für Bild und Text, begleitet von sanfter Bildbewegung und Fortschrittsanzeige.
Beim Hochscrollen läuft dieselbe Abfolge rückwärts.
Animierter Arbeitsablauf und mobile Bewegung
Der Bereich „Erst planen. Dann handeln.“ verbindet vier Schritte durch eine nacheinander gezeichnete Linie und SVG-Skizzen. Auf Smartphones wird die Anordnung vertikal; Hero und Leistungen behalten separat abgestimmte Animationen.
Vorab definierte Sticky-Höhen und lokale Schriften unterstützen einen stabilen Seitenaufbau. Bei reduzierter Bewegung bleiben die Inhalte ohne Scroll-Effekte zugänglich.
Interaktiver Vergleich, Leistungsauswahl und 45 Preise
Wir ergänzten einen Vorher-nachher-Schieberegler mit einer illustrativen Visualisierung einer Fahrbahn sowie eine Leistungsauswahl mit Hinweisen zur Anfrage. Eine eigene Klimaseite ordnet 45 Preise nach Gruppen, mit klaren Einheiten und Bedingungen.
Die Telefonnummer ist direkt anklickbar; das Formular bereitet einen kopierbaren Text zur gewählten Leistung vor.
Technische Grundlage für SEO, GEO und AEO
Wir erstellten individuelle Titel, Meta-Beschreibungen und kanonische URLs für alle acht Seiten, Breadcrumbs und interne Verknüpfungen zwischen den Leistungen. Hinzu kamen strukturierte Daten für Organisation, Leistungen, Preise und Fragen sowie Sitemap, robots.txt und llms.txt.
Telefonnummer und Einsatzgebiet sind einheitlich dargestellt; die Informationen sind für Suchmaschinen und KI-Systeme in HTML zugänglich.