Onepager Website: Aufbau, Beispiele & Kosten 2026

Was ist ein Onepager?

Ein Onepager ist eine Website, die ihren gesamten Inhalt auf einer einzigen Seite darstellt. Statt klassisch auf mehrere Unterseiten wie „Über uns", „Leistungen" oder „Kontakt" zu verteilen, scrollen deine Besucher durch eine lange Seite und erleben dein Unternehmen linear — Abschnitt für Abschnitt.

Wichtig ist die Abgrenzung zu zwei verwandten Konzepten:

• Onepager vs. Landingpage: Eine Landingpage verfolgt ein einziges Conversion-Ziel, meist gekoppelt an eine Anzeige oder Kampagne. Ein Onepager ist deine vollwertige Website — nur eben auf einer Seite.
• Onepager vs. Mehrseiter: Ein Mehrseiter hat eine klassische Navigation mit mehreren URLs. Ein Onepager arbeitet mit Anker-Links, die zu den jeweiligen Sektionen springen.

Für wen ist ein Onepager geeignet — und für wen nicht?

Nicht jedes Unternehmen profitiert von einem Onepager. Die Entscheidung hängt stark von deinem Leistungsumfang und deiner SEO-Strategie ab.

Onepager sind ideal für:

• Freelancer und Solopreneure: Fotografen, Coaches, Berater mit einem klaren Angebot
• Handwerksbetriebe mit fokussiertem Service: z. B. ein Fliesenleger oder Elektriker in Karlsruhe
• Produkt-Launches und MVPs: Wenn du ein einzelnes Angebot erklärst
• Veranstaltungen, Events, Konferenzen: Datum, Ort, Programm — alles auf einen Blick
• Portfolio-Seiten: Designer, Entwickler, Künstler und Kreative

Onepager sind weniger geeignet für:

• Unternehmen mit vielen unterschiedlichen Leistungen, die jeweils eigene SEO-Landingpages brauchen
• Online-Shops mit Produktkatalog
• Content-starke Projekte mit Blog, Ratgebern oder Case Studies
• Komplexe B2B-Anbieter mit verschiedenen Zielgruppen und Buyer-Journeys

Aufbau: Die Sektionen eines starken Onepagers

Ein Onepager lebt von einer klaren Dramaturgie. Wer nach dem Hero-Bereich nicht sofort versteht, worum es geht, ist weg. Die folgende Struktur hat sich in hunderten umgesetzten Projekten bewährt:

1. Hero-Sektion: Klare Headline (was du anbietest), Unter-Headline (für wen und welchen Nutzen), Call-to-Action und ein aussagekräftiges Visual. Entscheidung in den ersten 5 Sekunden.
2. Problem & Lösung: Spiegel die Pain Points deiner Zielgruppe und zeige, wie du sie löst.
3. Leistungen oder Features: 3 bis 6 Kernangebote, jeweils mit Icon, Headline und kurzer Beschreibung.
4. Sozialer Beweis: Logos von Kunden, Testimonials, Bewertungen, Zertifikate — schafft Vertrauen.
5. Über dich oder dein Team: Gesichter und Geschichte geben deinem Angebot Persönlichkeit.
6. Prozess und Ablauf: 3–5 Schritte, die erklären, wie die Zusammenarbeit funktioniert.
7. Preise oder Pakete (optional): Transparenz wirkt und filtert unpassende Anfragen vor.
8. FAQ: Häufige Einwände vorwegnehmen — spart dir Mails und stärkt SEO.
9. Kontakt und Final-CTA: Formular, Telefon, WhatsApp — je mehr Wege, desto besser.

Plane zwischen den Sektionen ausreichend Weißraum ein. Ein guter Onepager wirkt nicht wie eine endlose Bleiwüste, sondern atmet.

5 Onepager-Beispiele, die überzeugen

Statt dich mit generischen Screenshots zu langweilen, hier die typischen Muster, die du aus der Praxis kennen solltest:

• Der Solopreneur-Onepager: Minimalistisch, große Typografie, persönliches Foto, klarer USP. Typisch bei Coaches, Beratern und Speakern.
• Der Handwerks-Onepager: Lokaler Fokus, Google-Bewertungen prominent, Kontaktformular ganz oben rechts. Perfekt für regionale Nachfrage.
• Der SaaS-Onepager: Product-Shots, animierte Features, Pricing-Tabelle, Free-Trial-CTA. Häufig bei Startups im Launch.
• Der Portfolio-Onepager: Projektarbeiten im Zentrum, reduzierte Texte, starke Bildsprache — typisch für Kreative und Fotografen.
• Der Event-Onepager: Countdown, Agenda, Speaker-Liste, Ticket-CTA. Ein Use Case, bei dem sich ein Mehrseiter schlicht nicht lohnt.

Wenn du nach inspirierenden Live-Beispielen suchst, durchstöbere die Showcases von Webflow, Framer oder Awwwards. Filter nach „One Page" liefert dir dort tausende reale Umsetzungen.

Onepager erstellen: In 7 Schritten zur fertigen Seite

1. Ziel definieren: Was soll der Besucher am Ende tun? Anruf, Formular, Buchung, Download? Ein Ziel pro Onepager — nicht fünf.
2. Zielgruppe und Botschaft schärfen: Eine Sprache, ein Problem, ein Versprechen. Schreibe deinen USP in einem Satz auf, bevor du irgendetwas designst.
3. Struktur als Wireframe: Skizziere die Sektionen auf Papier oder in Figma. Reihenfolge ist wichtiger als das finale Design.
4. Texte schreiben, bevor du designst: Die Headline und die Sub-Headline im Hero-Bereich entscheiden über 70 Prozent des Erfolgs. Formuliere sie mindestens in drei Varianten.
5. Design umsetzen: Verwende ein konsistentes Farb- und Typo-System. Maximal zwei Schriftarten, maximal drei Hauptfarben.
6. Technisch entwickeln: Setze auf moderne Tools wie Webflow, Framer oder ein sauberes WordPress-Setup. Pflicht: Anker-Navigation, Smooth Scroll, Lazy Loading, sauberes HTML.
7. Testen, messen, iterieren: Lass drei Personen aus deiner Zielgruppe über die Seite klicken. Ergänze Heatmaps (z. B. Microsoft Clarity) und optimiere nach 4–6 Wochen die Konversions-Schwachstellen.

SEO auf einem Onepager: So rankst du trotzdem

Hier scheitern 9 von 10 Onepagern. Ein Onepager hat per Definition nur eine URL — und eine URL kann nur auf begrenzt viele Keywords gleichzeitig ranken. Die folgenden Taktiken ändern das Spiel:

• Haupt-Keyword strategisch wählen: Fokussiere dich auf ein Parent-Keyword, das dein Kernangebot beschreibt (z. B. „Fliesenleger Karlsruhe"). Das ist dein rankbares Ziel.
• H2-Struktur wie eine Mini-Sitemap: Jede Sektion bekommt eine klare H2-Überschrift mit semantisch verwandten Keywords. Google interpretiert einen Onepager dann wie mehrere Themen-Cluster.
• Schema-Markup voll ausreizen: LocalBusiness, Service, FAQPage, Review — je mehr strukturierte Daten, desto besser die SERP-Integration durch Rich Snippets und lokale Treffer.
• Sprungmarken als Site-Links: Anker wie /#leistungen oder /#kontakt werden nicht eigenständig indexiert, erscheinen aber häufig als Site-Links in der SERP — dein Eintrag wirkt dadurch mehrseitig.
• Externe Content-Hubs aufbauen: Ein Onepager allein rankt selten für breite Themen. Plane parallel einen Blog oder externe Fachartikel ein, die auf den Onepager verlinken. Mehr dazu in unserem Guide Homepage aufbauen: Struktur-Guide für KMU.
• Mobile-First und schnelle Ladezeiten: Google bewertet mobile Performance härter denn je. Details im Core-Web-Vitals-Guide.

Performance: Warum Onepager technisch anspruchsvoller sind

Onepager haben ein häufig unterschätztes Problem: Sie laden alles auf einer Seite. Hero-Video, 40 Bilder, Testimonial-Slider, Kontaktformular — das summiert sich schnell auf 5–10 MB. Der Browser muss das initial verarbeiten, bevor der erste Scroll-Impuls überhaupt registriert wird.

Drei konkrete Stellschrauben, die den Unterschied machen:

• Bildformat AVIF oder WebP statt JPEG: Bis zu 60 Prozent kleinere Dateien bei identischer Qualität.
• Lazy Loading konsequent einsetzen: Bilder und Videos unterhalb des Viewports werden erst geladen, wenn der Nutzer nah heran scrollt.
• Animationen nur mit CSS oder GPU-beschleunigt: JavaScript-lastige Scroll-Effekte killen LCP und INP — gerade auf günstigen Android-Geräten.

Ziel: LCP unter 2,5 Sekunden, INP unter 200 Millisekunden, CLS unter 0,1 — jeweils gemessen im Mobile-Report von PageSpeed Insights.

Was kostet ein Onepager in Deutschland 2026?

Die Preisspanne ist breit. Hier ein realistischer Überblick:

• DIY mit Baukasten (Wix, Squarespace): 15–30 € pro Monat plus eigener Zeitaufwand von 20–60 Stunden.
• Freelancer: 1.500 bis 4.000 € einmalig, je nach Umfang und Design-Qualität.
• Webdesign-Agentur: 3.500 bis 9.000 € für einen professionellen Onepager inklusive Strategie, Copywriting, Design, Entwicklung und Grund-SEO.
• Enterprise und High-End: Ab 12.000 € aufwärts bei individuellen Animationen, 3D-Elementen oder komplexen Integrationen.

Details zur Budgetplanung und zu den Kostentreibern findest du in unserem Artikel Was kostet eine Website? Wichtig: Der günstigste Onepager ist der, der konvertiert — und das ist selten der billigste.

Die 5 häufigsten Fehler beim Onepager

• Zu viele Botschaften: Wer alles sagen will, sagt nichts. Fokus schlägt Vollständigkeit.
• Hero-Headline ohne Substanz: „Willkommen auf unserer Website" sagt nichts aus. Schreib stattdessen, wem du wobei hilfst.
• Keine klare CTA-Hierarchie: Ein Primär-CTA (z. B. „Termin vereinbaren") pro Sektion reicht. Zu viele Buttons lähmen die Entscheidung.
• Technische Sünden: Schwere Slider, Autoplay-Videos, blockierendes JavaScript — alles Gift für Performance und UX.
• Keine SEO-Strategie: Einfach „nur eine Seite" bauen, ohne Keyword-Recherche und strukturierte Daten — und sich dann wundern, warum niemand vorbeikommt.

Fazit: Wann sich ein Onepager wirklich lohnt

Ein Onepager ist kein Kompromiss, sondern ein bewusstes Format. Er ist dann stark, wenn du eine klare Botschaft, ein klares Angebot und ein klares Conversion-Ziel hast. Schwach wird er, sobald du Keyword-Breite, mehrere Zielgruppen oder einen umfangreichen Content-Plan brauchst. Wenn du unsicher bist, welches Format besser passt — Onepager, Landingpage oder Mehrseiter — nimm dir 20 Minuten und skizziere dein Hauptziel, deine Zielgruppe und die Keywords, für die du gefunden werden willst. Oft klärt sich die Frage von selbst.

Bei Eazy Media aus Karlsruhe bauen wir Onepager, die nicht nur gut aussehen, sondern auch konvertieren und ranken. Jede Seite startet mit Strategie, SEO-Recherche und klaren Conversion-Zielen — nicht mit einem Template. Wenn du einen Onepager planst oder dir unsicher bist, ob er für dich der richtige Weg ist, sprich uns gerne an. Wir hören zu, rechnen ehrlich und bauen nur, was deine Ziele wirklich voranbringt.