- Der erste visuelle Eindruck einer Website entsteht in 50 Millisekunden und beeinflusst, ob jemand bleibt oder sofort wieder geht.
- 57 % der Betrachtungszeit einer Seite entfallen laut Nielsen Norman Group auf den Bereich, der ohne Scrollen sichtbar ist.
- Die Hauptüberschrift muss das Nutzenversprechen in einem Satz transportieren, keinen Firmennamen und kein Motto.
- Eine überzeugende Startseite folgt einer klaren Abfolge: Nutzenversprechen, Leistungen, Vertrauen, eine Handlungsaufforderung.
- Die häufigsten Fehler sind Unschärfe im Angebot, fehlende Vertrauenssignale und zu viele gleichwertige Aktionen auf einmal.
Die Startseite ist die am häufigsten besuchte Seite einer Unternehmenswebsite, gleichzeitig aber die am häufigsten falsch aufgebaute. Nicht weil es an Gestaltungsaufwand fehlt, sondern weil der Fokus oft auf Optik liegt, nicht auf der Aufgabe, die eine Startseite tatsächlich hat: einen Fremden in wenigen Sekunden davon zu überzeugen, dass er hier richtig ist. Dieser Ratgeber zeigt, was dafür über dem Fold stehen muss, wie eine überzeugende Startseite strukturiert ist und wo die meisten Seiten bereits scheitern, lange bevor jemand auch nur eine Leistung gelesen hat.
Warum die ersten Sekunden alles sind
Gitte Lindgaard und Kollegen haben in einer Studie gezeigt, dass Menschen ein ästhetisches Urteil über eine Website bereits nach 50 Millisekunden fällen. Das ist kein bewusster Gedanke, sondern eine automatische Reaktion, die kaum zu korrigieren ist, selbst wenn man der Person mehr Zeit gibt. Dieser erste Eindruck beeinflusst, ob jemand der Seite grundsätzlich vertraut, und damit, ob er weiterliest oder schließt.
Was danach passiert, hat die Nielsen Norman Group in einer Analyse von 205.873 einzelnen Webseiten ausgewertet, für die insgesamt über 2 Milliarden Verweildauern erfasst wurden. Das Ergebnis: Die ersten 10 Sekunden eines Seitenbesuchs sind entscheidend. In diesem Zeitfenster ist die Absprungwahrscheinlichkeit am höchsten. Wer sein Nutzenversprechen nicht in diesen 10 Sekunden klar kommuniziert, gewinnt diese Person nicht mehr. Wer es schafft, hat realistische Chancen auf 2 Minuten Aufmerksamkeit oder mehr.
Das klingt nach wenig Zeit. Ist es auch. Aber es ist genug, wenn die Seite die Aufgabe konsequent erfüllt: eine Frage beantworten. „Bin ich hier richtig?“ Ist die Antwort innerhalb von Sekunden eindeutig Ja, bleibt der Besucher. Ist sie unklar oder Nein, ist er weg.
Was eine Website grundsätzlich leisten muss, um Kunden zu gewinnen, beschreibt der Ratgeber Was eine Unternehmenswebsite leisten muss. Dieser Artikel fokussiert sich auf die Startseite und die ersten Sekunden davor.
Was above the fold passieren muss
„Above the fold“ ist der Bereich, den ein Besucher sieht, ohne auch nur einmal zu scrollen. Auf einem Laptop sind das je nach Bildschirmgröße etwa 600 bis 800 Pixel Höhe. Auf dem Smartphone deutlich weniger. Laut einer Eyetracking-Studie der Nielsen Norman Group entfallen 57 % der gesamten Betrachtungszeit auf diesen ersten sichtbaren Bereich, die ersten beiden Bildschirme kommen zusammen auf 74 %.
Das bedeutet: Wer sein Nutzenversprechen erst im dritten Abschnitt erklärt, hat einen strukturellen Nachteil. Die meisten Besucher werden ihn nie sehen.
Drei Informationen müssen in diesem Bereich stehen, und zwar ohne dass jemand suchen muss:
- Was bieten Sie an, konkret und für wen?
- Warum gerade Sie, mit einem einzigen, greifbaren Unterschied?
- Was ist der nächste Schritt, klar und ohne Entscheidungsaufwand?
Das klingt einfach. In der Praxis ist es die häufigste Baustelle: Viele Startseiten zeigen im ersten sichtbaren Bereich ein Hintergrundbild und einen Firmenslogan. Das beantwortet keine dieser drei Fragen.
Der Hero-Bereich: Struktur, die überzeugt
Der Hero-Bereich ist der erste große Block einer Startseite, in der Regel identisch mit dem above-the-fold-Bereich oder reicht bis knapp darunter. Er ist das Einstiegsbild der Seite. Seine Struktur bestimmt, ob jemand weiterscrollt oder abspringt.
Die Hauptüberschrift
Die Hauptüberschrift trägt mehr Last als jedes andere Element auf der Seite. Sie muss das Nutzenversprechen auf den Punkt bringen, aus Kundenperspektive, nicht aus der Innensicht des Unternehmens.
„Ihr Partner für Erfolg“ ist kein Nutzenversprechen. Es ist eine Behauptung ohne Inhalt. „Buchhaltungssoftware für Handwerker, die keine Zeit für Excel haben“ ist ein Nutzenversprechen. Es nennt, wer gemeint ist, was angeboten wird und welches Problem gelöst wird.
Eine wirksame Headline folgt dieser Logik: Zielgruppe + konkretes Problem oder Nutzen. Nicht immer lassen sich beide Teile in einer Zeile unterbringen. Dann hilft ein kurzer Untertitel, der ergänzt, was die Überschrift offenlässt. Fettdruck und Größe geben der Überschrift visuelles Gewicht; sie muss als erstes wahrgenommen werden.
Das visuelle Element
Menschen sind visuell. Ein Bild, das zur Aussage der Headline passt, verstärkt den Eindruck. Ein Bild, das nur dekorativ ist oder generisch wirkt, verwässert ihn.
In Projekten sehen wir regelmäßig Startseiten mit Stockfotos lachender Menschen ohne erkennbaren Bezug zum Angebot. Das löst keinen Vertrauenseffekt aus. Ein echtes Foto des Teams, eines Produkts oder einer abgeschlossenen Arbeit ist hier fast immer stärker.
Der erste Handlungsaufruf
Im Hero-Bereich sollte ein erster, klar formulierter Handlungsaufruf stehen. Nicht drei. Nicht zwei. Einer. Was das konkret bedeutet und wie man ihn formuliert, erklärt der Ratgeber Call to Action: Wie aus Besuchern echte Anfragen werden.
Die Stärke eines Call to Action hängt auch von der Beschriftung ab. „Mehr erfahren“ ist schwach, weil es keine Erwartung erzeugt. „Kostenlose Erstberatung vereinbaren“ verbindet den Klick mit einem konkreten Angebot. Der Text auf dem Button ist kein Ort für Kreativität, sondern für Klarheit.
Leistungen zeigen, ohne zu überladen
Nach dem Hero-Bereich folgt in einer gut strukturierten Startseite ein Überblick über die Leistungen. Nicht als vollständige Preisliste, sondern als Orientierungskarte: Was können Besucher hier erwarten?
Drei bis fünf Leistungskacheln mit kurzem, konkretem Text sind das richtige Maß. Mehr lähmt die Wahrnehmung, weniger gibt zu wenig Orientierung. Jede Kachel sollte einen Link auf die jeweilige Detailseite haben. Die Startseite ist der Einstieg, nicht die Erklärungsseite.
Ein häufiger Fehler ist, Leistungen aus der Innenperspektive zu beschreiben. „Beratung und Konzeption“ sagt dem Besucher wenig. „Wir analysieren Ihre aktuelle Seite und zeigen, wo Anfragen verloren gehen“ trifft sein Problem direkt. Die Sprache sollte beschreiben, was der Besucher bekommt, nicht was das Unternehmen tut.
Vertrauen früh aufbauen
Menschen lesen auf Websites weniger, als wir annehmen. Sie scannen nach Signalen, die Ihnen sagen: Kann ich diesem Anbieter vertrauen? Diese Frage wird nicht durch Fließtext beantwortet, sondern durch Elemente, die Vertrauen sichtbar machen.
Dazu gehören:
- Kundenstimmen mit echtem Namen und konkretem Bezug
- Logos bekannter Auftraggeber oder Partner
- Konkrete Zahlen aus der eigenen Arbeit (abgeschlossene Projekte, Jahre Erfahrung)
- Ein erkennbarer Ansprechpartner mit Foto und Name
Der Fehler, den viele machen: Vertrauenssignale auf einer eigenen Referenzseite verstecken, die kaum jemand aufruft. Wer Vertrauen früh aufbauen will, muss mindestens ein starkes Signal in den gut erreichbaren Bereich der Startseite setzen, idealerweise direkt nach den Leistungen. Was dabei wirklich wirkt und was nicht, erklärt der Ratgeber Vertrauenssignale auf der Website.
Bewertungsplattformen wie Google-Rezensionen oder Trusted Shops können hier zusätzlich wirken, wenn der Gesamtschnitt gut ist. Eine Bewertung von 4,8 Sternen aus 47 Bewertungen überzeugt konkret. „Über 40 zufriedene Kunden“ als Eigenaussage überzeugt niemanden.
Eine Aktion, kein Menü
Jede Startseite hat irgendwo eine Handlungsaufforderung. Das Problem ist nicht ihr Fehlen, sondern ihre Inflation. Wer gleichzeitig zur Kontaktaufnahme, zum Angebotsdownload, zur Beratungsbuchung, zur Newsletter-Anmeldung und zur Produktübersicht einlädt, gibt dem Besucher kein klares Signal, sondern ein Menü.
Aus Projekten wissen wir: Wer mehrere gleichwertige Aktionen anbietet, bekommt am Ende weniger Klicks als jemand, der eine einzige klar priorisiert. Der Grund ist einfach: Entscheidung kostet Energie. Je mehr Optionen, desto höher die mentale Hürde, überhaupt zu klicken.
Die wichtigste Aktion der Startseite, in den meisten Fällen die Kontaktaufnahme oder ein erstes Gespräch, sollte visuell hervorgehoben sein. Alle anderen Aktionen sind sekundär. Sie können auf der Seite vorkommen, aber nie auf Augenhöhe mit der Hauptaktion.
Scanbarkeit: Wie Besucher wirklich lesen
Besucher lesen Webseiten nicht wie ein Buch, Zeile für Zeile von oben nach unten. Sie scannen. Die Nielsen Norman Group hat in Eyetracking-Studien das sogenannte F-Muster dokumentiert: Nutzer lesen den oberen Bereich quer, dann ein kurzes Stück weiter unten nochmals quer, und dann scannen sie die linke Seite vertikal.
Das bedeutet konkret: Die wichtigsten Informationen stehen in den ersten zwei Absätzen und am Anfang jedes Abschnitts. Wer seinen Schlüsselsatz in der Mitte eines langen Absatzes versteckt, verliert ihn im Scan.
Daraus folgen ein paar direkte Konsequenzen für den Aufbau einer Startseite:
- Überschriften, die den Inhalt des Abschnitts vorwegnehmen, nicht nur ankündigen
- Kurze, prägnante erste Sätze pro Abschnitt
- Visuell klare Trennungen zwischen den Abschnitten
- Keine endlosen Fließtextblöcke ohne Unterbrechung
Hinzu kommt ein zweiter Effekt, den NNg als Banner Blindness beschrieben hat: Bereiche, die optisch wie Werbung aussehen, werden systematisch ignoriert. Das betrifft Flächen mit starken Farben, viel Bild und wenig Text, auch wenn dort kein Werbebanner steht. Wer wichtige Inhalte in auffällig bunten Kästen unterbringt, riskiert, dass diese unterbewusst übersprungen werden.
Für die Ladegeschwindigkeit gilt dasselbe Prinzip: Wer seine Startseite nicht innerhalb von 2,5 Sekunden lädt, verliert Besucher, bevor der erste Eindruck überhaupt entstehen kann. Was Google dabei konkret misst, erklärt der Ratgeber Core Web Vitals einfach erklärt.
Startseiten-Elemente auf einen Blick
| Element | Zweck | Häufiger Fehler |
|---|---|---|
| Hauptüberschrift (H1) | Nutzenversprechen in einem Satz: Wer, was, für wen | Firmenname oder nichtssagender Slogan statt konkretem Angebot |
| Untertitel | Ergänzt, was die Headline offenlässt; nennt Zielgruppe oder USP | Wiederholt die Headline mit anderen Worten |
| Hero-Bild oder -Video | Verstärkt den Eindruck der Headline, erzeugt Vertrauen durch Echtheit | Generisches Stockfoto ohne Bezug zum Angebot |
| Primärer Call to Action | Leitet die wichtigste gewünschte Handlung ein | Mehrere gleichwertige Buttons, oder nur „Mehr erfahren“ |
| Leistungsüberblick | Orientierungskarte: Was gibt es hier? | Zu viele Punkte, interne Fachsprache statt Kundennutzen |
| Vertrauensblock | Kundenstimmen, Referenzen oder Kennzahlen bauen Hürde ab | Auf eigener Referenzseite versteckt, nicht auf der Startseite |
| Sekundärer CTA / Abschluss | Letzter Anker am Seitenende für alle, die noch nicht überzeugt sind | Fehlt komplett oder wiederholt den primären CTA wortgleich |
Die häufigsten Startseiten-Fehler
Startseiten scheitern selten an fehlendem Gestaltungsaufwand. Sie scheitern meistens an einer von drei Ursachen:
Unschärfe im Angebot
Die häufigste Ursache ist eine Hauptüberschrift, die das Unternehmen beschreibt statt das Angebot zu erklären. „Kompetenz und Leidenschaft seit 1998″ sagt einem Fremden nichts. Wer keine Sekunde damit verbracht hat, die Startseite aus der Perspektive eines Erstbesuchers zu lesen, der das Unternehmen überhaupt nicht kennt, sitzt in dieser Falle.
Test: Zeigen Sie Ihre Startseite jemandem, der Ihr Unternehmen nicht kennt, 10 Sekunden lang. Fragen Sie danach: Was bietet das Unternehmen an, und für wen? Wenn die Antwort vage ist, ist die Überschrift das Problem.
Fehlende Vertrauenssignale above the fold
Viele Seiten bauen Vertrauen erst weit unten auf, wenn jemand noch liest. Einige zeigen Vertrauenssignale grundsätzlich nur auf einer separaten Referenzseite. Das ist zu spät und zu weit weg. Wer Anfragen will, muss Vertrauen aufbauen, bevor die Person entschieden hat, ob sie weiterscrollt. Wie Beschriftungen auf Buttons und Formularen dabei unterstützen können, zeigt der Ratgeber Microcopy: Kleine Texte, große Wirkung.
Zu viele gleichwertige Aktionen
Navigation, drei verschiedene Buttons, ein Banner, ein Pop-up und ein Chat-Widget auf einmal: Wer so viele Optionen gleichzeitig anbietet, erzeugt keine Führung, sondern Lärm. Der Besucher weicht der Entscheidung aus und verlässt die Seite. Eine klar priorisierte Hauptaktion schlägt fünf gleichwertige Optionen jedes Mal.
Ein Beispiel aus der Praxis
In einem Projekt übernahmen wir eine Startseite eines Beratungsunternehmens, das gute Arbeit machte, aber kaum Anfragen über die Website bekam. Die Hauptüberschrift lautete: „Wir denken Ihren Erfolg mit“. Der Untertitel beschrieb die Unternehmensgeschichte. Ein Bild zeigte ein Konferenzraum-Stockfoto. Es gab vier Buttons in gleichem Gewicht.
Wir ersetzten die Headline durch: „Prozessberatung für Handwerksbetriebe mit mehr als 10 Mitarbeitern“. Das Bild wurde durch ein echtes Teamfoto ersetzt. Die vier Buttons wurden auf einen reduziert: „Kostenloses Erstgespräch vereinbaren“. Im Bereich direkt darunter kamen drei kurze Kundenstimmen mit echten Namen.
In den vier Wochen nach dem Relaunch stieg die Anfragerate über die Website um etwa 40 %. Die Besucherzahl hatte sich nicht verändert. Es war dieselbe Seite, dieselben Inhalte, aber klar strukturiert und mit einem Nutzenversprechen, das in 5 Sekunden zu verstehen war.
Sofort-Checkliste Startseite
Gehen Sie die folgenden Punkte für Ihre aktuelle Startseite durch. Jedes Nein ist eine konkrete Stelle, an der Besucher verloren gehen.
- Benennt die Hauptüberschrift konkret, was angeboten wird und für wen?
- Lässt sich das Nutzenversprechen in unter 10 Sekunden erfassen?
- Unterstützt das Hero-Bild die Aussage der Headline, ohne generisch zu wirken?
- Gibt es genau einen primären Call to Action mit konkreter Beschriftung?
- Steht mindestens ein Vertrauenssignal im sichtbaren Bereich der Startseite?
- Sind Leistungen aus Kundenperspektive beschrieben (Nutzen, nicht Tätigkeit)?
- Gibt es klare visuelle Abschnitte, die das Scannen erleichtern?
- Lädt die Startseite unter 2,5 Sekunden auf einem Smartphone?
- Gibt es am Seitenende einen letzten Handlungsaufruf für alle, die noch scrollen?
- Zeigt ein 10-Sekunden-Test mit einer unbekannten Person, was das Unternehmen anbietet?
- Der erste visuelle Eindruck entsteht in 50 ms. Klarheit und Seriosität in der Gestaltung sind keine Optionen, sondern Voraussetzungen.
- 57 % der Betrachtungszeit entfällt auf den Bereich ohne Scrollen: Nutzenversprechen, Bild und Handlungsaufruf gehören genau dort hin.
- Eine Startseite folgt einer festen Abfolge: Nutzenversprechen, Leistungen, Vertrauen, Handlungsaufruf. In dieser Reihenfolge, nicht anders.
- Besucher scannen, sie lesen nicht. Kurze erste Sätze, aussagekräftige Überschriften und visuelle Abschnitte sind kein Komfort, sondern Pflicht.
Häufige Fragen zur Startseiten-Optimierung
Wie lang sollte die Startseite sein?
Kein festgelegtes Maß, aber eine klare Regel: So lang wie nötig, um die drei Kernfragen zu beantworten, was angeboten wird, warum gerade dieses Unternehmen, und was der nächste Schritt ist. In der Praxis kommen viele gut funktionierende Startseiten mit vier bis sechs Abschnitten aus. Länger lohnt sich nur, wenn jeder zusätzliche Abschnitt eine eigene Aufgabe hat.
Sollte die Startseite für alle Zielgruppen gleichzeitig sprechen?
Nein. Wer alle anspricht, spricht niemanden wirklich an. Besser eine Zielgruppe klar benennen und eine zweite mit einem eigenen Einstiegspunkt versehen (etwa über die Navigation). Wer mehrere gleichwertige Zielgruppen hat, kann diese im Leistungsüberblick trennen. Die Hauptüberschrift sollte aber für die wichtigste Gruppe sprechen.
Wie oft sollte die Startseite überarbeitet werden?
Mindestens einmal jährlich auf aktuelle Anforderungen prüfen. Anlassbezogen sofort: wenn sich das Angebot ändert, wenn Anfragen ausbleiben, oder wenn die Analysedaten zeigen, dass Besucher die Seite nach wenigen Sekunden verlassen. Ein gutes Webanalyse-Tool gibt hier konkrete Hinweise.
Was ist wichtiger: Design oder Text?
Beides ist abhängig voneinander, aber in einer Reihenfolge: Der Text, konkret das Nutzenversprechen, muss zuerst stimmen. Ein schönes Design kann eine schwache Botschaft nicht retten. Ein starkes Nutzenversprechen in einem schlichten Design überzeugt. Der Idealfall ist natürlich beides, aber wer bei null anfängt, beginnt mit dem Text.
Was passiert, wenn Besucher die Seite nach oben scrollen und wieder zurück?
Das zeigt in der Regel, dass die Navigation fehlt oder verwirrend ist. Wer zurückscrollt, sucht etwas und hat es nicht gefunden. Eine klare Navigation mit maximal fünf bis sechs Punkten auf der ersten Ebene und eine Sticky-Navigation (die beim Scrollen sichtbar bleibt) lösen dieses Problem in den meisten Fällen.