Wir freuen uns sehr, dass wir heute wieder über eine neue Website-Kundenreferenz für einen Kunden aus der Handwerksbranche – dem Sachverständigen-Büro Günther Wagner in München – berichten können.
Der Kunde
Günther Wagner ist nicht nur ein Sachverständiger, sondern darüber hinaus auch Inhaber der Spenglerei und Dachdeckerei Wagner in München-Moosach. Wir durften bereits 2015 die neue Website für dieses Unternehmen, die Günther und Eduard Wagner GbR, erstellen. Sechs Jahre später beauftragte Herr Wagner uns nun auch seine Website für sein Sachverständigen-Büro zu erstellen, was uns natürlich sehr gefreut hat.
Das Projekt
Als uns Herr Wagner zu Beginn skizzierte, in welche Richtung das Design gehen und welche Inhalte dargestellt werden sollten, hatten wir sofort die zündenden Idee: das war 10 Jahre nach unserer Unternehmensgründung 2012 endlich die Gelegenheit für uns, zum ersten Mal eine OnePager-Website für einen Kunden zu erstellen!
Als OnePager werden Websites bezeichnet, die im Single Page Webdesign dargestellt werden, wo also die Nutz-Inhalte auf einer einzigen HTML-Seite präsentiert werden. Der Inhalt dieser Website wird somit auf dieser einen Seite vertikal aufgebaut. Nur die rechtlichen Pflicht-Seiten, also Impressum und Datenschutzerklärung, erhalten eigenständige Inhaltsseiten.
Um bei OnePagern einzelne Bereiche voneinander abzugrenzen, werden grafische Elemente benutzt. Anders als bei Webseiten mit Unterseiten, wird die Struktur in der Regel über sogenannten Sektionen und Sprungmarken erreicht, die man über die Menüpunkte aus der Navigation direkt “anspringen” kann.
Was das “Anspringen” etwas kniffliger macht kam auch hier zum Tragen: ein fixer, feststehender Bereich (hier die Navigationsleiste). Denn der “Sprungmechanismus” in HTML berücksichtigt solche fixen Elemente nicht bzw. “weiß nichts davon”.
Hier hat man dann grundsätzlich zwei Möglichkeiten: entweder man setzt einen eigenen Event-Handler ein (der meist mit JavaScript realisiert wird), der das “Springen” (Scrollen) zur richtigen Position realisiert, oder man setzt die Sprungziele (Anker) an Stellen im HTML-Code, welche den zusätzlich notwendigen Abstand zum oberen Bildschirmrand realisieren.
Eine weitere Besonderheit dieser Website, die auch wir erstmalig zum Einsatz gebracht haben – die Website hat insgesamt drei feststehende Bereiche: die Kopfleiste, die Fußleiste, und die Navigationsleiste auf der linken Seite.
Die Website des Sachverständigen-Büro Günther Wagner
Das vollflächige Hintergrundbild der Website stammt – wie schon auf der Website für die Spenglerei und Dachdeckerei – vom Unternehmer selbst. Wir waren uns beim ersten Blick darauf einig, dass dieses Bild stimmig zum Website-Design und zum Thema passt.
Fazit
Die fixe Navigationsleiste für das Responsive Design zu gestalten war eine kleine Herausforderung, die uns aber wie immer bei solchen technischen Kniffen viel Spaß bereitet hat.
Wir hatten erneut eine tolle und konstruktive Zusammenarbeit mit unserem Kunden Günther Wagner und seiner Frau Helga, und möchten uns an dieser Stelle auch nochmals herzlichst dafür bei den beiden bedanken!
Antworten