Vergessen Sie generische Tipps zur Website-Optimierung. Hören Sie auf Ihre Kunden und nehmen Sie entsprechende Verbesserungen vor. Lesen Sie, wie ich es gemacht habe.
Inhalt
Teil 1
Der zweite Teil ist eine Fortsetzung dieses Artikels: Konversion-Rate steigern. Keine Klischee Webseitenoptimierung – TEIL 1 – https://mcompel.de/cro/keine-klischee-optimierung1/
Produktverbesserungen basierend auf Kundenfeedback
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_keine-klischee-optimierung2_hohenverstellung-bilder.png)
Wenn sich irgendein Produkt gut verkaufte, war es die Priorität, Bilder und Videos mit diesem Produkt zu bekommen, und sie in die Produktbeschreibung hinzuzufügen. Dies war die sehr grundlegende Optimierung, die zuerst durchgeführt wurde.
Zwei Tage nach dem Start sahen wir in Hotjar, dass Benutzer Erweiterungen ansehen. Um den Auswahlprozess zu verkürzen, wurden Aktivitäten-Lernturme mit ausgewählten Erweiterungen hinzugefügt. Es hat nicht funktioniert, aber es war besser als nichts zu tun.
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_anti-kletterer.png)
Wir haben teurere vertikale Türme hervorgehoben (und dann stieg das Verkaufsvolumen):
- „Anti-Kletter“ Badge
- Durch Fotografieren des Kinderfußes am vertikalen Geländer (am Anfang eingefügt)
- Mit Text, der den Unterschied des Modells erklärt
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_keine-klischee-optimierung2_farbinspirationen-vorher.png)
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_keine-klischee-optimierung2_farbinspirationen-nachher.png)
Der Produkt „Farbauswahl für Stufe Und Schutzstangen“ und der Blogbeitrag „Farbinspirationen“ zeigten inspirierende Turm Farbkombinationen, die der Grafiker am Anfang erstellt hat. Als die Käufe zunahmen, stellten wir fest, dass Kunden verschiedene Farben haben möchten. Der Grafiker hat neue Farbkombinationen erstellt, die Kunden meistens kaufen, und wir haben sie anstelle der ursprünglichen gestellt. Infolgedessen sehen die Leute die Türme, die ihnen gefallen, und die Kaufwahrscheinlichkeit steigt.
Minze und Türkis sind beliebte Farben und Mütter fragten oft nach ihnen. Die Werkstatt kaufte sie in kleinen Mengen und wir erweiterten das Farbangebot. Jetzt sind sie ein Bestandteil des Angebots.
Wir haben uns ein neues Produkt ausgedacht: Expresszustellung-Türme, die schnell geliefert werden. Wir präsentierten sie zunächst als Reihenfolge-Überspringung, damit die Kunden das Gefühl der Einzigartigkeit nicht verlieren. Aber dies funktionierte nicht, die Leute glaubten es nicht. Daher wurden die Texte in vorgefertigte Türme geändert.
Als wir lernten, Expresstürme zu verkaufen, fragten die Kunden nach mehr Farben. Die Werkstatt erweiterte das Angebot an vorgefertigten Lerntürmen und ich fügte neue Varianten hinzu.
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung_extralak.png)
Aufgrund der Nachfrage haben wir neue Erweiterung angeboten: Extra Klarlack. Damit die Leute verstehen, dass sich die Oberfläche ändert und der Turm länger hält, haben wir in dem Produktbild einen Turm mit einer unrealistisch karierten Oberfläche und eine Schild-Ikone hinzugefügt. Aber Leute wüssten nicht, ob und welchen optischen Unterschied der Extralack macht. Die Werkstatt hatte die Aufgabe, den Vergleich der beiden Türme – ohne und mit Extralack – zu fotografieren. Wir haben diese Fotos der Bildunterschrift hinzugefügt und dann die Fragen geklärt.
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_namensmalerei-verbesserung.png)
Die Namensmalerei wurde erheblich verbessert. Am Anfang funktionierte das Produkt so, dass der Kunde eine Farbe auswählte und Support kontaktierte ihn, um den Namen herauszufinden. Es kostete viel Zeit und die Farbkombination könnte hässlich sein. Lösung: die Developer haben ein Textfeld programmiert, in das der Name eingegeben werden kann. Wir haben die Farbauswahl entfernt, und die Farbe wird von der Werkstatt entsprechend der Turm-Farbe zugewiesen.
Der Gewinn, und die Konversionrate haben sich seit den Verbesserungen deutlich verbessert.
Produkt Tabs
Versand
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_tab-versand.png)
Produkt Tabs wurden ebenfalls optimiert. Am Anfang gab es zwei Tabs: Details und Versand mit wichtigsten Informationen. Die Kunden wollten aber mehr Informationen. Diese Informationen wurden in das Tab aufgenommen. Dadurch entstand ein kleiner Artikel und die Fragen waren beantwortet.
Mehr
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_tab-mehr-desktop.png)
Später kam ein dritter Tag hinzu – „Mehr“. Der Tab enthält Blogbeitrage, die die Kundenprobleme lösen und Kaufeinwände beseitigen. Es war ein Tipp von einem SEO-Spezialisten, daher ist es auch gut, um Produkte mit Ihrem Blog zu verlinken und den Wert von Blogbeitragen bei Google zu steigern.
Wir haben uns gut überlegt, welche Blogbeiträge wir in Mehr zeigen werden. Je mehr Beiträge, desto geringer ist die Klickrate und weniger von dem Wichtigen wird gesagt.
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_tab-mehr.png)
Unsere Datenspezialistin hat Klick-Tracking eingerichtet. Die Zahlen zeigten, dass der Tab nicht viel geklickt worden war. Der Titel war mit einer schwarzen Zahl in einem Kreis geändert, damit er wie eine Notifikation aussieht. Die Klickrate ist leicht gestiegen. Dann habe ich die Farbe in rosa Markenfarbe geändert und die Besucher begannen das Tab zu verwenden.
Bestellprozessoptimierung
Änderungen am Shopify-Bestellprozess sind begrenzt. Der Bestellprozess entspricht internationalen Standards, ist auf Millionen von Einkäufen optimiert und ist dem Kunden bekannt. Trotzdem musste der Bestellprozess optimiert werden.
- Zahlungsmöglichkeiten: Es war wirklich ein Problem, in der DACH-Region beliebte Zahlungsmöglichkeiten ohne eine GmbH in Shopify zu integrieren. Ohne sie wäre die Konversionsrate niedrig. Nach einer Recherche in Foren und Diskussionen bin ich auf Mollie gestoßen – einen Zahlungsprozessor, der die Zahlungsmöglichkeiten integrieren kann.
- (Mollie): Die Zahlungsmöglichkeiten hatten das Wort (Mollie) am Ende. Dies könnte die Nutzer stören, verunsichern und sie würden sich fragen, was es bedeutet. Ich habe den Support kontaktiert und gemäß den Anweisungen das Wort entfernt. [Bild ansehen]
- Standard Checkout-Texte auf Deutsch: Shopify-Texte haben geduzt und schienen unhöflich. Sie mussten überschrieben werden und siezen.
- Zahlungsmöglichkeiten zeigen: Ein Schönheitsfehler des Shopify-Zahlungsprozesses ist es, dass Zahlungsmöglichkeiten nur auf der letzten Seite angezeigt werden. Sie können nicht auf jeder Checkout-Seite angezeigt werden. Also habe ich Sie in das Firmenlogo hinzugefügt. Auf diese Weise werden die Zahlungsmethoden bei jedem Schritt des Kaufprozesses dargestellt. [Bild ansehen]
Vereinfachung der Website-Struktur
Es hat Monate gedauert, diesen Schritt zu erreichen. Wir haben die Website benutzt, Hotjar angeschaut, und Feedback gelesen. Dann wurde uns klar, dass die Website verwirrend ist, sie enthält zu viele Kategorien, und die Nutzer müssen viel klicken.
Einzel- und Zwillings Lerntürme
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseiten-optimierung2_collections-alle-turme3.png)
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseiten-optimierung2_collections-alle-turme6.png)
Verschiedene Modelle von Lerntürmen sind nur eine Variation des Standardturms. Daher wurden die Kategorien „Einzeltürme“ und „Zwillingstürme“ zu einer Kategorie „Lerntürme“ zusammengefügt. Damit war es einfacher die Website-Struktur zu benutzen, die Anzahl der Klicks war reduziert und der Nutzer kann alle Türme auf einmal sehen.
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_menu-klickzahl-reduzierung1.gif)
![](https://mcompel.de/wp-content/uploads/2021/08/michal-compel_webseitenoptimierung2_menu-klickzahl-reduzierung2.gif)
Besonders erfreulich war die Klickzahlen-Reduzierung. Vorher wurde auf dem Handy im Menü nach einem Klick auf „Lerntürme“ ein weiteres Menü für Einzel- und Zwillingstürme geöffnet. Der Nutzer brauchte immer einen dritten Klick, um zu den Produkten zu gelangen. Nach der Vereinigung der Kategorien wurde die Produktauswahl um diesen Klick verkürzt und alle Türme wurden angezeigt.
Menü
![](https://mcompel.de/wp-content/uploads/2021/09/michalcompel_webseiten-optimierung2_menulinks-versionen.png)
Beim Erstellen der Website haben wir Links in das Menü gegeben, die wir für nützlich hielten. Es gab zu viele Links, sie wirkten störend und die Nutzer klickten auf die meisten Links zu wenig.
Das Menü wurde optimiert, indem die Anzahl der Links reduziert und die Links mit wenigen Klicks umbenannt wurden, um die Klickrate zu erhöhen.
Da waren auch Links, die wir unbedingt einbauen wollten, aber für die nicht genug Platz da war. Nach einer Dursuchung der anderen Websites habe ich eine Lösung gefunden – ein Dropdown-Menü. Wir haben hier weitere Links platziert. Das Problem war, dass das Dropdown-Menü auf Desktop nicht von den anderen Elementen zu unterscheiden war. Dieses Problem war gelöst, indem die Entwickler einen Pfeil hinzugefügt haben.
Erweiterungen und Zubehör
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_erweitern-fusion1.png)
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_erweitern-fusion3.png)
Bei Erweiterungen und Zubehör wussten die Besucher nicht, wo sich die gesuchte Erweiterung befand, und sie verstanden nicht, warum es aufgeteilt wurde.
Die Aufteilung in Erweiterungen und Zubehör ist nur für interne Zwecke. Erweiterungen modifizieren den Turm und das Zubehör geht in das Paket. Benutzerfreundlicher ist es, eine Produktkategorie mit allen Erweiterungen zu haben. Daher waren Zubehör und Erweiterungen zusammengeführt.
Das resultierende Gefühl war großartig. Nach der Vereinfachung der Struktur fühlte sich die Website anders an – klarer und angenehmer.
Optimierung für Mobilgeräte
Analytics zeigten, dass mehr als 90 % der Nutzer die Webseite über Mobilgeräte benutzen. Deshalb haben wir uns auf die mobile Version konzentriert.
Startseite – unterschiedliche Desktop- und Mobile-Images
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_startseite-bilder.png)
Ein hervorragende Desktop-Image für die Homepage hat nicht für Mobilgeräte gepasst – und umgekehrt. Die Entwickler haben deswegen die Möglichkeit einprogrammiert, ein unterschiedliches Image für Handys und Desktop einzustellen. Auf diese Weise könnte man auf jedem Gerät ein schönes Bild anzeigen und die Homepage sieht ansprechend aus.
Startseite – Produkte an der Unterseite
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_startseite-produkte.png)
In Hotjar sah ich, wie mobile Besucher auf die Startseite kamen, bis zum Ende scrollten und am Ende auf den Inhalt klickten. Es waren Blogbeiträge. Deshalb habe ich auf dem Handy unter Blogbeiträge Produkte hinzugefügt und die Besucher direkt auf Produktseiten geleitet, damit sie das Produkt sehen können.
Bilder in voller Bildschirmbreite
![](https://mcompel.de/wp-content/uploads/2021/09/michal-compel_webseitenoptimierung2_volle-bildschirmbreite.png)
Beim Lesen der Medien habe ich ein Tweak bemerkt: die Bilder sind auf die volle Breite des Displays gestreckt. Ich wollte es auch auf Tukataka so haben. Die Entwickler sagten zuerst, es sei nicht möglich. Nach wiederholten Nachfragen haben sie ein Angebot gemacht und diesen Tweak implementiert.
Die Bilder sind wirklich aufmerksamkeitsstark, einprägsam und die Website sieht anders aus – besser als die Websites der Konkurrenz. Obwohl es unmöglich ist, die Wirkung zu messen, es macht einfach Sinn.
Weitere Verbesserungen
Jetzt nur noch ganz kurz. Einige der anderen auffälligsten Verbesserungen sind:
- Livechat-Ikone in Markenstil: Um den E-Shop zu einem Premium-Shop zu machen, wurde die klassische Livechat-Ikone durch eine Marken-Ikone ersetzt. Seitdem ist die Livechat-Ikone im Markenstil!
- Trustedshops Badge: Das Skript, das Bewertungen automatisch aktualisiert, verlangsamte die Ladegeschwindigkeit der Seite. Also wurde es durch ein Bild ersetzt, dass einmal im Monat vom Grafiker aktualisiert wird. Es ist eine praktische Lösung, um sowohl das aktuelle Badge als auch die Ladegeschwindigkeit zu verbessern.
- Content recommendations: Am Ende von Blogbeiträgen wurden recommendation widgets hinzugefügt. Die Besucher werden sie finden, wenn sie Lust zum Lesen haben, und der Shop wird ihnen mehr über das Produkt sagen.
- Ladegeschwindigkeit und Lazyload: Das ist für ein zweites Artikel, aber einen guten Pagespeed-Score haben erforderte unglaublich viel Energie (und Nerven).
Um es zusammenzufassen
So entstand die Tukataka-Website. Das Ergebnis ist eine schöne Website mit fantastischen Engagement-Metriken wie Konversionsrate, Sitzungsdauer, Absprungrate usw.
Gutes Performance-Marketing macht nicht nur Media Buying. Die Konversionsrate ist auch wichtig. Hören Sie auf Kunden und passen Sie Ihre Website ihren Feedback an. Haben Sie keine Sorgen, etwas zu ändern, auch wenn es nicht 100% messbar ist.
Wie optimieren Sie Ihre Website? Hat Sie dieser Artikel inspiriert und haben Sie etwas gefunden, das Sie umsetzen möchten?
*Hinweis: Dieser Artikel ist veröffentlicht nach Vereinbarung und mit Zustimmung der Shop-Betreiber.