House Consult: Website einer Hausverwaltung

Ausgangslage

House Consult verwaltet Mietobjekte, Wohngemeinschaften, Gewerbeobjekte und Sondereigentum in Jülich und Umgebung und ist laut Website seit 2012 als Einzelunternehmen tätig. Die Aufgabe war ein Neubau der Website.

Zwei Entscheidungen standen früh fest: Die Seite verzichtet bewusst auf „Über uns“, Team und Biografie, und sie führt die Verwaltung von Wohnungseigentümergemeinschaften nicht als Leistung auf. Alles auf der Seite dreht sich um die vier Verwaltungsbereiche und den Ablauf.

Gestaltungsentscheidungen

• Bildsprache: Dokumentarische Architekturbilder ohne Personen und ohne Ortsangaben, mit warmem Abendlicht und einem weißen Kubusgebäude. Sie sind mit KI erzeugt und am Bild als „mit KI & Liebe erstellt“ gekennzeichnet. Der Hero liefert per picture-Element getrennte Bilder für Querformat und Hochformat (bis 700 Pixel Breite).
• Typografie: Work Sans für Überschriften, Inter für Fließtext, beide als woff2 selbst gehostet. Die Schriftgrößen skalieren fließend, lange deutsche Wörter in Überschriften trennt der Browser automatisch.
• Farbe: Tinte (#1C1C1C) auf Weiß, dazu ein einziger Akzent in Blau (#12508C). Flächen und Linien bleiben neutral grau, Ecken haben nur 4 Pixel Radius.
• Bewegung: Auf der Startseite läuft ein Preloader von rund 1,8 Sekunden mit Wortmarke und Fortschrittsbalken. Danach fährt das Hero-Bild in 2,5 Sekunden von 60 auf 100 Prozent Größe, Eyebrow, Überschrift und Button steigen je 50 Pixel in 1 Sekunde nach oben. Auf den übrigen Seiten gibt es nur kurze Einblendungen. Kein Parallax, kein Scroll-Jacking. Bei reduzierter Bewegung erscheint alles sofort, ohne JavaScript ist die Seite direkt nutzbar.
• Hero-Inhalt: Eyebrow „Hausverwaltung seit 2012“, die zweizeilige Aussage „Klar verwaltet. Sauber abgerechnet.“ und ein Button. Fließtext gibt es im Hero nicht.

Aufbau und Seiten

Die Website hat elf Seiten: Start, Leistungen mit vier Detailseiten (Mietverwaltung, WG-Verwaltung, Gewerbeverwaltung, Sondereigentumsverwaltung), Ablauf und Preise, Kontakt, Impressum, Datenschutz und 404.

Die Seite Ablauf zeigt fünf Schritte von der Anfrage über die Sichtung der Unterlagen und die Übergabe bis zur laufenden Verwaltung und Abrechnung. Die vier Leistungsseiten und die Ablaufseite enthalten Fragen und Antworten. Das Kontaktformular prüft Eingaben im Browser, ein Honeypot-Feld fängt Bots ab, der Versand läuft über einen mailto-Link.

Technik

Die Website besteht aus statischem HTML, CSS und Vanilla-JavaScript, ohne Framework. Ein Mini-Build in Node (nur Node-Standardbibliothek, kein npm) setzt Kopf, Fuß und Head-Bereich aus Bausteinen in alle Seiten ein und erzeugt Sitemap und robots.txt.

Strukturierte Daten (RealEstateAgent, Service, FAQPage, BreadcrumbList) entstehen automatisch aus dem Seiten-Markup: Fragen und Antworten werden nur einmal im HTML gepflegt. Bilder liegen als WebP mit JPG-Fallback vor. Das Layout wurde per Geräteemulation in Chromium von 320 bis 1920 Pixel Breite auf allen elf Seiten ohne horizontalen Überlauf geprüft. Ein Test im echten Safari steht aus.

Was das Projekt zeigt

Nicht jede Website braucht große Bewegung. House Consult zeigt das Gegenstück zu einer Seite mit starken Effekten: Eine Verwaltung will Klarheit, also sind Hierarchie, Lesbarkeit und ein sauberer Ablauf die Gestaltung. Die Bewegung dient nur dem Auftritt und bleibt danach ruhig.