Das perfekte Suchfeld-Design für Ihren E-Commerce

Veröffentlicht: 2022-05-06

Haben Sie jemals einen Online-Shop oder Marktplatz mit der Absicht durchsucht, nach einem Produkt zu suchen, und das Suchfeld nicht finden können? Wir sind sicher, dass Sie haben.

Es versteht sich von selbst, dass die Wahrscheinlichkeit, dass Ihre Site Search verwendet wird, umso größer ist, je mehr Sie der Site Search auf Ihrer Homepage einen Stellenwert einräumen. Das bedeutet, dass Ihre Besucher, anstatt verschiedene Kategorien auf Ihrer E-Commerce-Website zu durchsuchen, direkt die Site-Suche verwenden, um das gewünschte Produkt schneller zu finden, ohne Zeit damit verschwenden zu müssen, Dinge zu suchen, die sie nicht benötigen.

In Branchen, in denen die Suche der häufigste Weg ist, Produkte zu finden, kann es daher sinnvoll sein, das Suchfeld durch ein aufmerksamkeitsstarkes Design zu „bewerben“ und an strategischer Stelle, insbesondere auf der Startseite, zu platzieren.

Inhaltsverzeichnis

  • Kategorie-Navigation
  • Gestaltungselemente des Suchfeldes
    • Position
    • Ihre Site Search-Stile
    • Größe
  • Suchfelddesign auf der Homepage

Kategorie-Navigation

Dies ist in der Regel bei gezielteren Preisvergleichs-Websites der Fall, solange der Benutzer den genauen Markennamen und das Modell des Produkts kennt, das er kaufen möchte (mit anderen Worten, er weiß genau, was er will, noch bevor er Ihre Website besucht E-Commerce-Website).

Andererseits kann in Branchen, in denen Nutzer lieber nach Kategorien stöbern (weil sie das gewünschte Produkt, dessen Namen oder Schreibweise nicht genau kennen) oder bei einer flachen Website-Hierarchie eine unauffälligere Gestaltung des Suchfeldes möglich sein verwendet werden, um das Browsen nach Kategorie statt durch Suchen zu fördern.

Zum Beispiel: Vor allem die Mode- und Wohnkulturbranchen bevorzugen stark das Browsen nach Kategorien, sowohl in Bezug auf die anfängliche Präferenz der Benutzer als auch auf ihre spätere Erfolgsrate (Konversionsrate nach der Suche).

Bei der Gestaltung und Umsetzung gibt es vielfältige Möglichkeiten, das Suchfeld im Gesamtdesign hervorzuheben. Das genaue zu verwendende Format variiert also von einer Website zur anderen, was weitgehend vom Kontext abhängt, in dem das Suchfeld angezeigt wird (mit anderen Worten, dem gesamten Website-Design).

Gestaltungselemente des Suchfeldes

Es gibt mehrere Gestaltungselemente des Suchfelds, die verwendet werden können, um es hervorzuheben, je nachdem, inwieweit Sie die Benutzer zur Verwendung der Suchfunktion animieren möchten. Die drei Hauptelemente des Suchfelddesigns, die tendenziell den größten Einfluss haben, sind:

Position

Schauen Sie sich Amazon im Bild unten an. Wie Sie sehen können, ist es im Interesse von Amazon, dass Sie seinen Marktplatz durchsuchen, da er mehr verkauft und Sie besser führen kann, wenn Sie seine Site-Suche verwenden, anstatt nach Kategorien zu suchen.

Aufgrund der Millionen von Produkten und der Tatsache, dass die Benutzer normalerweise bereits wissen, welche Art von Produkt sie wollen, sobald sie die Website besuchen, platzieren sie die Site Search an einer bevorzugten Stelle, direkt im Zentrum und nehmen praktisch die gesamte Website ein Breite des Bildschirms.

Wenn Sie die Site Search hervorheben und Benutzer dazu ermutigen möchten, sie zu verwenden, muss sie außerdem ordnungsgemäß funktionieren. Mit anderen Worten:

  • Ergebnisse sofort anzeigen: Sie können keine Site-Suche haben, die zu lange braucht, um die Produkte zu laden, nachdem sie gesucht wurden.
  • Listen Sie die Ergebnisse in beliebiger Reihenfolge auf: Denken Sie daran, dass die Ergebnisse für Ihre Besucher umso relevanter sind, je weiter oben und links.
  • Anständige Bildqualität : Bitte keine verpixelten Bilder!
  • Zeigen Sie Ihre Produktspezifikationen an: Größen, Rabatte oder Werbeaktionen, verfügbare Farben… Alles in Ihrer eigenen Suche.
  • Bieten Sie Benutzern die Möglichkeit, innerhalb der Site Search selbst in den Warenkorb zu legen : damit sie mehrere Produkte kaufen können, ohne zwischen der Site Search und dem Warenkorb hin und her wechseln zu müssen.

Ihre Site Search-Stile

Es ist von größter Bedeutung, dass das Image Ihrer Website respektiert wird, sobald auf das Suchfeld geklickt wird. Dabei müssen eine ganze Reihe von Elementen berücksichtigt werden.

  • Farben : Sie sollten die gleichen Unternehmensfarben wie auf Ihrer Website verwenden. Versuchen Sie auch, das Logo irgendwo in der Site Search hinzuzufügen.
  • Schriftarten : Die Schriftart ist ein weiteres wichtiges Element; Verwenden Sie dieselben Schriftarten, die Sie auf Ihrer Website verwenden, für Zahlen, Titel, Schaltflächen …
  • Schaltflächen : Versuchen Sie, die gleichen Stile wie die Schaltflächen auf Ihrer Website in den Schaltflächen „Kaufen“ oder „In den Warenkorb“ zu haben.
  • Andere Elemente: Wie Rabatte, Grenzen , die Verwendung der gleichen Kategorien, die Sie auf Ihrer E-Commerce-Website haben …

Größe

Indem das Suchfeld relativ klein gemacht wird, wird seine visuelle Hervorhebung deutlich reduziert. Eine Sache, die viele Online-Shops, die die Nutzung der Site Search steigern möchten, tun, ist, den Kontrast zwischen der Kopfzeile und der Site Search zu erhöhen. Zum Beispiel hat Amazon , wie wir oben gesehen haben, seine Kopfzeile in Schwarz, aber die Site Search ist zentriert und in Weiß.

Wenn Sie Größe, Position und Kontrast kombinieren, heben Sie das Suchfeld wirklich hervor und fördern die Suche als bevorzugte Methode, um auf Ihrer E-Commerce-Website nach Produkten zu suchen. Dies erfordert jedoch eine intelligente Site-Suche wie Doofinder, um Ihre Absprungrate zu reduzieren. Wenn nicht, kann dies zu einem zweischneidigen Schwert werden.

Suchfelddesign auf der Homepage

Gerade auf der Homepage ist die Gestaltung des Suchfelds noch wichtiger, da die meisten Nutzer ihre Produktsuchstrategie bereits beim Besuch der Website festlegen.

Laut Daten des Baymard Institute nutzen 60 % der Nutzer die Suche sofort als erste Strategie auf der Startseite einer mobilen Website. Je auffälliger also das Suchfeld auf der Startseite gestaltet ist, desto mehr Nutzer nehmen es als Anreiz , zu suchen statt nach Kategorien zu stöbern.

Darüber hinaus ist es eine gute Idee, der Site Search auf der Startseite einen zusätzlichen visuellen Touch zu verleihen, sofern Sie das Stöbern in der Site Search gegenüber dem Stöbern nach Kategorien fördern möchten.

Ein differenziertes Site Search-Design für die Startseite kann auf viele Arten erfolgen: von kräftigeren Suchfeldumrandungen, einer kontrastreicheren Hintergrundfarbe, einem größeren Feld und einer größeren Schriftgröße, einem lebhafteren „Suchen“-Button … Und vielleicht sogar die Feldtastatur fokussierbar machen standardmäßig. Jede Designänderung, die das Suchfeld von sich aus hervorhebt, ohne seine Position oder seinen visuellen Stil grundlegend zu ändern, trägt dazu bei, dass es sich von der Masse abhebt.

Auf diese Weise bleibt das Suchfeld vollständig erkennbar, ohne den Fokus von den anderen Seiten abzulenken, bietet Ihnen aber einen zusätzlichen visuellen Kontrast auf der Startseite.

Dieser zusätzliche visuelle Kontrast soll nicht so weit gehen, die Suche als „ einzige Option “ auf der Website zu propagieren, sondern den Nutzern helfen, das Suchfeld beim Besuch der Website besser zu erkennen.

Wie Sie wissen… Die Startseite enthält oft viele verschiedene Grafiken und visuelle Elemente, die um die Aufmerksamkeit des Benutzers konkurrieren, was bedeutet, dass das, was auf nachfolgenden Seiten (wie Kategorieseiten, Produktlisten oder Produktseiten) ein dominierendes Suchfeld sein kann, vielleicht nicht genug für die Homepage.