feat(content): rewrite copy to focus on worry-free package and static sites
Build & Deploy / 🔍 Prepare (push) Successful in 9s
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🩺 Smoke Test (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
Build & Deploy / 🏗️ Build (push) Has been cancelled

This commit is contained in:
2026-05-06 11:34:52 +02:00
parent 5663c3ae38
commit 07c8d7c668
6 changed files with 202 additions and 183 deletions
+67 -52
View File
@@ -36,18 +36,18 @@ export default function LandingPage() {
{/* Rest of page on white */}
{/* Section 02: The Promise – Streamlined */}
{/* Section 02: Was Sie bekommen */}
<Section
number="02"
title="Das Versprechen"
title="Ihr Vorteil"
borderTop
effects={<GradientMesh variant="metallic" className="opacity-70" />}
>
<div className="space-y-10 md:space-y-16 relative">
<Reveal>
<H3 className="max-w-3xl">
Kein Agentur-Zirkus. <br />
<Marker delay={0.3}>Ergebnisse.</Marker>
Sie kümmern sich um Ihr Geschäft. <br />
<Marker delay={0.3}>Ich um Ihre Website.</Marker>
</H3>
</Reveal>
@@ -55,23 +55,23 @@ export default function LandingPage() {
{[
{
icon: <ConceptCommunication className="w-8 h-8" />,
title: "Direkte Kommunikation",
text: "Sie sprechen mit dem Entwickler. Keine Stille Post, keine Umwege.",
title: "Ein Ansprechpartner",
text: "Sie sprechen direkt mit dem, der Ihre Website baut. Keine Agentur, keine Umwege, kein Stille-Post-Effekt.",
},
{
icon: <ConceptPrototyping className="w-8 h-8" />,
title: "Schnelle Umsetzung",
text: "Sichtbare Fortschritte in Tagen. Prototypen statt Konzeptpapiere.",
},
{
icon: <ConceptCode className="w-8 h-8" />,
title: "Sauberer Code",
text: "Maßgeschneiderte Architektur. Kein Baukasten, kein Plugin-Chaos.",
title: "Schnell sichtbare Ergebnisse",
text: "Kein monatelanges Warten. Sie sehen erste Entwürfe innerhalb weniger Tage — nicht erst nach Wochen.",
},
{
icon: <ConceptPrice className="w-8 h-8" />,
title: "Klare Fixpreise",
text: "Volle Budgetsicherheit. Keine versteckten Kosten.",
title: "Fixpreis ohne Überraschungen",
text: "Sie wissen vorher, was es kostet. Kein Stundenzettel, keine Nachforderungen, keine bösen Überraschungen.",
},
{
icon: <ConceptCode className="w-8 h-8" />,
title: "Null Arbeit für Sie",
text: "Keine Einarbeitung in ein CMS, keine Schulungen. Änderungen? Sagen Sie Bescheid — ich erledige das.",
},
].map((item, i) => (
<Reveal key={i} delay={0.1 + i * 0.1}>
@@ -95,47 +95,59 @@ export default function LandingPage() {
</div>
</Section>
{/* Section 03: The Difference – Visual Comparison */}
{/* Section 03: Der Unterschied */}
<Section number="03" title="Der Unterschied" variant="white" borderTop>
<div className="space-y-10 md:space-y-16 relative">
<Reveal>
<H3 className="max-w-3xl">
Ich arbeite für das Ergebnis, <br />
nicht gegen die <Marker delay={0.4}>Uhr.</Marker>
Warum nicht einfach <br />
eine <Marker delay={0.4}>Agentur?</Marker>
</H3>
</Reveal>
<div className="grid grid-cols-1 gap-8 relative z-20">
<ComparisonRow
negativeLabel="Klassisch"
negativeText="Wochen in Planung, bevor eine einzige Zeile Code geschrieben wird."
positiveLabel="Mein Weg"
negativeLabel="Agentur"
negativeText="Projektmanager, Designer, Entwickler — Sie erklären Ihr Anliegen drei Mal."
positiveLabel="Bei mir"
positiveText={
<>
Schnelle Prototypen. Ergebnisse in{" "}
<PenCircle delay={0.5}>Tagen</PenCircle>, nicht Monaten.
<PenCircle delay={0.5}>Ein</PenCircle> Ansprechpartner für
alles. Von der ersten Idee bis zur fertigen Website.
</>
}
delay={0.1}
/>
<ComparisonRow
negativeLabel="Klassisch"
negativeText="Unvorhersehbare Kosten durch Stundenabrechnungen."
positiveLabel="Mein Weg"
negativeLabel="Agentur"
negativeText="Stundenabrechnungen, Nachträge, unklare Endkosten."
positiveLabel="Bei mir"
positiveText={
<>
<PenCircle delay={0.5}>Fixpreise.</PenCircle> Sie wissen von
Anfang an, was es kostet.
<PenCircle delay={0.5}>Fixpreis.</PenCircle> Sie wissen vorher
exakt, was es kostet. Punkt.
</>
}
reverse
delay={0.2}
/>
<ComparisonRow
negativeLabel="Baukasten"
negativeText="Sie bauen selbst, kämpfen mit Templates und sind auf sich allein gestellt."
positiveLabel="Bei mir"
positiveText={
<>
Ich baue, Sie lehnen sich zurück. Brauchen Sie eine Änderung?{" "}
<PenCircle delay={0.5}>Kurze Nachricht</PenCircle> genügt.
</>
}
delay={0.3}
/>
</div>
</div>
</Section>
{/* Section 04: Target Group */}
{/* Section 04: Für wen */}
<Section number="04" title="Für wen" borderTop>
<div className="grid grid-cols-1 md:grid-cols-1 lg:grid-cols-2 gap-4 md:gap-6 lg:gap-10 relative z-10">
<Reveal>
@@ -149,8 +161,9 @@ export default function LandingPage() {
Geschäftsführer
</H3>
<LeadText className="text-slate-400 text-base md:text-lg">
Sie wollen eine Website, die funktioniert – ohne sich mit
Technik beschäftigen zu müssen.
Sie brauchen eine professionelle Website, die Ihr Unternehmen
repräsentiert — ohne sich selbst mit Technik beschäftigen zu
müssen. Ich übernehme alles.
</LeadText>
</div>
<div className="pt-6 md:pt-8 border-t border-slate-50 mt-6 md:mt-8">
@@ -164,16 +177,16 @@ export default function LandingPage() {
<Card variant="glass" padding="normal" techBorder className="group">
<div className="space-y-6 relative overflow-hidden">
<div className="w-12 h-12 md:w-16 md:h-16 bg-slate-50 border border-slate-100 rounded-xl flex items-center justify-center">
{/* Icon placeholder or same as above if needed */}
<ConceptWebsite className="w-6 h-6 md:w-8 md:h-8" />
</div>
<H3 className="text-xl md:text-3xl">
Marketing & <br />
Vertrieb
Selbstständige & <br />
kleine Teams
</H3>
<LeadText className="text-slate-400 text-base md:text-lg">
Sie brauchen Landingpages und Tools, die Ergebnisse liefern.
Schnell und zuverlässig.
Sie wollen online sichtbar sein, aber keine Zeit in eine
Website stecken. Ich liefere Ihnen eine fertige Lösung — Sie
konzentrieren sich auf Ihre Kunden.
</LeadText>
</div>
<div className="pt-6 md:pt-8 border-t border-slate-50 mt-6 md:mt-8">
@@ -186,7 +199,7 @@ export default function LandingPage() {
</div>
</Section>
{/* Section 05: Leistungen — Interactive Service Rows */}
{/* Section 05: Leistungen */}
<Section number="05" title="Leistungen" variant="gray" borderTop>
<div className="space-y-0 relative z-20">
{[
@@ -194,24 +207,24 @@ export default function LandingPage() {
num: "01",
binary: "00000001",
title: "Websites",
text: "High-Performance Websites mit maßgeschneiderter Architektur. Von der Konzeption bis zum Go-Live — individuell, schnell, messbar.",
tags: ["Next.js", "React", "TypeScript", "Performance"],
text: "Professionelle, schnelle Websites — individuell für Ihr Unternehmen gestaltet. Von der Firmenwebsite bis zur Landingpage.",
tags: ["Firmenwebsite", "Landingpage", "Responsive", "SEO"],
href: "/websites",
},
{
num: "02",
binary: "00000010",
title: "Systeme",
text: "Web-Applikationen und interne Tools, wenn Standard-Software nicht reicht. Dashboards, Portale, Automatisierungen.",
tags: ["Full-Stack", "APIs", "Datenbanken", "Auth"],
title: "Sorglos-Paket",
text: "Änderungen, Wartung, Sicherheit, Updates — alles inklusive. Sie sagen Bescheid, ich erledige das. Ein Jahr, ein Paket, null Aufwand.",
tags: ["Wartung", "Änderungen", "Sicherheit", "Updates"],
href: "/contact",
},
{
num: "03",
binary: "00000011",
title: "Automatisierung",
text: "Verbindung von Tools, automatische Prozesse, Daten-Synchronisation. Weniger manuelle Arbeit, mehr Effizienz.",
tags: ["CI/CD", "Workflows", "Integrationen", "Monitoring"],
title: "Web-Anwendungen",
text: "Wenn eine einfache Website nicht reicht: Kundenportale, interne Tools oder individuelle Lösungen für Ihr Business.",
tags: ["Portale", "Dashboards", "Automatisierung", "Tools"],
href: "/contact",
},
].map((service, i) => (
@@ -283,18 +296,18 @@ export default function LandingPage() {
<Reveal>
<div className="space-y-8 md:space-y-12 lg:space-y-16">
<H1 className="text-4xl md:text-6xl lg:text-8xl">
Lassen Sie uns <br />
<span className="text-slate-400">starten.</span>
Klingt gut? <br />
<span className="text-slate-400">Lassen Sie uns reden.</span>
</H1>
<div className="flex flex-col md:flex-row gap-6 md:gap-10 lg:gap-16 items-start relative z-10">
<div className="space-y-4 md:space-y-8 flex-1">
<LeadText className="text-lg md:text-3xl text-slate-400">
Beschreiben Sie kurz Ihr Vorhaben. Ich melde mich{" "}
Beschreiben Sie kurz, was Sie brauchen. Ich melde mich{" "}
<span className="text-slate-900 border-b-2 border-slate-900/10">
<Marker>zeitnah</Marker>
<Marker>innerhalb von 24 Stunden</Marker>
</span>{" "}
bei Ihnen.
mit einem konkreten Vorschlag.
</LeadText>
<div className="pt-2 md:pt-4">
<Button
@@ -302,7 +315,7 @@ export default function LandingPage() {
size="large"
className="w-full md:w-auto"
>
Projekt anfragen
Kostenlos anfragen
</Button>
</div>
</div>
@@ -314,7 +327,9 @@ export default function LandingPage() {
</div>
<BodyText className="text-sm md:text-base leading-snug">
Aktuell nehme ich Projekte für{" "}
<span className="font-bold text-slate-900"><Availability /></span>{" "}
<span className="font-bold text-slate-900">
<Availability />
</span>{" "}
an.
</BodyText>
</div>