Ink
#071224
Tiefster Ton für Hero-Grundlage und starke Kontraste.
01 Markenkern
Blueforce ist kein abstraktes Agentur-Label, sondern die persönliche Arbeitsweise von Roger Perren. Die Marke soll nahbar, direkt, kompetent und unaufgeregt professionell wirken.
Claim
Weniger Agentur.
Mehr Mensch.
Mehr Mensch.
Positionierung
Persönliche Websites, Betreuung und ehrliche Beratung für KMU, Selbstständige und Vereine in der Schweiz.
Markenwerte
Direkt
Verlässlich
Klar
Persönlich
02 Farbpalette
Die neue Seite arbeitet mit tiefem Blau, dunklem Ink-Fundament und einem warmen Amber-Akzent. Die alten, flachen Blauwerte sind nicht mehr führend.
Blue Dark
#0A2463
Primärer Markenanker für Headlines, Flächen und dunkle Abschnitte.
Blue
#1B4FD8
Haupt-CTA, interaktive Akzente, Fokus-Farbe.
Blue Light
#3B82F6
Verläufe, Hover-Stimmung, feinere Highlights.
Blue Faint
#EEF3FF
Weiche Sektionen, Icons, Badges, helle Kontrastflächen.
Accent Amber
#F59E0B
Claim-Akzent, Sterne, gezielte Aufmerksamkeitsführung.
Text
#1A202C
Primärer Lesetext auf hellen Flächen.
Border
#E2E8F0
Trennlinien, ruhige Kartenkanten, formale Struktur.
03 Typografie
Schriftfamilie
Inter
Verwendet in der Landingpage für alle Texte. Starke Gewichte 700/800 sind zentral für den Auftritt.
H1
Weniger Agentur. Mehr Mensch.
clamp(2.2rem, 5vw, 3.6rem) · 800
H2
Alles, was deine Website wirklich braucht
clamp(1.7rem, 3.5vw, 2.4rem) · 700
H3
WordPress-Entwicklung
1.2rem · 600
Body
Ich baue und betreue persönliche Websites für KMU, Selbstständige und Vereine, die direkt mit der umsetzenden Person arbeiten wollen.
1rem · 400 · 1.65
Label
Was ich mache
.8rem · 700 · uppercase
Claim
Weniger Agentur. Mehr Mensch.
1.35rem · 800
04 Komponenten
Die neue Landingpage lebt von ruhigen Karten, kontrollierten Pill-Elementen, klaren CTAs und einem Hero mit Glassmorphism-Anmutung. Der Stil soll modern wirken, aber nicht verspielt oder trendy um jeden Preis.
Pills & Badges
Elementor
Rank Math SEO
ManageWP
Antwort innert 24 Stunden
Service-Karte
Weisse Fläche, feine Border, leichter Schatten, klare Informationshierarchie.
ruhig statt aggressiv
saubere Abstände
klare Nutzenpunkte
Pricing-Karte
Flex-Layout mit stabilem CTA-Sitz, damit Karten in Reihen sauber auf einer Linie enden.
gleichmässige Höhen
klare Preislogik
Meistgebucht optisch priorisieren
Testimonial
Vertrauen entsteht über Lesbarkeit und Klarheit, nicht über visuelles Theater.
Sternfarbe nur als Akzent
Zitat ruhig führen
Autor klar verankern
05 Hero-System
Weniger Agentur. Mehr Mensch.
Erst verstehen.
Roger Perren · Kirchberg BE · Schweiz
Erst verstehen.
Dann sichtbar werden.
Ich analysiere Markt, Konkurrenz und Suchverhalten, bevor ich deine Website umsetze. So entsteht kein hübscher Leerlauf, sondern ein Auftritt, der klar positioniert ist und bei den richtigen Anfragen besser gefunden wird.
★★★★★
11 Google-Rezensionen, alle mit 5 Sternen
So arbeite ich
Markt prüfen.
Konkurrenz lesen.
Keywords schärfen.
Konkurrenz lesen.
Keywords schärfen.
Bevor Design und Technik entscheiden, was wirklich sinnvoll ist.
Was du bekommst
Eine Website mit klarem Fokus auf Anfragen
Persönlich umgesetzt, sauber strukturiert und auf dein reales Angebot abgestimmt.
1
Ansprechpartner
4
klare Schritte
CH
Fokus
06 Layout-Regeln
Sektionen
Grosszügige vertikale Abstände, aber mit klarer Trennung durch feine Linien oder leichte Surface-Wechsel.
Karten
Nie flach und billig. Immer mit Border, leichtem Schatten und konsistentem Radius arbeiten.
Pills
Sparsam einsetzen. Sie sind sekundäre UI-Elemente und dürfen nie die Hauptbotschaft verdrängen.
Claim
`Weniger Agentur. Mehr Mensch.` bleibt Brand-Claim. Im Hero darf er sichtbar über einer erklärenden H1 stehen, nicht nur isoliert oder dekorativ.
4er-Karten
Vier gleichwertige Kacheln auf Desktop bevorzugt als `2x2` anordnen, nicht als `3+1`. Das liest sich ruhiger und vermeidet optisch verlorene Einzelkarten.
Value Ladder
Wenn Blueforce Leistungen erklärt, zuerst Analyse und Differenzierung zeigen, dann Umsetzung. Reihenfolge bevorzugt: Marktanalyse → Konkurrenz-Check → SEO-Keyword-Optimierung → Website-Erstellung.
Mobil
Auf kleinen Screens klare Einspaltigkeit, weniger Dichte, weniger Chip-Lärm und saubere Umbrüche priorisieren.
07 Sprache & Tonalität
So klingt Blueforce
- Ich-Perspektive statt Agentur-Mehrzahl
- Direkt, verständlich und ohne Fachchinesisch
- Konkrete Nutzenargumente statt Marketingschaum
- Erst Klarheit und Nutzen, dann Technik und Tools
- Ruhig, kompetent, persönlich
- Ehrlich in Aufwand, Tempo und Preislogik
So klingt Blueforce nicht
- Buzzwords wie «ganzheitlich», «synergistisch» oder «innovativ» ohne Substanz
- Aufgesetztes Agentur-Sprech
- Unpersönliche Wir-Form, wenn Roger gemeint ist
- Superlative ohne Beleg
- Zu viele englische Begriffe ohne Not