Weitere Blogposts in der Kategorie Shopify

Shopify Plus Vorteile 6 November 2018
Shopify Checkliste 23 Oktober 2017

Das 1-Mal-1 des guten Shop-Designs

Das 1-Mal-1 des guten Shop-Designs

„Es kommt nicht auf das Aussehen an, die inneren Werte sind das, was zählt“. Dieser oft genutzten Phrase müssen wir ganz vehement widersprechen, zumindest wenn wir an den E-Commerce und gut designte Onlinehops denken. Natürlich zählen auch hier die inneren Werte, allen voran eine gute Ladegeschwindigkeit und SEO-Texte. Ein ansprechendes Design und eine clevere Benutzerführung sind aber nun einmal das, was potenzielle Käufer im ersten Schritt von einem Shop überzeugt.
Der erste Eindruck zählt!

Damit Sie potenziellen Kunden mit Ihrem Onlineshop von Anfang an schöne Augen machen und somit Ihr Angebot perfekt inszenieren können, sollten Sie einige Aspekte beachten. Wie Sie Ihren Shopify-Shop zu einer designtechnischen Meisterleistung machen, lernen Sie in diesem Beitrag!

Schritt 1 – Auswahl des Shopify-Themes

Das 1-Mal-1 des guten Shop-Designs | Latori

Die Basis für einen Shopify-Shop ist ein Shopify Theme, also eine Designvorlage, die es im Theme Store kostenfrei oder für maximal 180 USD zu erwerben gibt. Shopify bietet Dutzende dieser Vorlagen an, die sich in Stilvariationen und Anpassungsmöglichkeiten unterscheiden.

Die Entscheidung für das richtige Theme und somit für den Grundbaustein des Designs ist eine der schwierigsten. Um diese treffen zu können, sollten Sie sich deswegen zuvor einige Fragen stellen, um herauszufinden, was Ihnen wichtig ist:

  • Welche Produkte bieten Sie an und wie sollen diese dargestellt werden? Bedarf es für diese Produkte viel Visualisierung durch Videos und große Bilder?
  • Wer ist Ihre Zielgruppe? Verkaufen Sie B2B oder B2C?
  • Welche Art von Erfahrung möchten Sie für Ihre Kunden schaffen? - Das Layout, die Bildgrößen, die Platzierung von Text usw. tragen alle zur Atmosphäre bei, die letztlich das gesamte Benutzererlebnis prägt.
  • Welche Funktionen wünschen Sie sich für Ihren Shop? Brauchen Sie einen breiten Instagram-Feed?
  • Wie treten Ihre Konkurrenten auf? Werfen Sie ein Auge auf deren Onlineshops, um Dinge besser umzusetzen, als sie es tun.
  • Wie hoch ist das Budget für das Design der Website? - Zusätzliche Plugins und Apps können auch mehr Geld kosten, daher sollten Sie Ihr Gesamtbudget planen, bevor Sie sich auf ein teures Theme festlegen.

Schritt 2 – den Aufbau der Seite planen

Der Aufbau und die Struktur Ihres Onlineshops sind essenziell, denn was nützt Ihnen eine hübsche, aber dysfunktionale Seite, die nur wenige Kunden nutzen möchten (oder können) und Ihre Conversion Rate in die Tiefe zieht?

Machen Sie sich deswegen Gedanken, über eine schlüssige Navigation. Hierbei handelt es sich um einen Oberbegriff für alle Elemente, mit denen Benutzer bestimmte Informationen auf Ihrer Website erreichen können. Dazu gehört das Kopfzeilen-Navigationsmenü, Produkt- und Kategorieseiten, Filter und die Fußzeile. Überlegen Sie, welche Elemente und Seiten in das Hauptmenü müssen und welche Seiten und Links ein wenig versteckter in den Footer können.

Shop-Design Header | Latori
Die Hauptnavigation des Shopify-Plus-Kunden Babbel für Unternehmen

Halten Sie sich eines vor Augen: Sie müssen das Rad nicht neu erfinden. Lassen Sie uns noch ein wenig drastischer werden: Sie dürfen das Rad nicht neu erfinden! Die meisten Nutzer, die online einkaufen, sind gewisse Platzierungen gewöhnt. So würde beispielsweise niemand auf die Idee kommen, die Hauptkategorien im Footer zu suchen. Genauso wenig erwarten Ihre Besucher die AGB im Hauptmenü. Schauen Sie sich also an, wie andere erfolgreiche Shops ihre Navigation und Unterteilung in Haupt- und Unterkategorien aufteilen und lernen Sie daraus!

Shop-Design Footer | Latori
Die Footer-Navigation von Shape Republic

Folgende Seiten spielen für Ihren Onlineshop eine wichtige Rolle:

  • Startseite, als erster Berührungspunkt zwischen Ihren Produkten und dem Besucher verfügt diese über große Hero-Images (oder Videos), das Hauptprodukt oder aktuelle Angebote, empfohlene Produkte oder spezielle Kategorien sowie ansprechende Angebote zur Kundenbindung (z.B. Newsletter, Instagram-Feed).
  • Kategorieseiten, als thematische Organisation Ihrer einzelnen Produkte und zum schnellen Entdecken für den Kunden sollten diese beschreibende Texte und eine SEO-freundliche URL aufweisen und im besten Fall Filter zur Sortierung der Produkte enthalten.
  • Produktseiten, sind für den Verkauf Ihrer Produkte ausschlaggebend. Achten Sie daher auf gute Produktfotos in mehreren Perspektiven, alle Merkmale und Spezifikationen, mögliche Schaltflächen für das Abspeichern auf Merklisten und verwandte Produkte (Up-Sell und Cross-Sell).
  • Checkout-Seite, hier steigen die meisten Besucher aus und verlassen Ihren Shop, ohne zu kaufen. Meist liegt das an plötzlich auftretenden Kosten und Komplikationen. Ermöglichen Sie daher den Kauf als Gast, reduzieren Sie die Zahl der erforderlichen Felder auf ein Minimum, zeigen Sie alle akzeptierten Zahlungsmittel an und informieren Sie durch ein Banner, ab welchem Wert ein kostenloser Versand möglich ist.
  • Über-Uns-Seite, eine der wichtigsten Seiten, um Vertrauen aufzubauen und den Kunden auf einer emotionalen Ebene abzuholen. Hier sollten Sie eine Geschichte über Ihr Produkt, Ihr Team, Ihre Entstehung, Ihre Werte und Visionen sowie Ihre Partner und Initiativen erzählen. Es geht hier nicht um Verkaufsplattitüden, sondern um einen Blick ins Herz Ihrer Marke!
  • Kontaktseite, geben Sie Kunden die Möglichkeit, Sie zu kontaktieren! Allein der Fakt, dass es eine solche Seite gibt, schafft Vertrauen.

Natürlich können Sie noch weitere Seiten in Ihren Shop integrieren, wie eine Lookbook- oder FAQ-Seite. Hierbei handelt es sich jedoch in erster Linie um die Seiten, die Sie auf keinen Fallvernachlässigen dürfen.

Schritt 3 – Bild- und Farbwelt

Shop-Design Bilder und Farben | Latori
Das CI von Shape Republic ist deutlich erkennbar und zieht sich über alle Seiten und Kanäle durch

Ganz nach dem Motto „Show, don’t tell“ sollten Sie Ihren Shop designen. Natürlich müssen auch Ihre Texte überzeugen, wobei Ihre Shop-Besucher hängenbleiben, ist jedoch in aller erster Linie Ihr Design. Ohne viele Umschweife hier eine Checklist für Bilder, Farben und Schriften Ihres Onlineshops:

  • Nutzen Sie scharfe, hochaufgelöste aber komprimierte Bilder.
  • Erstellen Sie Produktbilder aus mehreren Perspektiven – sowohl atmosphärische als auch freigestellte.
  • Nutzen Sie einheitliche Bildgrößen und Formate.
  • Aktivieren Sie ein 360-Grad-Foto-Tool auf Produktseiten, damit Käufer die gesamte Ansicht eines Produkts sehen können.
  • Aktivieren Sie eine Zoom-Funktion auf Produktfotos, damit Käufer Ihre Artikel detaillierter betrachten können.
  • Nutzen Sie wenn möglich Videos zu Ihren Produkten oder Unternehmen.
  • Orientieren Sie sich an Ihrem Logo – sowohl bei den zu nutzenden Farben als auch bei den Schriftarten -> hier verwendete Schriftarten und -stärken sollten im Shop-Design aufgegriffen werden
  • Halten Sie sich an das vorhandene Corporate Design oder an bestehende Design-Vorlagen, um ein einheitliches und stimmiges Bild auf allen Kanälen zu erzeugen.
  • Verwenden Sie im besten Fall nur zwei verschiedene Fonts und nicht mehr als drei unterschiedliche Farben.
  • Nutzen Sie farblich abgesetzte Call-to-Action-Buttons, um Kunden zu navigieren.
  • Haben Sie keine Angst vor Weißraum! Platzieren Sie Elemente ruhig mit Abständen. Es gilt: schaffen Sie räumliche Nähe, für das, was zusammengehört und Abstand für Dinge, die neue Inhalte abdecken.

Wenn Sie sich vor Beginn Ihrer Umsetzung ein Wireframe aufmalen, um so zu entscheiden, welches Element wo platziert wird, ersparen Sie sich das Gefühl der Überforderung, wenn Sie erst einmal loslegen. Allerdings ist Shopify ein sehr flexibles Shopsystem, das schnelle Änderungen in den meisten Fällen ohne großen Kraftaufwand möglich macht.

Shop-Design Produktseiten | Latori
Cora Verlag zeigt dem Nutzer viele Informationen - übersichtlich und einfach zu finden

Schritt 4 - Nutzerfreundlichkeit

Eine gute Navigation und Struktur der Seite ist die halbe Miete in Sachen Nutzerfreundlichkeit. Es gibt allerdings einige andere Aspekte, die Sie beachten sollten. Sorgen Sie in jedem Fall dafür, dass Ihr Onlineshop responsiv ist. Die meisten Nutzer greifen heutzutage über das Smartphone auf Webseiten zu. Elemente, Bilder und Schriften dürfen also nicht abgeschnitten werden, sondern müssen sich automatisch dem mobilen Endgerät anpassen.

Sorgen Sie für eine schnelle Ladezeit der Seite, damit potenzielle Käufer nicht frustriert sind und abspringen. Dazu beitragen können Sie, indem Sie:

  • Bilder komprimieren - kostenlose Online-Tools wie tinyPNG können die Dateigröße um etwa 50 % reduzieren, ohne die Bildqualität merklich zu beeinträchtigen
  • nicht benötigte Apps und Code entfernen
  • Karussells mit vielen großen Bildern vermeiden

Um die Nutzerfreundlichkeit zu steigern, sollten Sie zudem eine Suchleiste in Ihrem Shop integrieren. Diese sollte leicht zu finden sein, im besten Fall über eine automatische Vervollständigung verfügen und auch bei falsch geschriebenen Wörtern Ergebnisse liefern.

Shop-Design Produktseiten | Latori
Die Suchfunktion von Harper Collins bietet automatisch Produkte und Suchvorschläge an

Schritt 5 - Vertrauensbildende Elemente integrieren

Was nützt es Ihnen, wenn Ihr Shop einwandfrei aussieht, Nutzer Ihnen aber zu wenig vertrauen, um wirklich Käufe zu tätigen? Eine Kontakt- und Über-Uns-Seite kann Ihnen hierbei, wie bereits geschildert, einiges an Mühe abnehmen. Es gibt aber noch weitere Elemente, die Ihnen das Vertrauen der Onlineshopper sichert. Denken Sie daher über folgende Punkte nach:

  • Kundenbewertungen auf Ihren Produktseiten
  • Siegel von Trusted Shops, dem Händlerbund und Co. stets sichtbar in Ihrem Footer
  • Eine Live-Chat-Funktion, die 24/7 funktioniert und Ihren Kunden bei allen Fragen und Problemen hilft
  • Kundensupport per Mail oder Telefon
  • Die geläufigsten Zahlungsanbieter sowie eine Auswahl an beliebten Versanddienstleistern

Fazit

Ein Schlüsselfaktor für die Erstellung einer effektiven E-Commerce-Site liegt in der Art und Weise, wie Ihre Produkte und Dienstleistungen den Besuchern präsentiert werden. Das Website-Design ist unglaublich wichtig, wenn es darum geht, Markenbotschaften zu visualisieren und zu kommunizieren. Es kann dabei helfen, die Erwartungen der Nutzer an Ihr Unternehmen zu erfüllen und die Geschichte hinter Ihrer Marke zu vermitteln.

Schlussendlich kommt es nicht nur auf Farben und Schriftarten an, sondern auf das Zusammenspiel mehrerer Faktoren. Haben Sie Ihren Shop fertiggestellt, sollten Sie Freunde und Kollegen probeshoppen lassen, um herauszufinden, ob diese sich durch den Shop navigieren, wie von Ihnen erdacht und es irgendwelche Hindernisse gibt, die sie stört oder nicht verstehen.

Wenn Sie den Aufbau und das Design Ihres Shops doch lieber in erfahrene Hände geben möchten, stehen wir Ihnen als Shopify-Agentur mit langjähriger Expertise gern zur Seite. Wir erstellen auch Design ganz nach Ihren Wünschen. Kontaktieren Sie uns!

Shopify 38 Shopify Plus 32
Teilen: