Kundenwebseiten designen: Struktur, Farben, Conversion

Warum gutes Layout kein Geschmack, sondern Handwerk ist

Schönes Design wirkt subjektiv, folgt aber objektiven Mustern. Wir Menschen finden Symmetrie, klare Hierarchien und ausgewogene Proportionen ansprechend. Das hat evolutionäre Gründe, genau wie bei allem, was wir als harmonisch empfinden. Du kannst das bescheuert finden oder nutzen. Ich nutze es.

Genau deshalb baue ich Kundenwebseiten nach System statt nach Bauchgefühl. Wenn jede Seite dasselbe Grundgerüst hat, arbeitest du schneller, der Kunde versteht das Ergebnis sofort und die Seite funktioniert auch noch. Das Wichtigste sind die Inhalte, nicht die Struktur. Die Struktur ist durchdacht, die Inhalte entscheiden über Anfragen.

Ich lehne die Vorstellung ab, dass jede Webseite ein kreatives Unikat sein muss. Die guten Seiten im Netz folgen fast alle demselben Schema. Wer das als Einschränkung sieht, hat das Prinzip nicht verstanden. Vorlagen geben dir Sicherheit, damit du deine Energie in Positionierung und Text stecken kannst, statt bei jeder Seite das Rad neu zu erfinden.

Der feste Aufbau jeder funktionierenden Seite

Jede Seite startet mit der Hero-Sektion. Oben links oder rechts das Logo, eine große H1-Überschrift mit dem Werteversprechen, darunter eine Subline und ein erster Call-to-Action-Button. Alles, was der Besucher ohne Scrollen sieht, nennen wir above the fold. Dort musst du überzeugen, bevor jemand aktiv weiterscrollt.

Danach folgt das Angebot: Was machst du überhaupt? Hier gehören Conversion-Elemente hin, die dem Besucher zeigen, warum er dich braucht. Es folgen Kundenstimmen und Referenzen, etwa Logos oder echte Testimonials, dann die Über-uns-Sektion mit der Frage, wer du bist. Zum Schluss steht nochmal ein klarer Call-to-Action: jetzt ein Gespräch buchen.

Dieses Schema klingt simpel, weil es simpel ist. Manchmal weichst du ab, kein Problem. Aber wenn du gute Seiten analysierst, erkennst du immer wieder dieselbe Reihenfolge: Werteversprechen, Angebot, Beweis, Persönlichkeit, Handlungsaufforderung. Halte dich daran, und du baust Seiten, die Besucher Schritt für Schritt zur Anfrage führen.

• Hero-Sektion: große H1, Subline, Bild oder Video, erster CTA-Button
• Angebot: klare Beschreibung der Leistung mit Conversion-Elementen
• Referenzen: Kundenlogos, Testimonials oder Fallbeispiele als Beweis
• Über-uns: wer du bist und warum Kunden dir vertrauen sollten
• Abschluss: prominenter Call-to-Action zur Terminbuchung

Drei Schriftgrößen, zwei Schriften, keine Verwirrung

Beim Design zählen vor allem zwei Dinge: Schrift und Farbe. Einige einfache Regeln ersparen dir die meisten Fehler. Nutze maximal drei Schriftgrößen: eine H1 für große Überschriften, eine H2 für Unterüberschriften und einen Bodytext für den Fließtext. Eine vierte Größe macht das Ganze komplizierter, ohne Mehrwert. Lass sie weg.

Bei den Schriftarten empfehle ich einen Blick auf Google Fonts. Dort siehst du die beliebtesten Schriften und passende Kombinationen. Für den Fließtext wählst du eine schlichte, gut lesbare Schrift wie Roboto. Niemand liest lange Texte in einer verspielten Schrift. Für Überschriften darf es markanter sein, solange du einheitlich bleibst.

Ich halte wenig davon, mit exotischen Schriften Eindruck schinden zu wollen. Die meisten starken Seiten nutzen eine simple Schriftfamilie, höchstens zwei. Einheitlichkeit wirkt professionell, Chaos wirkt billig. Wenn du unsicher bist, nimm die Kombination, die Google Fonts dir unter der Schrift direkt vorschlägt, etwa Open Sans oder Lato zu Roboto.

Farben wählen, die aus der Natur kommen

Farben passen nach erkennbaren Regeln. Nebeneinanderliegende Töne im Farbkreis harmonieren fast immer, komplementäre Farben erzeugen Kontrast, und ein Dreiecksformat verteilt drei Farben ausgewogen. Diese Prinzipien habe ich mir nicht ausgedacht, sie stammen aus dem Farbkreis, den du vielleicht noch aus dem Kunstunterricht kennst.

Ein Fehler, den fast jeder Anfänger macht: tiefes Pechschwarz für Text. In der Natur existiert reines Schwarz kaum, selbst die Nacht wirkt eher bläulich. Nutze deshalb ein dunkles Grau statt 100 Prozent Schwarz. Farben im Netz gibst du als Hex-Code an. Ein leicht abgemildertes Dunkelgrau liest sich angenehmer und wirkt natürlicher.

Praktisch arbeite ich mit drei Tools. Canva zeigt dir Farbgebungstechniken und sogar Paletten, die aus Naturbildern abgeleitet sind. Adobe Color unter color.adobe.com ist interaktiver und zeigt dir pro Farbe den Hex-Code. Coolors und colormind.io generieren dir ganze Paletten. Schick dem Kunden eine solche Palettenseite, lass ihn eine Nummer wählen, und du hast seine Farben.

Bilder richtig vorbereiten statt riesig hochladen

Bilder machen oder brechen eine Seite, und viele laden sie viel zu groß hoch. Ein Foto, das auf der Seite nur 212 mal 212 Pixel groß erscheint, braucht keine Originalauflösung von mehreren Megabyte. Komprimiere es vorher, etwa mit einem Tool wie TinyPNG, sonst leidet die Ladezeit und damit deine Conversion.

Für kleine Korrekturen reichen einfache Programme. Mit Adobe Lightroom korrigierst du den Weißabgleich, indem du einen Punkt im Bild als reines Weiß definierst, zum Beispiel ein weißes Hemd oder die Wand. Danach stimmen die Farben eher zum Rest der Seite. Spiel mit Belichtung und Highlights, bis Hauttöne natürlich wirken.

Du musst kein Fotodesigner werden. Oberflächliche Skills genügen: Hintergrund entfernen mit einem Tool wie remove.bg, zuschneiden, Weißabgleich setzen, komprimieren. Das reicht, damit Kundenfotos zum Stil der Seite passen. Wenn der Kunde fragt, ob du noch etwas wegretuschieren kannst, machst du das in zwei Minuten statt in zwei Stunden. Mehr braucht es am Anfang nicht.

Design allein verkauft nichts, Inhalt und Vertrieb schon

Hier kommt die unbequeme Wahrheit: Eine schöne Seite ist wertlos, wenn die Inhalte nicht verkaufen. Ich helfe Kunden nicht, aus einer hässlichen eine schöne Webseite zu machen. Ich helfe ihnen zu mehr Anfragen, mehr Umsatz, besseren Prozessen. Die Seite ist das Werkzeug, nicht das Ziel. Wer das verwechselt, bleibt beim Stundensatz hängen.

Deshalb musst du dich entscheiden: Willst du nur Webseiten bauen oder echten Mehrwert liefern? Meine Empfehlung ist klar. Lern beides, Vertrieb und Fulfillment, denn du musst ohnehin Neues lernen, egal ob Sales oder Marketing für dich selbst. Warum dann nicht dem Kunden mehr bieten als ein hübsches Layout? Du hast kein festes Skillset, du kannst alles lernen.

Der Weg vom Freelancer zur Agentur führt über genau diese Erkenntnis. Bei den über 1.000 Agenturen, die Agentur Consulting begleitet hat, liegt der Median-Monatsumsatz nachher bei 50.000 Euro statt 8.000 Euro vorher, ein Faktor von 10x, wie unsere Agentur-Benchmarks 2026 zeigen. Dieser Sprung kommt nicht vom Design, sondern von Positionierung, Angebot und Vertrieb zusammen.

Wann du überhaupt eine eigene Seite brauchst

Die ersten zwei oder drei Kunden gewinnst du auch ohne optimierte Landingpage. Danach wird eine eigene Seite zur Pflicht. Sie baut Vertrauen auf, zeigt deine Positionierung und fängt Anfragen ab, während du schläfst. Ohne sie bleibst du bei jedem Lead erklärungsbedürftig, mit ihr qualifizierst du Interessenten vor.

Deine eigene Agenturseite folgt denselben Regeln wie die deiner Kunden: Hero mit Werteversprechen, Angebot, Beweis, Über-uns, Call-to-Action. Wir zeigen bei unserer eigenen Seite bewusst wenig Text und setzen auf Vertrauenselemente. Du musst das nicht kopieren, aber das Prinzip bleibt: Überzeuge above the fold, dann führe Schritt für Schritt zur Terminbuchung.

Wie Besucher danach wirklich zu Kunden werden, hängt am Zusammenspiel aus Seite, Onboarding-Funnel und Traffic. Das ist der Punkt maximaler Wertschöpfung. Mehr dazu findest du in meinem Artikel, wie Wie Webseiten-Besucher zu Kunden werden: der Konversions-Pfad. Den kompletten Weg zu zahlenden Kunden beschreibe ich im Pillar Webdesigner Kunden gewinnen.

Weiterführende Artikel

• Website-Aufbau für Agenturen: Struktur, die Kunden schließt
• Agentur Webseite optimieren: So kommen mehr Anfragen rein
• Großartige WordPress Webseiten bauen: Der Praxis-Leitfaden
• Wie Webseiten-Besucher zu Kunden werden: der Konversions-Pfad
• Webdesigner werden: Der Fahrplan zu ersten Kunden

FAQ

Wie viele Schriftgrößen soll eine Kundenwebseite haben?

Maximal drei: eine H1 für große Überschriften, eine H2 für Unterüberschriften und einen Bodytext für Fließtext. Eine vierte Größe empfehle ich Anfängern nicht, weil sie die Seite unruhig macht. Einheitlichkeit wirkt professioneller als Vielfalt.

Welche Tools brauche ich zur Bildbearbeitung?

Für den Anfang reichen einfache Werkzeuge: remove.bg für den Hintergrund, TinyPNG zum Komprimieren und optional Adobe Lightroom für den Weißabgleich. Du brauchst keine Fotodesign-Ausbildung, nur oberflächliche Skills, um Bilder an den Stil der Seite anzupassen.

Warum soll ich kein reines Schwarz für Text verwenden?

Reines Pechschwarz existiert in der Natur kaum und wirkt unnatürlich hart. Nutze stattdessen ein dunkles Grau als Hex-Code, etwa ein sehr dunkles, aber nicht hundertprozentiges Schwarz. Der Text liest sich angenehmer und die Seite wirkt harmonischer.

Ab wann brauche ich eine eigene Agenturwebseite?

Die ersten zwei oder drei Kunden gewinnst du auch ohne. Danach solltest du auf jeden Fall eine eigene, auf deine Zielgruppe optimierte Seite haben. Sie baut Vertrauen auf, zeigt deine Positionierung und qualifiziert Anfragen vor dem Gespräch vor.

Reicht gutes Design, um mit Webseiten Geld zu verdienen?

Nein. Design allein verkauft nicht. Entscheidend sind Inhalte, Positionierung und Vertrieb. Bei Agentur Consulting liegt der Median-Monatsumsatz nachher bei 50.000 Euro, und dieser Sprung kommt aus dem Zusammenspiel von Angebot und Akquise, nicht aus einem hübschen Layout.