Die beste Layout-Design-Hierarchie für Ihre Homepage, um mehr Kunden und Verkäufe zu gewinnen

Die Einrichtung Ihres Online-Shops wirft verschiedene Fragen auf. Ihre Homepage dient als Drehscheibe für die beste Sachen in Ihrem Online-Shopmit Komponenten wie Bild-Schieberegler, Einkaufswagen-Schaltflächen, Produkt-Miniaturansichten und Schaltflächen sowie E-Mail-Marketing-Abonnementformularen.

Jeder ist wichtig, aber wie organisieren Sie sie, um mehr Kunden zu gewinnen, wenn man bedenkt, dass die Homepage in der Regel die am häufigsten besuchte Seite auf Ihrer Website ist? Wenn wir uns einige der kreativsten und erfolgreichsten E-Commerce-Shops ansehen, können wir eine Standard-Layout-Hierarchie ermitteln, indem wir eine Vorlage für die einzelnen Komponenten auf Ihrer Startseite generieren.

Wir beginnen mit dem Anfang der Homepage und arbeiten uns nach unten. Lesen Sie weiter, um mehr über die beste Layout-Design-Hierarchie für Ihre Homepage zu erfahren, um mehr Kunden zu gewinnen.

Dein Logo nach links oder Mitte (und Header-Komponenten)

Ihr Homepage-Header erstreckt sich auch über Ihre gesamte Website. Diese Module erfordern also einige gründliche Überlegungen. Das Ziel mit Ihrer Kopfzeile ist es, den Leuten schnell zu zeigen, worum es in Ihrer Website geht, und den Benutzern einige der am besten funktionierenden Schaltflächen und Felder zum Finden von Inhalten zur Verfügung zu stellen.

Das Logo

Logo Standort

Beginnen Sie mit Ihrem Logo. Ein schön gestaltetes Logo bietet hier den größten Nutzen, aber Sie müssen sicherstellen, dass es in der oberen linken Ecke in der Mitte der Kopfzeile platziert ist. Die Leute lesen von links nach rechts, und das Logo gibt normalerweise eine Vorstellung davon, was die Seite bietet. Wenn Ihr Logo Ihr Unternehmen nicht sofort erklärt, fügen Sie einen kurzen Slogan unter oder neben dem Logo hinzu.

Die Suchleiste

Wichtigkeit der Suchleiste

Jede E-Commerce-Website ist eine kleine Suchmaschine in sich. Wenn einer deiner Kunden, nennen wir ihn Steven, auf deiner Homepage auf der Suche nach einer Halskette landet, hat er nur ein paar Möglichkeiten zu finden, was er braucht.

Die erste und weniger effiziente Methode besteht darin, auf eine der Menü-Navigationskategorien zu klicken. Die zweite Methode, die Benutzer normalerweise schneller zur richtigen Seite führt, ist eine Suchleiste. Wenn die Suchleiste unter dem Schieberegler versteckt ist oder sich irgendwo entlang Ihrer Seitenleiste befindet, erzwingen Sie, dass Ihre Kunden das Durcheinander durchforsten, nur um eine einfache Suche durchzuführen.

Platziere dies in deiner Kopfzeile und mache es klar.

Einkaufswagen-Symbol und Knopf

Screen Shot bei 2015 06-01-11.25.00 Uhr

Da so viele Online-Shops das Einkaufswagen-Symbol in der oberen rechten Ecke der Website platzieren, können Sie davon ausgehen, dass die meisten Kunden instinktiv nach oben schauen, um herauszufinden, was sich im Einkaufswagen befindet.

Leider sind Sie normalerweise mit dem beschäftigt, was Ihr Thema oder Ihre E-Commerce-Plattform in Bezug auf das Einkaufswagen-Modul bietet, aber hier ist eine Richtlinie, wenn Sie auf dem Markt sind, um das Design zu ändern:

  • Fügen Sie ein Einkaufswagensymbol hinzu
  • Integrieren Sie einen Link oder ein Symbol, mit dem Sie auf jeder Seite der Website mit einem Klick prüfen können
  • Zeigen Sie eine Nummer an, um anzugeben, wie viele Artikel sich im Einkaufswagen befinden

Versandankündigungen

Screen Shot bei 2015 06-01-11.25.09 Uhr

Eine schöne Möglichkeit, Dringlichkeit zu schaffen, besteht darin, nach dem Kauf einer bestimmten Produktmenge einen kostenlosen Versand oder andere Anreize anzubieten. Wenn Sie so etwas in Ihre Strategie aufnehmen, müssen Sie die Ankündigung in Ihrem Website-Header vornehmen.

Der obige Screenshot zeigt ein schönes Beispiel dafür, wie das Unternehmen Kutoa seine Versandpolitik erklärt, ohne zu viel Platz zu beanspruchen.

Saisonale Banner

Dies ist vergleichbar mit der Versandrichtlinie, über die wir oben gesprochen haben, aber wenn Sie eine Saisonpromotion oder ein Sonderangebot haben, wie erwarten Sie, dass die Leute davon erfahren? Reservieren Sie einen Platz in Ihrer Kopfzeile für kleine Werbebanner. Auf diese Weise, wenn die Ferien herumrollen, fallen Sie einfach in eine Grafik und lassen Sie sie bis zum Ende der Aktion liegen.

Login / Registrierung

Dies ist eine der Hauptstützen auf E-Commerce-Homepages. Zeigen Sie einen Login / Registrierung Link deutlich in der Kopfzeile. Es erstellt einen nahtlosen Checkout-Prozess für den Kunden und Sie können einige der Kundeninformationen sammeln.

Ein Navigationsmenü mit den entsprechenden Tabs

Ihre Menüeinträge hängen ganz davon ab, welche Art von Geschäft Sie ausführen, aber es ist offensichtlich etwas, das in der Homepage-Hierarchie enthalten sein muss. Die beste Taktik besteht darin, aufzuschreiben, wohin Ihre Kunden zuerst gehen sollen, und auf dieser Grundlage Ihre Menüpunkte auszuwählen. Verkaufen Sie hauptsächlich Hemden? Machen Sie einen Ihrer ersten Menüpunkte zu einem direkten Link zu Ihren beliebtesten Shirts.

Bild oder Slider mit überlagertem Call to Action und Button

CTA Schieberegler

Der Bild-Schieberegler befindet sich direkt unter der Kopfzeile und dient dazu, atemberaubende Fotos Ihrer Produkte zu teilen. Ein Schieberegler mit nur Bildern ist jedoch nutzlos. Integrieren Sie Call-to-Actions und Schaltflächen, die die Nutzer zu einigen Ihrer beliebtesten Produkte oder Werbeaktionen führen.

Fügen Sie vier oder fünf Folien in den Schieberegler ein und ändern Sie sie entsprechend Ihrer eigenen Strategie.

Produkt Thumbnail Grid oder Slider

Thumbnail als Schieberegler oder Raster

Das Shopify Blog erklärt, wie zu viele Auswahlmöglichkeiten verwirren Kunden, drängen Sie sie, Ihre Website zu verlassen oder weniger Einkäufe zu tätigen. Obwohl Ihre Homepage ein Produktraster direkt unter dem Bildschieber benötigt, denken Sie zweimal darüber nach, ob Sie mehr als vier oder fünf Elemente packen.

E-Mail-Marketing-Abonnementformular

Das Sammeln von E-Mails für das Versenden von zukünftigen Werbeaktionen und Newslettern ist eine der einfachsten Möglichkeiten, Kunden zu binden und auf dem Laufenden zu halten. Dies ist einer der Bereiche, in denen beliebte E-Commerce-Shops variieren in Bezug auf wo die Newsletter-Anmeldung auf der Homepage sitzt. Eine Schlussfolgerung ist jedoch klar: Wenn Sie möchten, dass sich jemand anmeldet, müssen Sie ein Anmeldeformular auf der Homepage platzieren.

Die erste Methode besteht darin, Benutzer mit dem Anmeldeformular in der Kopfzeile zu treffen. Dies setzt voraus, dass Ihr Newsletter qualitativ hochwertige Inhalte bietet und es Ihnen nicht peinlich ist, diese sofort zu vermarkten.
Fügen Sie eine Anmeldung im Header hinzu

Andere Geschäfte bevorzugen die Seitenleiste oder die Fußzeile, wenn sie das Newsletter-Anmeldeformular teilen. Ich habe festgestellt, dass Online-Shops die Formulare normalerweise am unteren Rand der Seite platzieren, wenn sie nicht viele E-Mails versenden. Sie versuchen einfach, E-Mails zu sammeln, um die gelegentliche Werbung zu senden.
Screen Shot bei 2015 06-01-11.25.39 Uhr

Meine Lieblings-E-Mail-Akquisition Taktik ist das Popup-Formular, das sich nach einem Benutzer auf Ihrer Website für ein paar Sekunden offenbart. Diese generieren in der Regel die meisten Abonnements, und Sie können eindeutig angeben, dass der Kunde im Gegenzug etwas erhält.
Pop-ups

Seitenleisten oder Grid-basierte Layouts?

Die Sidebar bietet eine einzigartige Möglichkeit, Ihre weniger wichtigen Komponenten zu konsolidieren, während Sie ihnen immer noch die Aufmerksamkeit schenken, die sie verdienen. Eine ähnliche Methode nennen wir das Grid-Layout, bei dem auf Ihrer gesamten Homepage ein etwas schachbrettartiges Muster aus quadratischen Modulen besteht, die nebeneinander gestapelt sind.

gridbasiertes Layout

Welche festen Komponenten müssen in die Seitenleiste aufgenommen werden?

  • Eine Schaltfläche oder ein Link zu Ihrem Blog
  • Werbebanner oder saisonale Banner
  • Medienlinks
  • Soziale Module oder Links
  • Ein Über uns-Widget oder ein Bereich, der erklärt, worum es auf der Seite geht

Neueste Tweets

Die Fußzeile

Die meisten Ihrer Kunden werden nicht zur Fußzeile navigieren, aber einige wichtige, aber weniger dringende Links werden benötigt.

Die Fußzeile

Ich finde oft, dass das Zusammenstellen der perfekten E-Commerce-Fußzeile eine mühsame Aufgabe ist, weil es leicht ist, einige der benötigten Elemente zu vergessen. Hier ist eine Liste für den Anfang:

  • Kontaktieren Sie uns
  • Emailen Sie uns Link
  • Telefonnummer
  • Bestellstatus Link
  • FAQ-Link
  • Soziale Tasten
  • Garantie-Link
  • Datenschutzrichtlinie
  • Blog-Link
  • Versandinfo-Link
  • Informationslink zurückgeben
  • Unternehmensinfo-Link
  • Jobs verknüpfen

Die Erstellung einer effektiven E-Commerce-Homepage-Hierarchie ist eine Kunst, aber mit ein wenig Hilfe und Verständnis dafür, welche Bereiche die meisten Kunden konvertieren, können Sie Ihre Homepage in ein Zentrum für Aktivitäten verwandeln. Lassen Sie uns unten einen Kommentar, wenn Sie an andere Dinge denken, die in diese Liste gehören.

Feature Bild Knicks von Chris Bannister

Catalin Zorzini

Ich bin ein Webdesign-Blogger und habe dieses Projekt gestartet, nachdem ich ein paar Wochen damit verbracht habe, herauszufinden, wer das ist die beste E-Commerce-Plattform für mich. Überprüfen Sie meine aktuelle top 10 E-Commerce-Site-Builder.