Besseres Einkaufs­­­­­erlebnis dank optimierter Shop-Startseite

Startseite eines Online-Shops

Es gibt nicht DIE optimale Startseite im Online-Shop, aber Sie können dafür sorgen, dass die Startseite Ihres Online-Shops optimal auf Ihre Bedürfnisse und die Ihrer Kundschaft zugeschnitten ist. Am wichtigsten bleibt dabei: Der erste Eindruck zählt. Natürlich ist es wichtig, Ihre Produkte in den Fokus des Shops zu stellen, doch denken Sie immer auch an Ihre Zielgruppe. Stellen Sie sich vor, selbst vor dem Problem zu stehen, das Ihr Produkt lösen soll.

Was erwartet Ihre Kundschaft von einem Online-Shop? Welche Informationen möchten sie als erstes erhalten? Fokussieren Sie sich mit Ihrer Startseite auf die Beantwortung dieser dringenden Fragen. Und denken Sie dabei an das Prinzip: „So viel wie möglich, nicht mehr als nötig“. Die Übersichtlichkeit und die Vertrauenswürdigkeit Ihres Online-Shops sind essenzielle Faktoren, denn die Kundschaft entscheidet oftmals in den ersten Sekunden in Ihrem Online-Shop, ob sie bei Ihnen einkaufen möchte oder nicht. Mit welchen Elementen Sie überzeugen können und worauf Sie bei der Startseitengestaltung achten sollten, haben wir Ihnen in diesem Beitrag übersichtlich zusammengefasst.

1. Wieso sind die Startseite und ihre Gestaltung so wichtig?

Stellen Sie sich vor, Sie suchen einen Ventilator zur Abkühlung im Sommer. Bei Ihrer Produktsuche landen Sie anschließend recht zuverlässig auf einer Produktdetailseite eines Online-Shops, der entsprechende Artikel anbietet. Es ist also nicht zwingend die Startseite, die die Kundschaft bei ihrer Produktsuche als Erstes angezeigt bekommt. Will die Kundschaft jetzt herausfinden, was der Shop insgesamt zu bieten hat, wie vertrauenswürdig er ist und ob es gegebenenfalls weitere günstige Angebote zu ihrer Suche gibt, dann geht sie oftmals weiter auf die Startseite. Diese Seite ist das Herzstück eines Online-Shops, denn sie vereint alle wesentlichen Informationen zu den Services, Leistungen sowie dem Sortiment.

Die Startseite funktioniert also wie ein Schaufenster oder eine Ausstellungsvitrine, die Einblicke in das Produktsortiment geben, Informationen liefern und Anreize zum Kaufen schaffen sollen. Dabei beschränkt sich die Startseite nicht auf ein bestimmtes Thema, wie das bei Landingpages der Fall ist, sondern sie präsentiert in aller Kürze möglichst Ihr gesamtes Angebot.

Die Ziele der Startseite

  • Übersicht schaffen
  • Vertrauen erwecken
  • Orientierungshilfe bieten
  • wesentliche Informationen vermitteln
  • Kundschaft emotional ansprechen
  • Produktauswahl präsentieren
  • auf Angebote aufmerksam machen

Wie Sie eine einladende Übersicht geben und Ihre Kundschaft erreichen können, möchten wir Ihnen in den nächsten Abschnitten genauer erläutern.

2. Welche Elemente sind auf der Startseite eines Online-Shops notwendig?

Im Hauptteil der Shop-Startseite soll die Kundschaft in erster Linie einen Einblick in das Produktsortiment und über aktuelle Angebote erhalten. Im Idealfall gewinnt sie Vertrauen in das Unternehmen hinter dem Online-Shop und findet schnell zum gewünschten Produkt.

Die wesentlichen Bestandteile einer Startseite des Online-Shops sind:

  • Angebote und Rabatthinweise
  • Übersicht zum Produktsortiment
  • Kundenbewertungen
  • Handlungsaufforderungen mittels Schaltflächen

Angebote und Rabatthinweise

Angebote und Rabatthinweise sind Elemente, die im Hauptteil der Startseite genutzt werden sollten. Die Elemente sind nicht zwingend erforderlich, aber eine sehr gute Möglichkeit, um Besucherinnen und Besucher anzulocken und zum Kauf zu animieren. Nutzen Sie hier zum Beispiel ein Slider-Element. Damit kann der Fokus abwechselnd auf bestimmte Produkte Ihres Sortiments oder auf Sonderangebote gelegt werden. Mittels größerer Schrift, passendem Bildmaterial oder Grafik und hervorgehobener Farbgebung können sie Eye-Catcher sein, die aber keinen starken Kontrast zur Gesamtfarbgebung der Seite bilden sollten. Lehnen Sie die Gestaltung der Angebote an Ihrem Corporate Design an.

misspompadour-orientierungshilfen_abb2

Übersicht zum Produktsortiment

Die Startseite Ihres Online-Shops eignet sich sehr gut, um Ihren Besucherinnen und Besuchern einen schnellen Überblick über Ihr Sortiment zu geben. Mittels Produktvorschauen können Sie neben Produktkategorien auch einige ausgewählte Produkte (zum Beispiel Topseller) präsentieren, um die Aufmerksamkeit der Besucherinnen und Besucher zu erregen und gezielt auf diese Produkte zu lenken. Hier eignet sich eine Kombination aus Text- und Bildelementen, um die Kundschaft mittels passender Bildsprache emotional anzusprechen.

misspompadour-kategorieauswahl_abb1

Kundenbewertungen

Erzeugen Sie anschließend Vertrauen und Glaubwürdigkeit, indem Sie aussagekräftige Kundenbewertungen zu den angebotenen Produkten auf Ihrer Startseite präsentieren. Geben Sie am besten die Quelle gleich mit an oder ein Bild der Kundin oder des Kunden, das gerade auch im B2B-Bereich vertrauensstiftend wirkt. Zeigen Sie so Ihre Wertschätzung für die Kundenmeinung und geben Sie dem Ganzen eine persönliche Note.

misspompadour-testimonials_abb3

Handlungsaufforderungen über Schaltflächen (Buttons)

Ohne konkrete Handlungsaufforderung gibt es (wahrscheinlich) keine Interaktion des Kunden oder der Kundin. Dies erreichen Sie über aussagekräftige Schaltflächen (Buttons). Platzieren Sie diese Felder in einem ausgewogenen Verhältnis zu den weiteren Elementen auf der Startseite und heben Sie sie mit der Highlight-Farbe Ihres Online-Shops hervor. Achten Sie auf den richtigen Kontext und zeigen Sie mit präzisen Handlungsaufforderungen, was die Nutzenden mit Betätigung der Schaltfläche erwarten können: Bezeichnungen wie "Zum Warenkorb hinzufügen", „Anmelden“, „Mehr Details“ oder "Jetzt kaufen" sind wichtig, um Personen zum Handeln zu bewegen und ihnen gleichzeitig den Bestellprozess zu erleichtern.

Responsive Design

Vergessen Sie bitte nicht das responsive Design Ihres Online-Shops. Immer mehr Kundinnen und Kunden greifen heutzutage über mobile Geräte auf Online-Shops zu. Aus diesem Grund ist es wichtig, dass die gesamte Website – angefangen mit der Startseite und allen Seitenelementen – ein responsives Design haben, das sich an verschiedene Bildschirmgrößen flexibel anpasst. Etwas ausführlichere Informationen finden Sie hierzu im Abschnitt zur Umsetzung der Shop-Gestaltung.

3. Gibt es weitere Elemente, die sinnvoll auf einer Startseite im Online-Shop sind?

Welche weiteren Elemente Sie auf Ihrer Startseite einsetzen, hängt immer auch stark davon ab, was Ihre spezifischen Anforderungen sowie Ihre Zielsetzungen für die Shop-Seite sind. Auch sollten Sie immer bedenken, dass nicht alle optionalen Elemente gleichzeitig auf der Startseite vorhanden sein sollten. Ganz nach dem Prinzip „weniger ist mehr“ (mehr dazu im nächsten Punkt) wählen Sie die Seitenelemente sorgfältig – und entsprechend der Bedürfnisse Ihrer Zielgruppe – aus. Dadurch vermeiden Sie es, die Seite zu überladen oder Ihre Kundschaft mit zu vielen Informationen zu verwirren.

Auswahl an optionalen Elementen

  • Produktempfehlungen und Neuheiten
  • Vertrauenshinweise
  • Social-Media-Integrationen
  • Blog
  • Newsletter-Anmeldung
  • Weitere Kontaktoptionen
  • Video-Präsentationen, z. B. von Produkten, Herstellungsprozessen, Anwendungsfällen oder die Unternehmenspräsentation

Produktempfehlungen und Neuheiten

Eine Sektion mit empfohlenen Produkten kann auf der Startseite platziert werden, um Besucherinnen und Besuchern gezielte Vorschläge zu machen. Sie kann beispielsweise mit der Sortiment-Übersicht kombiniert werden und die Aufmerksamkeit auf bestimmte Artikel lenken. Je nach Umfang Ihres Produktsortiments können Sie Hinweise zu Bestsellern oder Neuerscheinungen sinnvoll einsetzen. Bei einer größeren Anzahl solcher Produkte empfiehlt es sich aber, diese Inhalte auf eigenständige Unterseiten zu verlagern und diese auf der Startseite entsprechend zu verlinken.

Vertrauenshinweise

Die Platzierung von Vertrauenssymbolen wie Qualitätssiegel (z. B. von Trusted Shops), Sicherheitssiegel, Zahlungsmethoden und Versandpartner-Logos kann das Vertrauen Ihrer Besucherinnen und Besucher stärken. Zusammen mit den vollständigen Datenschutzhinweisen sowie dem Impressum zeigen Sie auf diese Weise, dass Ihr Online-Shop seriös und zuverlässig ist.

Social-Media-Integrationen

Die Einbindung von Social-Media-Links oder -Widgets kann optional auf der Startseite erfolgen. Gerne werden diese Elemente im Footer untergebracht, um jederzeit und von jeder Seite aus darauf zugreifen zu können und Besucherinnen und Besucher zu ermutigen, Ihrem Online-Shop bzw. Ihrer Marke auf sozialen Plattformen zu folgen oder gegebenenfalls bestimmte Inhalte zu teilen. Ein direkter Link zum Teilen lohnt sich am ehesten bei Topseller-Produkten oder Praxistipps zur Produktanwendung, über die sich Ihre Community mit Bekannten austauschen kann.

Blog

Einige Online-Händler integrieren einen Blog auf ihrer Startseite, um informative Inhalte bereitzustellen. Diese können die Besuchenden zielgerichtet ansprechen und bieten ihnen einen Mehrwert dank detaillierter Informationen zu den Produkten, wie beispielsweise Anwendungshinweise oder ergänzende Videoinhalte mit Funktionsbeschreibungen. Eine komplette Integration des Blogs in die Shop-Startseite empfiehlt sich jedoch nicht. Besser ist es, viel gelesene oder inhaltlich wertvolle Beiträge anzuteasern und die Kundschaft dann auf einen separaten Blog-Bereich weiterzuleiten. Es ist immer sinnvoll, die Inhalte so zu gestalten, dass sie Produkte und ihre Beschreibungen aufnehmen und erweitern. Mit der richtigen Umsetzung lässt sich hier das Ranking zu bestimmten Schlagwörtern und somit die Suchmaschinenoptimierung der Texte im Online-Shop verbessern.

adler-lacke-blog_abb4

Video-Präsentationen

Manche Online-Händler entscheiden sich dafür, auf ihrer Startseite Videos einzubinden, um ihre Produkte oder ihre Marke in Aktion zu zeigen und eine visuell ansprechende Darstellung zu bieten. Dies ist insofern sinnvoll, da die heute digitale Welt immer mehr von Bewegtbild dominiert wird und dadurch Aufmerksamkeit erzeugt wird. Hier ist es wichtig, ein gut ausgearbeitetes Konzept sowie eine wirkungsvolle Kernaussage für den Videoinhalt zu finden, da mit Video-Präsentationen ein sehr hoher Aufwand und hohe Kosten verbunden sind. Achten Sie bei der Produktion besonders auf eine zur Marke passende Bildsprache sowie Tonalität und erstellen Sie die Videos in verschiedenen Formaten für Ihre jeweiligen Vertriebskanäle.

dtv-newsletter-anmeldung_abb6

Newsletter-Anmeldung

Eine Newsletter-Anmeldung ist ein häufig genutztes Element auf der Startseite, um Ihre Kundschaft auf dem neuesten Stand zu halten. Hier können Sie Besucherinnen und Besucher dazu einladen, sich regelmäßig über Neuerscheinungen und Rabattaktionen oder weitere Neuigkeiten rechtzeitig informieren zu lassen. Sollten Sie dieses Element nutzen wollen, fragen Sie nur die für den Newsletter-Versand benötigten Informationen bei der Anmeldung kurz ab. Achten Sie darauf, dass die Kundschaft aktiv zustimmen muss (Double-Opt-In), Ihren Newsletter zu erhalten. Fassen Sie gerne auch kurz zusammen, worauf sich Ihre Newsletter-Abonnenten freuen können.

misspompadour-newsletter_abb5

Weitere Kontaktoptionen (Live-Chat)

Ein Live-Chat-Fenster oder andere Kundensupport-Optionen können ebenfalls auf der Startseite platziert werden. Dadurch erhält die Kundschaft eine schnelle und bequeme Möglichkeit, Fragen zu stellen oder den Support um Hilfe zu bitten. Das Fenster wird gern als bewegliches Pop-up eingeblendet, das auch dann im sichtbaren Bereich bleibt, wenn Shopbesucher scrollen.

Achten Sie jedoch dringend darauf, dass dieses Pop-up-Fenster nicht die Links zu den wichtigen Seiten wie Kontakt, Datenschutz oder Impressum verdeckt, wenn beispielsweise das Ende der Startseite erreicht wird. Optisch kann hier wieder mit reduziertem Design des Chatfensters und einem Highlight auf dem „Senden“-Button gearbeitet werden. Eine individuelle Ergänzung ist die Einblendung von kleinen Profilbildern des Kundensupport-Teams, um der Kundschaft zu versichern, dass sich jemand persönlich um ihr Anliegen kümmert.

exconcept-live-chat_abb7

4. Gibt es „No-Go’s” und Trends?

Online-Shop-Designs unterliegen natürlich bestimmten Gestaltungsrichtlinien und entwickeln sich durch den Einfluss neuer Trends stetig weiter. Auch in der Google-Suchmaschine werden inzwischen häufiger mobile Ansichten bei den Ergebnissen bevorzugt, um damit auf die steigende Nutzung mobiler Endgeräte für den E-Commerce zu reagieren.

Durch die immer niedrigere Aufmerksamkeitsspanne der Kundschaft fällt sie inzwischen in Sekunden die Entscheidung, ob die Gestaltung und das Angebot eines Online-Shops interessant ist und sie sich die Shopseiten genauer betrachten. Aus diesem Grund sollten Sie die Startseite nicht mit Begrüßungsfloskeln oder inhaltsleeren Elementen beginnen. Wichtiger ist es, direkt auf Ihre Alleinstellungsmerkmale (USP), die sonstigen Angebote sowie die Sortimentsauswahl Ihres Online-Geschäfts einzugehen. Auf diese Weise weiß die potenzielle Kundschaft sofort, ob Ihr spezielles Angebot zur ursprünglichen Suchintention passt.

5. Wie sollten Sie bei der Gestaltung der Shop-Startseite vorgehen?

Das Prinzip „weniger ist mehr“ anwenden

Es ist enorm wichtig, dass die Startseite sehr übersichtlich ist und alles sofort erfasst werden kann. Bei der Gestaltung der Startseite heißt es daher: „weniger ist mehr“, da es sonst zu einer Reizüberflutung kommen kann. Geben Sie wichtigen Angeboten genug Raum, um wahrgenommen zu werden. Achten Sie aber ebenso darauf, dass die Seite nicht zu leer wirkt. Sonst entsteht bei Ihrer Kundschaft der Eindruck, Ihr Online-Shop habe nicht viel zu bieten.

Die Corporate Identity des Unternehmens beachten

Für die Hervorhebung der Highlights aber auch für die Gesamtgestaltung des Online-Shops sollten Sie auf das Corporate Design beziehungsweise die Corporate Identity Ihres Unternehmens zurückgreifen. Indem Sie die gleichen Farben, Formen sowie Hervorhebungen und Grafikstile nutzen, erzeugen Sie eine medienunabhängige optische Einheit von Ihren Online-Auftritten und der Unternehmensmarke. Fördern Sie ihr Branding und erhöhen Sie so den Wiedererkennungswert Ihres Online-Shops für Ihre Kundschaft – auch über andere Vertriebskanäle hinweg.

„Das Design eines Online-Shops ist sehr flexibel. Grundsätzlich sollte die Gestaltung ausgewogen sein, die Seite nicht überladen wirken und die Produkte als Ganzes unterstützen. Stellen Sie die Zielgruppe und Nutzerfreundlichkeit am besten immer in den Fokus, erst danach sind das Firmen-Branding sowie die Vertrauenswürdigkeit des Online-Shops zu berücksichtigen.“

Sven Greifendorf, UI/UX-Designer

 

Auf die mobile Ansicht der Startseite optimieren

Ein weiterer Punkt bei der Startseiten-Gestaltung ist die Priorisierung der mobilen Ansicht des Online-Shops. Die Zielgruppe mit mobilen Endgeräten wächst stetig und genau für diese Kundschaft ist es wichtig, dass das mobile Einkaufserlebnis nicht zum Alptraum wird. Achten Sie bei der Inhaltspflege darauf, dass die Content-Elemente flexibel anpassbar und jederzeit vollständig sichtbar sind. Zwischen den Schaltflächen sollte ausreichend Abstand liegen, weil diese sonst schlechter klickbar sind. Die Bildelemente sollten nicht angeschnitten sein. Schauen Sie hierfür gerne, wie die Online-Shops Ihrer Konkurrenz optimiert sind und greifen Sie auch auf eigene Erfahrungen mit anderen Webpräsenzen zurück, um eine zufriedenstellende mobile Ansicht der Startseite (und des gesamten Online-Shops) zu entwickeln.

Tipp:
Ganz nach dem Prinzip „weniger ist mehr“, sollten Sie das Menü für die mobile Nutzung Ihres Online-Shops auf zwei direkt klickbare Icons reduzieren und alle weiteren Informationen in das einklappbare Menü verlagern (wird durch die 3 horizontalen Striche auch gerne als „Burger-Menü“ bezeichnet). Das verschafft mehr Übersicht und weniger Frust bei der Kundschaft, wenn sie bestimmte Punkte auswählen will. Außerdem bevorzugt Google mit den neuesten Updates der Suchmaschine ebenfalls die mobile Optimierung aufgrund des veränderten Nutzungsverhaltens.

 

Klare Strukturen präsentieren und die Kundschaft effizient zu ihrem Ziel führen

Geben Sie mit Produkt-Empfehlungen erste Impulse und blenden Sie gegebenenfalls Kundenbewertungen als Hilfestellungen ein, um Besucherinnen und Besucher bei ihrer Entscheidung zu unterstützen. Verweisen Sie auf Praxisanwendungen, die vielleicht auch Ihr Kunde oder Ihre Kundin im Sinn hatte, als sie nach Ihrem Produkt suchten. Und wenn die Entscheidung für Ihr Produkt gefallen ist, geben Sie kurz und knackig alle Informationen an, die der Käufer zum Kaufabschluss benötigt, nachdem er sich bereits ein wenig im Shop umgesehen hat.

Wesentliches sollte dafür bereits auf der Startseite zu finden sein, die Details – z. B. für bestimmte Versand- und Zahlungsarten – sollten Sie hingegen auf Unterseiten platzieren. Natürlich verlaufen nicht jede Produktsuche und jeder Besuch in Ihrem Online-Shop nach demselben Muster. Daher sind ein professioneller Auftritt und ein stimmiges (optisches) Gesamtbild weitere wesentliche Faktoren, um ihre Kundschaft bereits in den ersten Sekunden zum Stöbern in Ihrem Online-Shop zu animieren.

Neue Inhalte und Angebote testen, messen und die Seite anpassen

Die Startseite deines Shops kann ein großes Feld für Tests zur Nutzerinteraktion sein:

  • Was funktioniert bei meiner Kundschaft?
  • Womit kann ich mehr Umsatz generieren?
  • Wann kann ich mit höheren Preisen an den Markt gehen?

Um diese Fragen richtig zu beantworten, muss eine passende Testreihe durchgeführt und zum Beispiel eine ungewöhnliche Aktion populär auf der Startseite platziert werden. Stellen Sie hierfür entsprechende Ziele und Messwerte auf, die Sie mit bekannten Werkzeugen wie Google Analytics oder Matomo im Blick haben. Nur mithilfe der Messung und Auswertung der Nutzerreaktion können Sie wirklich Schlüsse aus diesen Reaktionsprüfungen ziehen und entsprechende Anpassungen vornehmen.

Setzen Sie sich messbare Ziele und optimieren Sie Ihren Online-Shop kontinuierlich

Setzen Sie sich konkrete Ziele, die messbar sind und führen Sie regelmäßige Analysen durch. Nur mit exakten Angaben wie „x Besucher und Besucherinnen sollten im Monat Angebot y wahrnehmen“ lässt sich messen, ob diese Zahl erreicht wird oder Sie Anpassungen bei der Gestaltung vornehmen sollten. Blenden Sie beispielsweise bestimmte Angebote nur einem Teil der jeweiligen Zielgruppe ein, die auf Ihre Seite kommen, wenn Sie sich zwischen verschiedenen Angeboten nicht entscheiden können. Mit dieser geteilten Ansicht lässt sich dann testen, welches Angebot häufiger von Besuchern wahrgenommen wird (sogenanntes A/B-Testing).

Aus den gewonnenen Erkenntnissen lassen sich anschließend Maßnahmen zur Verbesserung der Startseite ableiten. Auf diese Weise können Sie die Elemente auf wenige wesentliche Produkte oder Aktionen reduzieren und sich auf die Übersichtlichkeit der Startseite konzentrieren. Machen Sie sich ganz zum Schluss bewusst, dass die Gestaltung Ihrer Shop-Startseite einer kontinuierlichen Weiterentwicklung entspricht. Sie wandelt sich aufgrund der Erkenntnisse aus Ihren Analysen und sollte von Ihnen fortlaufend optimiert werden, um sich ebenso den stetig wechselnden Anforderungen Ihrer Zielgruppe anzupassen.

 

26.10.23
Land auswählen: