Webdesign für das Unternehmen Fregat Service.
Aufbau der Website
IT-Service mit Preisen, die man vergleichen kann
Ein IT-Service repariert und richtet Computer, Netzwerke und Videoüberwachung ein. Das Design führt in zwei Klicks zur passenden Leistung und zeigt Pakete mit festen Preisen. Klicken Sie auf einen Akzent – der Bildschirm springt an die Stelle.
01Startseite
Vier Bereiche, ein Kontaktweg
Kunden kommen mit einem konkreten Problem. Darum stehen die vier Bereiche (Internet und WLAN, Sicherheit und Video, Computer-Service, IT-Outsourcing) als eigene Leiste unter dem Kopf, und das Kontaktformular ist schon im ersten Bildschirm.
Akzente
-
Arbeitszeit, Telefon und der Button „Wir rufen zurück“ stehen im Kopf jeder Seite.
-
Jeder Bereich öffnet eine Liste konkreter Leistungen, z. B. Montage, Modernisierung oder Diagnose von Videoanlagen.
-
Name, Telefon, Nachricht: drei Felder neben dem Angebot, ohne Suche nach der Kontaktseite.
-
Router, Videoanlagen, Computerservice, Netzwerkmontage: Bild und Name, ein Klick zur Leistung.
-
Bekannte Handelsketten als Partner geben Vertrauen, bevor man anruft.
Beantwortet
- Macht ihr auch Videoüberwachung?
- Wann seid ihr erreichbar?
02Leistungsseite
Drei Pakete statt „Preis auf Anfrage“
Für „Notebook / PC einrichten“ gibt es drei Pakete mit Liste, was drin ist und was nicht, und festen Preisen. Das mittlere Paket ist hervorgehoben. Darunter stehen Einzelleistungen mit Preis und Button.
Akzente
-
Die Leiste der vier Bereiche wiederholt sich auf jeder Seite, der Wechsel ist ein Klick.
-
Gleiche Zeilen in allen drei Spalten: Häkchen und Kreuze zeigen sofort den Unterschied.
-
Das mittlere Paket ist höher und farbig: Der Blick landet dort, wo die meisten wählen.
-
Virenentfernung, Diagnose, Reinigung: jede Zeile mit kurzer Erklärung, Preis und eigenem Bestell-Button.
Beantwortet
- Was kostet die Einrichtung meines Notebooks?
- Was ist im Paket enthalten?
03Styleguide
Ein System für alle Seiten
Zum Design gehört ein kleiner Styleguide: Farbpalette, Button-Zustände und Schrift. So sehen neue Seiten aus wie die alten, und die Umsetzung ist schneller.
Akzente
-
Graublau als Basis, Rot nur für Aktionen: Bestellen und Rückruf fallen sofort auf.
-
Normal, Hover, Active: Für jeden Button ist festgelegt, wie er reagiert.
-
Montserrat in allen Überschriften und Texten hält das Bild ruhig.