Conversion on Steroids zeigt praktische Beispiel mit der man seine Conversion Rate erhöhen kann. Neben Anpassungen auf der technischen Seite werden Best Practices vorgestellt.
2. Vorstellung
Jens Altmann
Software Engineer bei der complex economy GmbH
- Entwickler seit 2004
- Professionell im SEO-Bereich seit 2009 tätig
- Moderator der Black Hat Show bei Radio4SEO
- Softwarekonzeption, -planung und -erstellung
@gefruckelt | facebook.com/jens.altmann
http://gefruckelt.de
mail@jens-altmann.de
2
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
3. Speed
Conversion Optimierung beginnt bei der Geschwindigkeit
- 1 Sekunde mehr Ladezeit kann die
Conversion Rate um 7% reduzieren
- Ein Shop mit 100.000 Euro Umsatz
im
Jahr gehen durch diese eine Sekunde
2,5 Millionen Euro pro Jahr verloren
Quelle:
http://blog.kissmetrics.com/loading-time/
3
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
4. Speed mobile
Mobile explizit betrachten
Second Screen
Hohe Auflösung – kleiner Bildschirm
Responsive Design
Vorteile
- Gleiches Layout für Desktop, Mobile und Tablet
- Verwendung in Hybrid/Wrapper Apps
Nachteile
- Noch im Beta Stadium
- Hoher Testaufwand
- Schwierige Unterscheidung der Anwendungsfälle
4
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
5. Speed optimization
Probleme bei der Geschwindigkeit
Unterschiedliche Felder:
Client
- Netzwerkgeschwindigkeit
- langsame CPU (mobile!)
- Darstellung im Browser
Server
- zu hohe Last
- viele Datenbankabfragen
- Angriffe von außen
- unzureichende Konfiguration
Spezifikation
- HTTP/1.1 sieht nur zwei Verbindung zu einem Host vor!
5
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
6. Speed optimization
Lösungsansätze Client
Javascript
- Asynchronges laden
- DOM Manipulationen direkt vor </body>
Bilder
- kleine Bilder in der CSS via Base64 Inline definieren
- Bilder zu CSS Sprites zusammenfassen
- Bilder optimieren z.B. mit WebP (~26% kleiner als PNG, Transparenz) → vorsicht!
DOM
- Reduzierung des DOM
- sinnvolle CSS Selectoren
- Unnötigen Code entfernen (langsame Werbenetzwerke etc.)
Rendering und Darstellung
- Bilder immer mit Höhe und Breite definieren
- Inline CSS im <head> für kleine CSS Dateien oder selten verwendete Definitionen
- Pure Javascript anstelle von Frameworks
6
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
7. Speed optimization
Lösungsansätze für den Server
.htaccess
- Keep-Alive für HTTP/1.1 aktivieren
- File Caching über den Expired Header im Browser aktivieren
- GZIP aktivieren
Module
- unnötige Module deaktivieren
- mod_pagespeed
Lastverteilung der Datenbankserver
Caching, aber richtig!
- gerendertes HTML
- Datenbankabfragen
Regelmäßige Performance Tests und Monitoring
- Selenium
- Google Page Speed
7
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
8. Speed optimization
Lösungsansätze Spezifikation
Dateien liegen auf anderen Servern
- Subdomains
- CDN
Lazy Load von Bildern
Prefetching und Preload von Bildern und Dateien
8
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
9. User Experience
Definition von CTA und Fokus Elementen
Beispiele Bereich eCommerce
- Warenkorb deutlich hervorheben
- Piktogramme benutzen
- Trust Element in den Fokus setzen, nicht in den Footer
- USP verdeutlichen, dafür den Kopfbereich nutzen
- Bilder ansprechend darstellen
Beispiele Bereich Affiliate / Preis- /Produktbereich
- Hervorhebung von Produkten/Dienstleistungen
- Produkt USP darstellen
- Preise im gewohnten Format darstellen
9
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
10. User Experience
Vereinfachung von Formularen
Sei keine Datenkrake!
→ Formulare auf das nötigste begrenzen
Nutzt gängige Feldernamen
→ Unterstüzung von Autofill Funktionen
Typ Definition vom <input>
→ „text“, „tel“, „url“, „email“ + pattern Attribut (z.B. „[0-9]“)
Think Mobile
→ Formular klein halten
→ viele Eingabe Felder demotivieren, lieber auf mehrere Seiten verteilen („Wizard“)
10
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
11. User Experience
Newsletter Optimierung
A/B-Tests reichen nicht aus
→ Segmentiere die Abonnenten
→ Gruppiere nach Interessen, Kaufhistorie oder ähnlichem
Optimiere für den Nutzer
→ Auf den Abonennten abgestimmte Reihenfolge der Einträge
→ Reduzierung der Einträge um den Fokus gezielter zu setzen
→ Tagging der News durch Redakteure
11
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
12. User Experience
Cross Selling effektiv nutzen
Beispiel: Newsletteranmeldung
→ Biete passende Folgeseiten an
Beispiel: Reisebuchung
→ Kooperation mit Touristenführern, Museen etc. in den Zielorten
Beispiel: Dienstleistungsbuchung
→ Angebot von Rabatten und Gutscheinen in Partnerbaumärkte, Shops etc. die zur Dienstleistung
passen
12
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
13. User Experience
KISS
„Keep it simple, stupid“
Einfache Usability → höhere Conversions
Klare Strukturen
Unterstütze den Anwender
- Inhaltsverzeichnis
- „(Ver)Führe den Nutzer„
→ Dafür benötigen wir:
Intension des Besuchers
Weitere Informationen über den Nutzer
Problem: Wir haben diese Informationen nicht bzw. nur teilweise
( Stichwort: „(not provided)“ )
→ Zielsetzung: Ermittlung dieser Daten!
13
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
14. Tracking
Nutzertracking
„In god we trust, all others we track“
Sei eine Datenkrake! ABER: Ertrinke nicht in Daten!
Analyse mittels Big Data Konzepten
→ Anhand von KPIs ist eine Echtzeitanalyse möglich
→ Benötigt Abgrenzung und Definition von KPIs
14
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
15. Tracking
Nutzertracking
Tracking und Auswertung
Serverseitig
- log Files (z.B.)
- logging im CMS
- Analyticssoftware (z.B. Google Analytics, Piwik)
Client
- Pixeltracking
- Eventbasiertes Tracking
- Tracking von Interaktionen
15
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
16. Tracking
Probleme beim Tracking
EU Cookie-Richtlinie
→ Es wird ein Opt-In oder Opt-Out benötigt
→ Definition und Einsatz nur sehr vage definiert
„Do not track“ - Header
→ Kann als Opt-Out angesehen werden
Datenschutz
→ Aufnahme der Verwendung und Verarbeitung im Disclaimer
Sicherheit der Daten
→ Die Daten sollten möglichst sicher gespeichert werden
Ablehnung von Cookies
→ Tracking durch Browserfootprint, IP Basiert („cookieless tracking“)
16
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
17. Tracking
Eventbasiertes Tracking
Gezieltes Tracking von Events auf der Internetseite
Beispiele
- Newsletteranmeldung
- Analyse von Suchanfragen ohne Ergebnis
- Erkennung von Facetten ohne Ergebnis
- Abbrüche im Conversion Pfad
- 404er analysieren
- Signifikante Zugriffssteigerung auf Unterseiten
→ Chancen für Nutzerbindung
17
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
19. Tracking
Optimierung auf den Nutzer
[HIDDEN CONTENT]
19
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
20. Tracking
LIVE Beispiel
20
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
21. Werbung
Ihr wollt ein SEO und Conversion
optimiertes CMS wie im Live
Beispiel?
http://gefruckelt.de/blackcms/
21
Jens Altmann | gefruckelt | jens.altmann | http://gefruckelt.de
Abgrenzung der Themas Es werden Möglichkeiten zur Conversion Optimierung vorgestellt Diese sind nicht pauschal übertragbar Denkanstöße Besonderes Augenmerk auf Tracking
Persönliche Vorstellung Wer bin ich? Was mache ich? Warum dieses Thema auf der Campixx?
Menscehn kaufen mit dem Auge „ Das Auge isst mit“ Menschen sind gewohnheitstiere Trust Element können auch bewertungen sein Aber vorsicht – keine 100%
Menscehn kaufen mit dem Auge „ Das Auge isst mit“ Menschen sind gewohnheitstiere Trust Element können auch bewertungen sein Aber vorsicht – keine 100%
Beispiel Griechenland Newsletter, Einstellung von intressengebiete
Beispiel Griechenland Newsletter, Einstellung von intressengebiete
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Eyecatcher: Wenn suchphrase paypal – das paypal button Referer Analyse → Fb Button
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm
Im Laden können wir den nutzer fragen was er sucht und ihm dabei behilflich sein. Beispiel C&A, H$M whatever : Jacke, Dunkel, hält Warm