Diese Seite dient als virtuelle Haustür Ihres Unternehmens und ist für den Großteil des Traffics Ihrer Website verantwortlich. Trotz seiner Bekanntheit haben viele Unternehmen Schwierigkeiten, es richtig zu optimieren.

Sie sehen, Ihre Homepage muss viele Hüte tragen. Anstatt es wie eine dedizierte Zielseite zu behandeln, die um eine bestimmte Aktion herum aufgebaut ist, sollte es so konzipiert sein, dass es verschiedenen Zielgruppen aus verschiedenen Ländern dient. Und um dies effektiv zu tun, muss es mit Absicht gebaut werden. Mit anderen Worten, Sie müssen Elemente integrieren, die Traffic anziehen, Besucher informieren und Conversions einladen.

Um die Leistung Ihrer Homepage zu verbessern, überprüfen Sie diese Elemente, die jede Homepage haben muss.

Kostenloser Herunterladen: 77 Beispiele für brillantes Webdesign

12 Kritische Elemente, die jede Website-Homepage haben muss

Speichern

12 kritische Elemente für eine Website Homepage Infografik

Speichern

Teilen Sie dieses Bild auf Ihrer Website

Was Sie in Ihre Website aufnehmen sollten Homepage-Design

Überschrift

Innerhalb von drei Sekunden muss eine Website den Besuchern mitteilen, was das Unternehmen zu bieten hat. Hier kommt Ihre Überschrift ins Spiel. Es kann nur ein paar Worte sein, aber es ist eines der wichtigsten Stücke der Kopie auf Ihrer Website.

Viele Arten von Menschen könnten Ihre Website besuchen, und es wird Ihnen schwer fallen, ein paar Worte zu finden, die für alle zu Hause sind. Schreiben Sie stattdessen Ihre Überschrift, um ein Drittel der Personen anzusprechen, die mit Ihrem Produkt am ehesten zufrieden sind.

Halten Sie die Überschrift selbst klar und einfach. Die Schlagzeile von Dropbox ist ein gutes Beispiel: „Alles, was Sie für die Arbeit benötigen, an einem Ort.“ Es ist einfach, aber leistungsstark — Sie müssen keinen Jargon entschlüsseln, um herauszufinden, was Dropbox wirklich tut.

Dropbox Website Homepage

Unterüberschrift

Ihre Unterüberschrift sollte die Überschrift ergänzen, indem Sie eine kurze Beschreibung Ihrer Aktivitäten oder Angebote enthält. Dies kann effektiv erreicht werden, indem Sie sich auf einen gemeinsamen Schmerzpunkt konzentrieren, den Ihr Produkt oder Ihre Dienstleistung löst.

Hier ist ein Beispiel für eine großartige Überschrift von Mirror: „Hiding in plain sight.“ Es schärft das primäre Verkaufsargument des Spiegels.: Es ist ein komplettes Fitnessstudio zu Hause, ein persönlicher Trainer und ein Trainingsplan, alles bequem von zu Hause aus, ohne wertvolle Quadratmeter mit Geräten zu belegen.Mirror website homepage subheadline that reads hiding in plain sight

Um Ihre Überschriften für Mobilgeräte zu optimieren, verwenden Sie größere Schriftarten, um den Besuchern ein besseres Erlebnis zu bieten. Kleine Schriftarten können mobile Besucher zwingen, zu kneifen und zu zoomen, um den Inhalt Ihrer Website zu lesen und mit ihm zu interagieren. Unser Rat? Verwenden Sie die Überschriftenoptionen in Ihrem Seiteneditor. H1-Überschriften eignen sich perfekt für Seitentitel — es sollte nur ein H1 auf einer Seite vorhanden sein. Unterüberschriften sollten der Reihenfolge der Hierarchie H2, H3 folgen … H6, und so weiter. Sie können mehrere dieser Überschriften haben, stellen Sie einfach sicher, dass sie in Ordnung sind. Zum Beispiel möchten Sie nicht von einem H1 zu einem H3 springen — wählen Sie stattdessen ein H2.

Primäre Handlungsaufforderungen

Das Ziel Ihrer Homepage ist es, Besucher zu zwingen, tiefer in Ihre Website einzudringen und sie den Trichter hinunter zu bewegen. Fügen Sie zwei bis drei Handlungsaufforderungen über der Falte hinzu, die die Menschen zu verschiedenen Phasen des Kaufzyklus führen — und platzieren Sie sie an leicht zu findenden Stellen.

Diese CTAs sollten optisch auffällig sein, idealerweise in einer Farbe, die sich vom Farbschema Ihrer Homepage abhebt und dennoch zum Gesamtdesign passt. Halten Sie die Kopie kurz – nicht mehr als fünf Wörter — und handlungsorientiert, damit die Besucher auf das klicken, was Sie anbieten. Beispiele für CTA-Kopien sind „Anmelden,““Einen Termin vereinbaren,“Oder“Probieren Sie es kostenlos aus.“

Die Website von Afterschool HQ enthält zwei CTAs, die sich beide an Programmdirektoren richten, die daran interessiert sind, ihre After-School-Programme für Familien auf der Website zu bewerben. Der Hinweis unter dem längeren CTA „Erstellen Sie Ihr kostenloses Profil“ gibt Besuchern den Anstoß, ein Konto zu erstellen — der erste Schritt, um ein Afterschool-HQ-Anbieter zu werden.

Unterstützendes Bild

Die meisten Menschen sind visuell. Stellen Sie sicher, dass Sie ein Bild (oder sogar ein kurzes Video) verwenden, das deutlich zeigt, was Sie anbieten. Verwenden Sie Bilder, die Emotionen einfangen, Aktionen auslösen und die Geschichte, über die Sie schreiben, visuell erzählen.

Verwenden Sie hochwertige Bilder mit reduzierter Dateigröße, um Ihre Bilder für mobile Benutzer zu optimieren. (HubSpot-Kunden müssen sich darüber keine Sorgen machen, da in die HubSpot-Software hochgeladene Bilder automatisch komprimiert werden. Andernfalls werden Tools wie TinyPNG den Trick machen.) Fügen Sie Ihren Bildern immer Alternativtext hinzu, um sie für Besucher, die Screenreader verwenden, zugänglicher zu machen und Ihre SEO-Bemühungen zu verbessern.

Die 4 Rivers Smokehouse-Homepage ist ein großartiges Beispiel für emotionale Bilder: Sie enthält eine Reihe kurzer, hochauflösender und köstlicher Videos, die in einer Schleife hinter einer einfachen Überschrift, einer Unterüberschrift und einem primären CTA abgespielt werden:

4 rivers smokehouse website Homepage ausgewähltes Bild mit einem Käseburger

Vorteile

Es ist nicht nur wichtig zu beschreiben, was Sie tun, sondern auch, warum das, was Sie tun, wichtig ist. Interessenten möchten über die Vorteile des Kaufs bei Ihnen Bescheid wissen, denn das wird sie dazu zwingen, dabei zu bleiben.

Halten Sie die Kopie leicht und einfach zu lesen, und sprechen Sie die Sprache Ihrer Kunden. Evernote leistet hervorragende Arbeit, um Vorteile auf seiner Homepage überzeugend, visuell ansprechend und leicht verständlich aufzulisten:

Evernote Website Homepage Vorteile

Social Proof

Social Proof ist ein starker Indikator für Vertrauen. Ihr Produkt oder Ihre Dienstleistung könnte das beste der Welt sein, und es ist in Ordnung, diese Behauptung aufzustellen — es ist nur so, dass die Leute Ihnen möglicherweise nicht glauben, es sei denn, sie hören es auch von anderen Menschen. Und genau das macht Social Proof.

Fügen Sie nur einige Ihrer besten (kurzen) Zitate auf der Homepage ein und verlinken Sie gegebenenfalls auf Fallstudien. Das Hinzufügen eines Namens und eines Fotos verleiht diesen Testimonials mehr Glaubwürdigkeit. Lessonly Nägel dies auf ihrer Homepage mit glühenden Zeugnissen von tatsächlichen Kunden.

Lessonly Website Homepage Testimonials und Bewertungen

Navigation

Das Design und der Inhalt Ihrer Homepage-Navigation können den Unterschied zwischen einer Website-Konvertierung und einem Bounce ausmachen. Um die Absprungrate zu verringern, geben Sie Ihren Besuchern direkt von der Homepage aus einen klaren Weg zu den gewünschten Seiten. Machen Sie das Navigationsmenü oben auf der Seite sichtbar und organisieren Sie die Links in einer hierarchischen Struktur.

Niemand kennt Ihre Website besser als diejenigen, die sie mitgestaltet haben. Führen Sie daher Benutzertests durch, um sicherzustellen, dass Besucher auf Ihrer Website einfach und intuitiv finden, wonach sie suchen. Fügen Sie ein Suchfeld ein, wenn Sie können. (Lesen Sie diesen Blogbeitrag für weitere hilfreiche Tipps zur Website-Navigation.)

Hier ist ein Beispiel für ein klares, gut strukturiertes Navigationsdesign von Slim & Husky’s Pizza Beera Homepage:

Slim and huskys Website Homepage Navigation

Inhaltsangebot

Um noch mehr Leads von Ihrer Homepage zu generieren, bieten Sie ein wirklich großartiges Inhaltsangebot an, z. B. ein Whitepaper, ein eBook oder einen Leitfaden. Leute, die vielleicht nicht bereit sind zu kaufen, laden vielleicht lieber ein Angebot herunter, das ihnen mehr Informationen zu einem Thema gibt, an dem sie interessiert sind. Wenn Sie Inspiration benötigen, stehen Ihnen hier verschiedene Inhaltstypen zur Auswahl.

Sekundäre Handlungsaufforderungen

Fügen Sie sekundäre CTAs auf Ihrer Homepage ein, um Interessenten, die nicht an Ihrem Hauptziel interessiert sind, zusätzliche Conversion-Möglichkeiten zu bieten. Denken Sie an sie wie den Notfallplan: Sie bieten einen anderen Weg für Besucher, die noch nicht bereit sind für etwas so hohes Engagement, wie Sie fragen.

Während sich Ihre primären CTAs über der Falte befinden sollten, platzieren Sie sekundäre CTAs unter der Falte, damit Besucher beim Scrollen nach unten auf Dinge klicken können. Zum Beispiel finden Sie unter der Falte auf der Homepage von Spanx drei klar beschriftete Calls-to-Action, die Leuten, die so weit gescrollt haben, ein paar weitere Optionen zum Klicken geben. Diese sekundären CTAs sind für zwei verschiedene Arten von Conversions: eine ganz links für $ 20 Rabatt und eine andere, „jetzt einkaufen“, um den Online-Katalog zu erkunden.

Spanx Website Homepage sekundäre CTAs

Eigenschaften

Listen Sie zusätzlich zu den Vorteilen einige Ihrer wichtigsten Funktionen auf. Dies gibt den Menschen ein besseres Verständnis dafür, was Ihre Produkte und Dienstleistungen bieten. Halten Sie die Kopie wieder leicht und gut lesbar. Dropbox for Business zum Beispiel scheut sich nicht, eine Feature-Matrix direkt auf ihrer Homepage unter der Falte zu zeigen.

dropbox for Business Homepage-Funktionen

Ressourcen

Auch hier sind die meisten Besucher Ihrer Website nicht bereit zu kaufen … noch. Für Leute, die nach weiteren Informationen suchen, bieten Sie einen Link zu einem Ressourcenzentrum an, in dem sie relevante Informationen durchsuchen können. Dies hält sie nicht nur länger auf Ihrer Webseite, sondern hilft Ihnen auch, Ihre Glaubwürdigkeit als Vordenker in Ihrer Branche zu etablieren.

Lovesac fügt der Fußzeile unterhalb der Falte einen Ressourcenlink hinzu. Beachten Sie, wie jede dieser sekundären CTAs mehrere Phasen des Kaufzyklus abdeckt: einen Kreditkartenlink, mit dem Kunden ihre Möbel einfach kaufen können, einen Stoffmuster-Leitfaden für diejenigen, die vor dem Kauf noch nach der perfekten Farbe suchen, und einen Online-Katalog für Personen, die auf dem Markt für neue Möbel sind, aber noch nicht bereit sind, einen Kauf zu tätigen.

lovesac Website Homepage mit Ressourcen und CTAs in der Fußzeile

Erfolgsindikatoren

Neben Erfolgsgeschichten von Kunden können sowohl Auszeichnungen als auch Anerkennungen dazu beitragen, einen guten ersten Eindruck zu hinterlassen. Ist Ihr Unternehmen ein von der Kritik gefeiertes Restaurant? Wurden Sie dieses Jahr zur besten neuen App gewählt? Informieren Sie Ihre Homepage-Besucher über Ihre Leistungen. Wie Social Proof gibt es Ihrem Unternehmen mehr Glaubwürdigkeit für diejenigen, die Sie nicht kennen.

Auf der Homepage von Calendly finden Sie beispielsweise die Namen bekannter Organisationen, die sie erkannt haben, wie Gartner und Dropbox.

Calendly Website Homepage

Eine Homepage, die einen Besuch wert ist

Die Homepage Ihrer Website ist die erste Einführung, die jeder Besucher in Ihr Unternehmen haben wird. Bevor sie sich entscheiden, Kunde zu werden, überprüfen sie Ihre Homepage, um eine Vorstellung davon zu bekommen, was Sie verkaufen, warum das für sie wichtig ist und wie sie von Ihrem Angebot profitieren können.

Machen Sie einen brillanten ersten Eindruck mit einer Homepage, die die oben beschriebenen Elemente enthält. Und für mehr Inspiration, Schauen Sie sich atemberaubende Beispiele von Homepages an, indem Sie das kostenlose Lookbook unten herunterladen.

Anmerkung der Redaktion: Dieser Beitrag wurde ursprünglich im Januar 2012 veröffentlicht und aus Gründen der Aktualität, Genauigkeit und Vollständigkeit aktualisiert.

Beispiele für brillantes Homepage-, Blog- und Landingpage-Design

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.