Mehr Umsatz erzielen mit deinem Online-Shop: Optimiere dein Shop-Layout

Inhalt zuletzt aktua­li­siert: 9. August 2023

Damit du dei­ne Besu­cher mehr als weni­ge Sekun­den auf dei­nem Online-Shop hältst, muss vor allem der ers­te Ein­druck stim­men. Erfüllt die­ser nicht die Erwar­tun­gen der User, ver­las­sen sie dei­nen Shop, ohne auch nur ansatz­wei­se bis zum Waren­korb gekom­men zu sein.

Eine ver­ta­ne Chance.

So wie es bei Bewer­bungs­coa­chings heißt, für den ers­ten Ein­druck gibt es kei­ne zwei­te Chan­ce, lässt sich die­ser Satz auch auf einen Online-Shop übertragen.

Auch wenn du dei­nen Shop gra­fisch attrak­tiv gestal­tet hast, gibt es immer noch eini­ge Punk­te, die du beach­ten soll­test, damit sich die Shop­be­su­cher bei dir wohlfühlen.

Denn als Online-Shop­per hat man sich an einen gän­gi­gen Shop­auf­bau gewöhnt und will die­se Gewohn­heit nicht auf­ge­ben. Und natür­lich soll­te dein Shop pro­fes­sio­nell aus­se­hen. Wer hier noch auf ver­al­te­te Lay­outs, qua­li­ta­tiv schlech­te Bil­der und eine unlo­gisch auf­ge­bau­te Navi­ga­ti­on setzt, stellt sich selbst ein Bein.

In die­sem Arti­kel gehe ich auf wich­ti­ge Ele­men­te und Gestal­tungs­wei­sen für dei­nen Shop ein, die man auf ihm vor­fin­den sollte.

Generelle Shopanforderungen

Hoch­wer­ti­ges Logo: Was mir bei so man­chen klei­nen Online-Shops direkt ins Auge fällt, sind die schlech­ten Logos – wenn über­haupt wel­che ver­wen­det wer­den. Ent­we­der wird für den Shop­na­men nur nor­ma­ler Text ver­wen­det oder man ent­deckt ein unpro­fes­sio­nell gestal­te­tes Logo Mar­ke Eigenbau.

Dabei muss ein pro­fes­sio­nell design­tes Logo nicht sehr teu­er sein. So kannst du dir z. B. auf desi​gnen​las​sen​.de für gut 200 Euro und 40 Design­vor­schlä­ge ein Logo ent­wer­fen las­sen. Noch bil­li­ger dürf­te ein Logo auf fiverr zu haben sein.

Respon­si­ves Design: Die­se Anfor­de­rung wird mitt­ler­wei­le von fast allen Shop-Tem­pla­tes erfüllt, also dass der Shop auf allen End­ge­rä­ten, Desk­top-PC, Lap­top, Tablet und Smart­phone, opti­mal dar­ge­stellt wird und ein­fach zu bedie­nen ist.

Den­noch soll­test du tes­ten, ob dein Shop wirk­lich auf allen Bild­schirm­grö­ßen gut aus­sieht und der Bestell­vor­gang auch mit den Fin­gern ein­fach zu durch­zu­füh­ren ist.

Cross Brow­ser Com­pa­ti­bi­li­ty: Dein Shop soll­te nicht nur in Goog­le Chro­me oder in Fire­fox ein­wand­frei dar­ge­stellt wer­den, son­dern auch im Inter­net Edge und ande­ren Brow­sern. Gera­de Edge kann bei man­chen Dar­stel­lungs­wei­sen das Lay­out zerlegen.

Schnel­le Lade­zeit: 10 Sekun­den und län­ger dau­ert es, bis dein Shop auf mobi­len End­ge­rä­ten zu sehen ist? Viel zu lan­ge, da ver­schwin­den die meis­ten Besu­cher wie­der. Dei­ne Lade­zeit tes­ten kannst du mit Goog­le Page Speed oder GTMe­trix. In mei­nem Arti­kel „Kos­ten­lo­se Tools zum Tes­ten der Web­site-Geschwin­dig­keit“ fin­dest du wei­te­re Testtools.

Feh­ler­haf­te Ver­lin­kun­gen ver­mei­den: Feh­ler­haf­te Links schlei­chen sich schnell in einen Shop ein, gera­de wenn man auf der Start­sei­te regel­mä­ßig neue Aktio­nen oder Preis­nach­läs­se etc. ein­stellt. Am bes­ten tes­test du dei­ne Lin­kan­pas­sun­gen gleich nach der Anpas­sung, ob sie auch funktionieren.

Auch feh­ler­haf­te Links bei Pro­dukt­sei­ten sind nicht sel­ten. Sol­che Links las­sen sich mit der Goog­le Search Con­so­le ermit­teln und beseitigen.

Die Shop-Startseite: So solltest du sie aufbauen

Hea­der­be­reich eines Shop: Hier soll­ten schon wich­ti­ge Infor­ma­tio­nen ste­hen (sie­he wei­ter unten im Text)

Auf der Start­sei­te sind fol­gen­de Ele­men­te und Plat­zie­run­gen enorm wich­tig, um die Besu­cher von dei­nem Shop zu überzeugen.

Über­sicht­li­che Navi­ga­ti­on: In der Navi­ga­ti­on oder dem Menü soll­ten die wich­tigs­ten Haupt-Pro­dukt­ka­te­go­rien ver­linkt sein, ein Sale- und Mar­ken- bzw. The­men­link gehö­ren eben­falls in eine über­sicht­li­che Navi­ga­ti­on. Unter den Pro­dukt­haupt­ka­te­go­rien soll­ten dann als Unter­me­nü die Pro­dukt­un­ter­ka­te­go­rien zu fin­den sein.

Bei­spiel: Haupt­ka­te­go­rie: Küche, Unter­ka­te­go­rien: Töp­fe, Pfan­nen, Brä­ter, Koch­zu­be­hör, Back­for­men, Back­ble­che etc.

Bei einem gro­ßen Pro­dukt­sor­ti­ment lohnt sich oft eine Unter­tei­lung in Haupt­ka­te­go­rie, 1. Unter­ka­te­go­rie, 2. Unterkategorie

Bei­spiel: Haupt­ka­te­go­rie: Küche, 1. Unter­ka­te­go­rie: Kochen, 2. Unter­ka­te­go­rien: Töp­fe, Pfan­nen, Brä­ter etc.

Bread­crumbs ver­wen­den: Eine Bread­crumb-Navi­ga­ti­on ist eine sekun­dä­re Navi­ga­ti­on inner­halb einer Web­site. Über die­sen Link­pfad gelan­gen User wie­der zurück zur Start­sei­te oder zu einer höhe­ren Sei­ten­ebe­ne. Die­ses Fea­ture gehört zu einem guten Shop dazu.

Kun­den­vor­tei­le her­vor­he­ben: Du ver­schickst dei­ne Pro­duk­te ver­sand­kos­ten­frei? Inner­halb eines Tages? Kauf auf Rech­nung ist mög­lich? Kun­den kön­nen Retou­ren kos­ten­frei zurücksenden?

Das sind alles Schlüs­sel­ei­gen­schaf­ten, auf die die Kun­den ste­hen. Daher soll­test du sie direkt sicht­bar ganz oben im Shop plat­zie­ren, bei­spiels­wei­se ober­halb des Log­o­be­reichs in einer Top­leis­te, neben­ein­an­der auf­ge­führt. So fal­len sie dem User gleich ins Auge.

Such­feld: Kun­den suchen oft nach bestimm­ten Pro­duk­ten im Shop. Daher soll­te ein gro­ßes Such­feld im Hea­der­be­reich des Shops groß und auf­fal­lend vor­zu­fin­den sein.

Bewer­bung von Aktio­nen und Rabat­ten: Gibt es im Shop attrak­ti­ve Preis­nach­läs­se, Aktio­nen oder sons­ti­ge Spe­cials, soll­test du die­se mit einer Gra­fik und ent­spre­chen­der Beschrif­tung auf der Start­sei­te bewer­ben. Die Gra­fik soll­te zur Ziel­sei­te, auf der die Rabat­te zu fin­den sind, ver­linkt sein.

Belieb­te Pro­duk­te und Mar­ken im Shop ver­lin­ken: Das glei­che gilt für Ver­kaufs­schla­ger. Die soll­test du eben­falls gra­fisch mit Ver­lin­kung zur Ziel­sei­te auf der Start­sei­te platzieren.

Hand­lungs­auf­for­de­run­gen for­mu­lie­ren: Die Bil­der zu den ein­zel­nen Pro­dukt­sei­ten soll­ten klar for­mu­liert sein, wie z. B. „Ent­de­cke alle High­lights hier.“ „Fin­den Sie Ihr Lieb­lings­pro­dukt.“ „Zu unse­ren Küchen­pro­duk­ten“, etc.

News und Gut­schei­ne: Gibt es in dei­nem Shop einen News­be­reich mit wich­ti­gen Pro­dukt­in­for­ma­tio­nen? Bie­test du Gut­schei­ne an? So soll­test du für die Neu­ig­kei­ten und Gut­schei­ne einen Bereich auf der Start­sei­te reservieren.

News­let­ter pro­mi­nent plat­zie­ren: Falls du einen News­let­ter in dei­nem Shop ein­setzt, soll­te das For­mu­lar groß und auf­fal­lend ein­ge­bun­den wer­den, natür­lich immer mit einem Gut­schein, sodass die Kun­den einen Grund fin­den, sich dar­in einzutragen.

Waren­korb-Icon: Das Waren­korb-Icon zeigt an, ob etwas im Waren­korb liegt oder nicht. Außer­dem kommt man mit einem Klick dar­auf in den Waren­korb. Das Zei­chen gehört in die obe­re rech­te Ecke.

Über das Waren­korb-Icon und einem Drop­down-Feld soll­te der Kun­de die Mög­lich­keit haben, die Waren­korbsei­te zu über­sprin­gen und direkt zur Kas­sen­sei­te zu gelan­gen, um die Bestel­lung abschlie­ßen zu können.

Sicher­heits­zer­ti­fi­ka­te und ‑sie­gel: Die­se Ele­men­te kannst du — wenn es der Platz dei­nes Shoptem­pla­tes her­gibt — in den Kopf­be­reich ein­fü­gen. Sie pas­sen genau­so in den Foo­ter, dort soll­ten sie auf alle Fäl­le hin.

Foo­ter­ge­stal­tung: Im Foo­ter soll­ten Ver­lin­kun­gen zu den Rechts­tex­ten wie Wider­ruf, Daten­schutz­er­klä­rung, Impres­sum und AGB auf­ge­führt sein, dar­über hin­aus Links zu Ser­vice­sei­ten wie News­let­ter, Umtausch, Gut­schei­ne, Bera­tung, FAQ, Kon­takt, Bestell­ser­vice, Hot­line-Ruf­num­mer, Sicher­heits­zer­ti­fi­ka­te und ‑sie­gel als Gra­fik, Bewer­tungs­wid­gets, even­tu­ell Aus­zeich­nun­gen (falls sie exis­tie­ren), Hin­weis zum/​zu den Versandpartner/​n und Auf­lis­tung der ein­zel­nen Zah­lungs­ar­ten, gra­fisch dargestellt.

Was ich nicht so wichtig finde

Gro­ße Slider: Auf vie­len Shops sieht man auf der Start­sei­te gro­ße Foto­s­li­der, auf denen Pro­duk­te und Aktio­nen beschrie­ben wer­de. Da die­se Bil­der sich stän­dig abwech­seln, sehen die Shop­be­su­cher immer etwas anderes.

Die­se Slider machen gra­fisch recht viel her, daher sieht man sie wohl auch so oft. Doch es hat sich gezeigt, dass sie nicht all­zu oft genutzt bzw. ange­klickt wer­den. Das gilt auch für nor­ma­le Web­sites. Bes­ser ist es, die Bil­der fest in die Sei­te ein­zu­bin­den, sodass die Pro­duk­te bzw. Aktio­nen für jeden User gleich zu sehen sind.

Wish­list: Die Merk- bzw. Wün­sch­lis­te hat sich auch auf vie­len Shops breit gemacht. Um die­se nut­zen zu kön­nen, braucht der Besu­cher einen Kun­den­ac­count im Shop. Dann kann er auf der Lis­te Pro­duk­te ein­tra­gen, die ihn inter­es­sie­ren und die er viel­leicht kau­fen will.

Ob die­ses Fea­ture zu mehr Ver­käu­fen führt, kann ich nicht beur­tei­len. Infor­ma­tio­nen dazu habe ich nicht gefun­den. Ich selbst nut­ze die Wish­list als Online-Shop­pe­rin nie.

Kun­den­ac­count: Ist er wich­tig oder nicht? So gut wie alle E‑Com­mer­ce-Soft­ware bie­tet Kun­den­ac­counts an, daher wird die­se Funk­ti­on auch fast über­all ange­bo­ten. Wer ein­setzt, soll­te in der rech­ten obe­ren Ecke auch noch ein ent­spre­chen­des Icon ein­fü­gen, dort wo sich auch das Waren­korb-Icon befindet.

Doch zumin­dest soll­te der Kun­de als Gast im Shop bestel­len kön­nen. Denn es gibt immer noch User, die ihre Bestell­da­ten in einem Account abspei­chern wol­len. Die­sen soll­te man ent­ge­gen­kom­men. Ich habe schon meh­re­re Shops ange­trof­fen, die die­se Opti­on als Gast ein­zu­kau­fen nicht anbieten.

Tipp: Der ECC Köln ver­gibt seit 2012 jedes Jahr den Online-Han­del-Award. Es wer­den in zehn ver­schie­de­nen Kate­go­rien die bes­ten Online-Anbie­ter Deutsch­lands ausgezeichnet.

In die Aus­wer­tung flie­ßen ver­schie­de­ne Fak­to­ren ein, u. a. auch die visu­el­le Shop­ge­stal­tung. Hier fin­dest du die Sie­ger von 2019 (und in der Sei­ten­spal­te die Sie­ger der Jah­re davor). Die aus­ge­zeich­ne­ten Online-Shops kön­nen dir mit Sicher­heit so man­chen Input lie­fern, wie du dei­nen Shop opti­mal gestal­ten kannst.

(Bild­quel­le Arti­kel­an­fang: © vladwel/Depositphotos.com)