Präsentieren Sie Ihren Shop zum Weihnachtsgeschäft von seiner besten Seite

Das erste, was Besucher von Ihrem Shop zu sehen bekommen, ist Ihre Startseite. Deshalb ist es außerordentlich wichtig, Besucher von der ersten Sekunde an so zu beeindrucken, dass nicht nur ihr Interesse geweckt wird, sondern sie auch zum Verweilen und Stöbern annimiert werden!

Powergap bietet viele Möglichkeiten, Startseiten so professionell zu gestalten, dass sich Ihr Shop deutlich von der Konkurrenz abhebt. Zudem muss das Design eine Startseite das Vertrauen in den Shop maximal unterstützen und jederzeit an die neuesten Trends & Anforderungen des Internets angepasst werden können.

Auf einer gut durchgestylten Startseite können Sie das Interesse Ihrer Besucher auf bestimmte Artikel oder Artikelgruppen lenken und dadurch deren Kaufverhalten beeinflussen.

Für die Gestaltung einer optimalen Startseite sollten einige wichtige Punkte beachtet werden, die maßgeblich zu einer erfolgsversprechenden Startseite beitragen:

1. Variable Textlängen

Suchmaschinen mögen es, wenn Seiten viel Text bieten. Besucher hingegegen empfinden zu viel Text meist als äußerst lästig. Gerade bei Handy-Nutzern, die im Online-Shopping ein stetig wachsendes Segment einnehmen, werden zu lange Texte ungelesen einfach durchgewischt.

Bedenken Sie, dass Sie einen Online-Shop betreiben und schon auf der Startseite dafür sorgen sollten, dass Ihre Besucher schnell zu dem für sie interessanten Produkt geführt werden sollten! Ist dies nicht der Fall, wird der überwiegende Teil des Textes, den Sie mühevoll erstellt haben, meist nur überflogen und könnte sich sogar störend auf den Kaufprozess auswirken!

Eine elegante Lösung für eine variable Textlänge ist einen WEITERLESEN Button einzubauen. Besucher, die mehr erfahren wollen, klicken darauf und erst dann wird ihnen zusätzlicher Text zur Verfügung gestellt. Mit einem Austausch-Button WENIGER LESEN, der den WEITERLESEN Button ersetzt, kann der zusätzliche Text wieder geschlossen werden. Suchmaschinen können den gesamten Text lesen.

Standardmäßig wird ein kurzer Text angezeigt. Über den Button "Mehr lesen" wird zusätzlicher Text angezeigt. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Nachdem auf den Button "Mehr lesen" geklickt wurde, erscheint der weitere Text. Wird der Button "Weniger lesen" geklickt, schließt sich der zusätzliche Text wieder.

Beispiele:

Hausschuh.com | Hausschuhexperte.de | German-Slippers.com

2. Vorteile hervorheben

Zeigen Sie Ihren Kunden gleich auf der Startseite, welche Vorteile ein Einkauf in Ihrem Shop für sie hat. Mit auffälligen Symbolen oder besonderer Farbgebung lassen sich die Vorteile als unübersehbare Eyecatcher gestalten.

Gestaltung der Vorteile mit SVG. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Gestaltung der Vorteile mit CSS. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Einen besonderen Effekt für Handynutzer wurde auf Hausschuhexperte.de eingebaut. Berührt man mit dem Finger einen Vorteil, wird dieser auf die volle Breite gezogen.

Handy-Ansicht normal. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Handy-Ansicht mit Berührung von Punkt 4. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Vorteile mit Symbolen darstellen:

Das Design ist responsive und wird auf dem Handy 2-zeilig mit je 2 Symbolen dargestellt. Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

3. Aktuelle Bewertungen auf der Startseite anzeigen

Wenn Sie Bewertungen nutzen, zeigen Sie Ihren Besuchern gleich auf der Startseite Ihre neuesten Bewertungen. Das schafft Vertrauen und hilft, neue Kunden zu gewinnen.

Die neuesten Bewertungen auf der Startseite

Beispiele:

Baumwollseil.de | Hausschuhexperte.de | Haflingerversand.de | Gummistiefelprofi.de

4. Artikel-Kacheln auf der Startseite einbauen

Je nach dem, was für Sie wichtig ist, können diese Kacheln einer bestimmten AZ bzw. AZU zugeordnet werden. NEUHEITEN, SONDERANGEBOTE oder TOP-SELLER sind Klassiker, die gerne auf einer Startseite zu finden sind.

Bei den Seiten Grappa.de und GrappaMazzetti.de wurden die Artikel-Kacheln so implementiert, dass sie je nach Bildschirmgröße 7-6-5-4-3-2 Kacheln in 2 Reihen anzeigen. Auf dem Handy werden 3 Reihen mit jeweils 2 Kacheln angezeigt.

Auch ein Hover-Effekt für die Kacheln macht für Notebooks und PCs Sinn, damit Besucher wissen, dass sie beim Überfahren mit der Maus diesen Artikel selektiert haben.

Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

5. Main Banner für die volle Bildschirmbreite gestalten.

Main-Banner, die auf jedem Endegerät und in jeder Auflösung über die volle Bildschirmbreite angezeigt werden, sind Design-Elemente, die nahezu allen führenden Websites nutzen. Die Technik gibt dem obersten Banner wesentlich mehr Gewicht und ist meist so gestaltet, dass das Interesse der Besucher sofort geweckt wird.

Wenn dieses Banner professionell konzipiert wurde, weckt es nicht nur Emotionen, sondern steigert zugleich das Interesse, auf dieser Seite zu verweilen.

Sollte ein solches Banner einen Text oder ein Logo beinhalten, wird der Text bzw. die Grafik als Overlay darübergelegt. Mit dieser Technik erreicht man, dass Grafiken und Texte immer gestochen scharf sind und die Positionierung sowie die Größe an die entsprechende Bildschirmgröße angepasst werden kann. Außerdem können die Bilder stärker komprimiert werden, was zusammen mit einer Anzahl von Breakpoints zu deutlich schnelleren Ladezeiten führt.

Main-Banner über die volle Breite können auch als Slider gestaltet werden. Slider sollten aber nur in bestimmten Fällen verwendet werden, da sie schnell zur Unübersichtlichkeit und Unruhe führen können.

Meist macht es mehr Sinn, mit mehreren Banner, die über die Startseite verteilt sind, die Aufmerksamkeit der Besucher zu steuern.

Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Zur Live-Ansicht auf das Bild klicken (neues Fenster)!

Schauen Sie sich auch mal die Unterseiten von Grappa.de und GrappaMazzetti.de an, und lassen Sie sich inspirieren. Mit Powergap ist fast alles möglich und eine neue Startseite kostet nicht so viel, wie Sie vielleicht denken. Denn mit einem Budget von 500 € lässt sich schon einiges realisieren.

Responsive Mails

Über die responsive Gestaltung der Status Mail 1 & 2 mit Ihrem Logo und Artikelbildern habe ich bereits im Dezember 2020 einen ausführlichen Beitrag gepostet. Zwischenzeitig ist es auch möglich, das Status Mail 0, Passwort vergessen, Warenkorberinnerungs-Mail und Quick-Mails als responsive Mails zu gestalten. Bei Interesse einfach bei mir zu melden.

Powergap Shop Referenzen

Grappa.de | GrappaMazzetti.de | Shop.Underberg.com | Baumwollseil.de | OfficeUnlimited.de | Hausschuh.com | Haflingerversand.de | Hausschuhexperte.de | German-Slippers.com | Tierschilder.com | AS-Torantriebe.de | Schaumstoffnachmass.ch | Gummistiefelprofi.de | u.v.w.

Für weitere Informationen können Sie mich jederzeit über die E-Mail fs@powergap.de bzw. frasche@gmx.de sowie im Internet unter www.frasche.de erreichen. Gerne auch telefonisch mit einen kostenlosen Anruf über WhatsApp unter +66 8100 27805.
Frank Scheuber