Ausgabe
# 3 | 2014
Kundenmagazin der kernpunkt GmbH
RESPONSIVE WEBDESIGN Was kann es wirklich? ›› Im Interview: Jan Eickmann, Stefan Borchert, Thomas Fischer ›› Responsive Webdesign: Herausforderungen für Online-Marketer ›› Case Study: Kundenkommunikation bei NetCologne ›› Responsive E-Commerce: OXID und Demandware
Inhalt
›› Responsive Webdesign: Herausforderungen für Online-Marketer 4 ›› Im Interview: Jan Eickmann, Stefan Borchert, Thomas Fischer 6 ›› Case Study: Kundenkommunikation bei NetCologne 12 ›› Responsive Online-Shops: OXID und Demandware 14
Impressum: kernpunkt GmbH, Oskar-Jäger-Str. 170, 50825 Köln | Verantwortlich für den Inhalt: Matthias Steinforth | Auflage: 1.600 Stück | Erscheinung: vierteljährlich | Layout: Verena Stark | Redaktion: Tanja Kiellisch, Matthias Steinforth, Dominik Neumann | Bildmaterial: kernpunkt GmbH, istockphoto.com, Wirtgen Group, e-Spirit AG, Inxmail GmbH, Google Inc., Oracle Eloqua, NetCologne GmbH, Oxid eSales AG, Demandware Inc., Twitter Inc. www.kernpunkt.de
2
Optimal | Kundenmagazin der kernpunkt GmbH
Vorwort
VER ÄND ERU NG
Alles verändert sich. In unserer Branche geschieht das besonders rasant. Ohne einen neuen Trend, eine noch ausgereiftere Technologie oder neuen Apps vergeht kein Tag. Da heißt es am Ball bleiben, um sich permanent mit neuen Ideen auseinanderzusetzen. Mir persönlich macht das viel Spaß. Veränderung ist gut, denn sie hält den Kopf frisch und das Herz neugierig, auch wenn es teilweise anstrengend ist. Diesen Leitsatz verfolgen wir auch bei kernpunkt. Wenn Sie uns in letzter Zeit einmal besucht haben, wird Ihnen aufgefallen sein, dass wir uns räumlich vergrößert haben. Im Erdgeschoss gehören uns nun weitere Räume, die ich zusammen mit meinem Team aus Kundenbetreuung, Vertrieb und Marketing bezogen habe. So entzerrt sich unsere räumliche Situation und wir haben noch mehr Platz für die neuen Kollegen aus den Bereichen Projektleitung und Konzeption. Ihnen wird aufgefallen sein, dass wir auch unser Vorwort geändert haben. Unser erstes – und letztes – Video-Vorwort fand leider nicht so viele Zuschauer wie gehofft. Die Klickzahlen sprechen eine eindeutige Sprache. Da diese sehr niedrig waren und der Aufwand eines Video-Drehs zu hoch, haben wir uns entschlossen, das Video-Vorwort erst einmal auf Eis zu legen und zum klassischen Vorwort zurückzukehren. Das ist der Vorteil am Online-Marketing: Wir können ausprobieren, messen und verändern, was nicht gut läuft. Ich wünsche Ihnen viel Spaß bei der Lektüre. <
› Matthias Steinforth, Geschäftsführung Marketing und Vertrieb
# 2 # 3 | 2014
3
Schwerpunkt
RESPONSIVE DESIGN Die drei Herausforderungen für Online-Marketer Von Tanja Kiellisch Online-Nutzer greifen verstärkt mobil auf Internetseiten zu. Sowohl Informations- und Unterhaltungsangebote als auch Online-Shops stehen vor der Herausforderung, die damit verbundene Erwartungshaltung zu erfüllen.
Grundsätzlich schafft ein nutzerzentriertes Online-
auf einspaltig verschoben. Buttons wechseln ihre Po-
Angebot die besten Voraussetzungen für eine hohe
sition immer genauso, dass der Nutzer sie auch ohne
Conversion und zufriedene Nutzer. Dabei muss auch
Mauszeiger bedienen kann. Diese Flexibilität setzt eine
die Nutzungssituation des Besuchers berücksichtigt
genaue Planung und Konzeption der Website voraus.
werden. Ob dieser zu Hause auf dem Sofa, im Büro
Von vornherein muss auf eine schlanke Informations-
am Schreibtisch oder stehend an einer Bushaltestelle
architektur sowie auf reduzierte Texte und Bilder ge-
verweilt, während er ein Online-Angebot aufsucht, hat
achtet werden. Das ist nicht nur für den mobilen Abruf
maßgeblichen Einfluss darauf, wie Online-Inhalte prä-
vorteilhaft. Auch stationäre Seiten profitieren von einer
sentiert werden sollten. Für den Online-Nutzer hat das
übersichtlichen und sortierten Ansicht, die sich auf die
Online-Angebot immer gleich gut zu sein, ohne dass er
wesentlichen und für den Nutzer relevanten Aspekte
aktiv nach mobil optimierten Seiten oder Apps suchen
konzentriert.
muss. Webseiten müssen also in der Lage sein, sich automatisch auf eine bestimmte Erwartungshaltung hin
Es scheiden sich die Geister daran, ob der Nutzer für
flexibel anzupassen. Von dieser Anspruchshaltung sind
jede Nutzungssituation entsprechend individuelle In-
sowohl Design als auch Inhalt betroffen. Die diesem
halte erhalten sollte. Eine Möglichkeit ist, einen Online-
„Nutzer-Briefing“ am ehesten gerecht werdende Online-
Auftritt generell so aufzubauen, dass sich der Nutzer an
Form ist die responsive Website.
jedem Ort der Welt gleich gut dort auskennt und stets dieselben Inhalte erhält, diese dann eben in veränderter
Herausforderung 1: Die responsive Website
Form und nutzerfreundlich aufbereitet.
Ein responsiver Online-Auftritt passt sich dem Abruf
4
mit unterschiedlichen Endgeräten flexibel an. Dabei
Es kann aber auch sein, dass die Nutzer an unterschied-
verändert sich neben der Größe des sichtbaren Be-
lichen Orten auch nur bestimmten Content suchen. Un-
reichs auch die Positionierung der Navigationsstruktur,
terwegs ist vielleicht eine Wegbeschreibung oder eine
die zum Beispiel von der linken Seite in den Kopf der
direkte Kontaktaufnahme wichtiger, als beispielsweise
Seite rutscht und auch inhaltlich reduziert werden kann.
Unternehmensneuigkeiten oder Produkvorstellungen zu
Genauso können Bilder verkleinert werden oder sie
lesen. Abends auf dem Sofa hingegen könnten Unter-
verschwinden bei der kleinsten Gerätegröße komplett.
haltungsangebote, informative Artikel oder Shopping-
Texte werden automatisch von drei- oder zweispaltig
angebote interessant sein. Die Entscheidung, ob Inhalte
Optimal | Kundenmagazin der kernpunkt GmbH
separiert werden sollen, sollte davon abhängig ge-
Herausforderung 3: Mobile Bestellprozesse
macht werden, welchen inhaltlichen Fokus die Website
Ein einwandfrei funktionierender Bestell- oder Trans-
verfolgt und wie umfangreich ihre Inhalte sind. Gegebe-
aktionsprozess ist unabdingbar für den Kaufabschluss.
nenfalls reicht bereits eine generelle Reduzierung der
Bei dem kleinsten Problem brechen die Interessenten
Inhalte und die Fokussierung auf das Wesentliche, um
den Einkauf ab. Wichtig ist, die Seiten kurz zu halten
allen Nutzeransprüchen gerecht zu werden.
und unnötiges Scrollen zu verhindern. Es sollten nicht mehr als vier Schritte notwendig sein, um die Bestel-
Herausforderung 2: E-Mail-Marketing
lung abzuschließen: Warenkorbansicht, Eingabe bzw.
Der Anteil an mobil gelesenen Newslettern steigt wei-
Überprüfung der Kontaktdaten, Auswahl der Versand-
ter stark an. Um herauszufinden, wie groß der mobile
art, Bestellübersicht. Alle Eingabe- und Bedienfelder
Leserkreis am eigenen Newsletter ist, sollte ein Analy-
sollten großzügig und übersichtlich gestaltet sein. Zu
se-Tool Einsatz finden. Ist die Anzahl prägnant, muss
klein gehaltene Formulare und Ansichten frustrieren
dringend darüber nachgedacht werden, den Newsletter
den potenziellen Käufer. Eine Fortschrittsanzeige, die
für diese Leserschaft zu optimieren. Ansonsten ist die
idealerweise noch klickbar ist, sollte zum Standard ge-
Ansicht eines Newsletters auf einem mobilen Endgerät
hören. In den Warenkorb gehören Produktabbildungen,
unter Umständen sehr unbefriedigend für den Nutzer.
die einfach per Finger vergrößert werden können, ge-
Die Optimierung kann über ein separat zur Verfügung
nauso wie die Möglichkeit, die Anzahl der ausgewählten
gestelltes Layout für den mobilen Zugriff geschehen,
Artikel verändern zu können. Wichtig ist auch, den Wa-
aber besser noch unter Verwendung von Responsive
renkorb geräteübergreifend nutzen zu können, denn der
Design.
Online-Einkauf vollzieht sich heutzutage etappenweise und wird an unterschiedlichen Nutzungsorten initiiert
Die technische mobile Optimierung für Newsletter kann
wie abgeschlossen. Eine Registrierung vor Bestellung
recht umfangreich ausfallen, da die Newsletter-Ansicht
mit eigenem Kundenkonto sollte möglich, aber nicht
für jedes Endgerät und Betriebssystem individuell an-
Pflicht sein. Je einfacher und kürzer ein Bestellprozess
gepasst werden muss. Das wird mithilfe von CSS-Me-
gestaltet ist, desto stärker ist die Kaufbereitschaft.
dia-Queries gelöst, also programmierte Gestaltungsanweisungen für den Newsletter. Nahezu alle namhaften
Insgesamt stehen Anbieter vor vielen Herausforde-
Anbieter von Newsletter-Software stellen solche Tem-
rungen, Ideen und Möglichkeiten, ihren Online-Auftritt
plates zur Verfügung. Diese können bei Bedarf ange-
für ihre sehr heterogenen Zielgruppen anzupassen.
passt werden. Bei der inhaltlichen Ausgestaltung des
Je souveräner, moderner und ausgefeilter ein Online-
Newsletters sollte darauf geachtet werden, Texte und
Auftritt gelebt wird, desto selbstverständlicher werden
Betreffzeilen nicht zu lang und Bilder nicht zu groß wer-
Interessenten und Kunden ihn aufsuchen und ihm treu
den zu lassen. Buttons müssen gut sichtbar und groß
bleiben. <
genug abgebildet sein, damit sie auch durch Touch-Bedienung funktionieren. Die Verlinkung ganzer Teaser oder Passagen kann eine hilfreiche Conversion-Maßnahme sein. Der Versand von mobilen Newlettern eröffnet zudem neue Möglichkeiten für Kampagnen. Mobile Coupons beispielsweise erfreuen sich immer größerer Beliebtheit. Was nie vergessen werden darf: Nicht nur der Newsletter selbst, sondern im Anschluss auch die Landing-Page muss mobil optimiert sein. Ansonsten ist der OnlineAuftritt nicht konsistent.
# 3 | 2014
5
Nachgefragt
Jan Eickmann, Stefan Borchert, Thomas Fischer
„DAS SETZT DER NUTZER VORAUS.“ Es wird Zeit, umzudenken. Online-Nutzer wählen anstelle eines Hauptkanals viele verschiedene Endgeräte für den Online-Zugriff. Dabei erwarten sie einen einheitlichen und auf ihre Nutzungssituation abgestimmten Online-Auftritt. Wie sollen Unternehmen auf diese Anforderungen reagieren? Ein Gespräch mit Jan Eickmann, Stefan Borchert und Thomas Fischer.
Optimal: Wie stark wird Responsive Design derzeit von Unternehmen angefragt? Jan: Bei neuen Projekten wird das Thema als selbstverständlich angesehen und wird nicht mehr explizit angefragt. Eigentlich ist Responsive Design ja erst einmal nur eine technische Lösung, um überhaupt auf mobilen Endgeräten präsent zu sein. Werden die Unternehmen genauer befragt, heißt die Anforderung eigentlich: „Wir müssen mobile Endgeräte bedienen“. O: Muss bei dem responsiven Umbau von umfangreichen Websites nicht auf viele Inhalte verzichtet werden? Stefan: Verzichten muss man in den seltensten Fällen. Viel wichtiger ist wirklich, dass der Nutzer eine auf sein Endgerät optimierte Darstellung erhält. Denn das setzt der Nutzer inzwischen auch voraus. Jan: Ich glaube, es geht nicht um Verzichten. Die Frage ist weniger, was zeige ich mobil an, sondern wie priorisiere ich meine Inhalte mobil. O: Wobei ich mobil vielleicht noch ganz andere Fragestellungen habe als stationär. Jan: Ja, da kann man sich drüber streiten. Ich glaube, so unterschiedlich sind die gar nicht. Klar gibt es gewisse Themen, die mobil noch mal relevanter sind als stationär. Aber
6
Optimal | Kundenmagazin der kernpunkt GmbH
Stefan Borchert kombiniert Design mit Funktion
Jan Eickmann (rechts im Bild) ist Leiter der Strategie bei kernpunkt. Er erarbeitet und realisiert gemeinsam mit Art-Director Stefan Borchert (links im Bild) und Frontend-Entwickler Thomas Fischer Konzepte für nutzerzentrierte Online-Auftritte
machen die Leute mobil wirklich so viel anders auf den Sei-
Stefan: Responsive Design hat nicht immer mit Reduk-
ten? Abgesehen davon, dass jemand eine Anfahrtsadresse
tion zu tun. Ich habe schon einen gewissen Spielraum. Wir
oder ähnliches braucht – was mache ich denn mobil noch,
gestalten Webseiten ja nicht, um sie besonders bunt oder
was ich auf dem Desktop nicht mache? Ich schaue unter-
auffällig zu machen. Wir machen sie nutzbar. Das steht bei
wegs ja nicht nur mal eben schnell etwas nach, sondern ich
Responsive Design genauso im Vordergrund, wie für den
sitze auch zu Hause auf dem Sofa und recherchiere etwas.
Desktop-Rechner oder für jedes andere Endgerät.
O: Wie aufwändig ist die Umsetzung von responsivem Design?
„Das ist der Tod jeder Website.“
Thomas: Das ist natürlich komplexer und man muss damit rechnen, dass das länger dauert als die Entwicklung einer
O: Unterscheidet sich die Entwicklung von responsivem
nicht-responsiven Seite.
und stationärem Design?
O: Wahrscheinlich macht es auch Sinn, im Zuge eines
Stefan: Die Konzeptionsphase ist etwas länger, da alle Auf-
Relaunchs manche Funktionen zu überdenken?
lösungen im Blick behalten werden müssen. Ich muss mir
Thomas: Das meiste lässt sich schon gut abbilden. Aber
überlegen, wie etwas an welchem Endgerät aussieht und
aufgrund des Platzmangels muss die Seite unter Umstän-
wie sich alles verschieben kann. Ich brauche von vornhe-
den prägnant umgebaut werden. Tabellen zum Beispiel, die
rein einen Plan, wie sich die Website verhalten soll. Das
fest in der Breite sind, umbrechen zu lassen, sind eine wah-
dauert halt ein bisschen.
re Herausforderung.
O: Für Laien: Wie funktioniert Responsive Design tech-
O: Das heißt, der Designer muss sehr gut überlegen, wie
nisch?
Inhalte dargestellt werden. Kann man sich überhaupt
Thomas: Wirklich geboren ist es erst mit den neuen Web-
noch kreativ ausleben, wenn man sich bei der Gestaltung
techniken, also HTML5, CSS3 und natürlich Javascript. In
einer Website hauptsächlich auf die funktionale Kompo-
den neuen Versionen können Bedingungen hineingeschrie-
nente konzentrieren muss?
ben werden, die auf Eigenschaften der Geräte des Nutzers # 3 | 2014
7
Nachgefragt
reagieren können.
zu kämpfen gehabt. Wenn Du Dir vorstellst, dass sich zum
O: Das heißt, Du musst alle möglichen Auflösungen be-
Beispiel der Hersteller einer Schokolade emotional präsen-
rücksichtigen, die theoretisch abgefragt werden kön-
tieren will, geht das natürlich maßgeblich über Bilder. Dann
nen?
kann Responsive Design ein entsprechendes Problem dar-
Thomas: Wir arbeiten mit Breakpoints, meist mit vier ver-
stellen, wenn nicht an die Details gedacht wird.
schiedenen Auflösungen. Wir bauen quasi vier Versionen
O: Wobei sich hier auch wieder die Frage stellt, ob der
der Website.
Nutzer überhaupt emotional abgeholt werden soll, oder
Jan: Eigentlich sind das Auflösungsbereiche.
ob in dem Moment nicht reine Produktinfos ausreichen.
Thomas: Ja, zum Beispiel 0-480 Pixel, 481 bis 768 Pixel,
Jan: Ich glaube, das zwingt uns noch mehr dazu, uns Ge-
769 Pixel bis 980 Pixel, 981 Pixel bis unendlich.
danken darüber zu machen, wer die Seite in welcher Le-
O: Führt responsives Design zu längeren Ladezeiten?
benslage nutzt.
Thomas: Auf jeden Fall. Zwei Drittel der responsiven Sei-
Stefan: Der Zweck steht letztendlich noch viel stärker im Fo-
ten, die es derzeit gibt, sind einfach untauglich. 70% der
kus. Was will ich mit meiner Website erreichen? Und das
Seiten benötigen über vier Sekunden Ladezeit, teilweise
kann auch am Desktop oder am Handy dasselbe sein, das
sogar bis zu 80 Sekunden. Das ist natürlich der Tod jeder
muss sich nicht zwangsweise unterscheiden.
Website. Da muss optimiert werden.
O: Welchen Tipp gebt ihr Unternehmen mit auf den Weg, die kurz vor einem Relaunch stehen? Jan: Sich von der Vorstellung lösen, der Nutzer sitzt nur an einem Gerät. Responsive Design ist für viele Websites eine gute Lösung, aber nicht für alle. Im B2B-Umfeld greifen derzeit übrigens auch rund 10% der Nutzer mobil zu, also auch da ist es eine wichtige Überlegung. <
Der Nutzer steht bei Jan Eickmann immer im Mittelpunkt
Jan: Mobiltauglichkeit heißt ja nicht nur, die Website funktioniert auf jedem Endgerät, sondern sie funktioniert auch bei schlechter Verbindung, irgendwo im Wald, mitten auf dem Feld. Die 100 MBits, die man in der Stadt vielleicht hat, sind ja nicht überall Realität. Da geht es dann genau um diese Ladezeit. Die Seiten müssen entsprechend gebaut werden, um sie mit guten Ladezeiten auszustatten.
„100 Mbits sind nicht überall Realität.“ Thomas: Klassisches Beispiel ist ein Bühnen-Slider am Kopf einer Seite. Wenn man für den Zugriff mit dem mobilen Device kleinere Bilder zur Verfügung stellt, hat man die Ladezeiten direkt schon prägnant reduziert. Stefan: Damit haben früher vor allem die großen Marken
8
Optimal | Kundenmagazin der kernpunkt GmbH
Thomas Fischer kennt die technischen Kniffe bei responsiven Webseiten › Interview online lesen und weiterempfehlen: kernpunkt.de/magazin
Projekte
Im Portrait
Modern und responsiv
RELAUNCH FÜR DIE WIRTGEN GROUP Die Wirtgen Group präsentiert ihre fünf Marken und die damit verbundenen rund 50 Länderseiten künftig mit überarbeiteten Online-Auftritten. Mit einem modernen und großzügigen Layout verstehen es die Baumaschinenhersteller, das Thema Straßenbau in Szene zu setzen und bauen auf die Emotionalisierung ihrer Produkte. Dafür sorgen zum Beispiel auf www.wirtgen.de und www. kleemann.info große Bühnen am Kopf der Seite genau wie kurzweilige Teaser und ausführliche Produktdarstellungen. Letztere zeigen Liebe fürs Detail: Einzelne Elemente auf den jeweiligen Abbildungen sind anklickbar. Es öffnet sich eine Box, die weitere Informationen und auch Videos über das Produkt bereithält. Selbstverständlich stehen auf den Produktseiten Broschüren in mehreren Sprachen zum Download sowie weiterführende Links bereit. Alle Webseiten werden auf Basis von FirstSpirit 5 realisiert und sind responsiv. Bereits online ist neben
Sina Lienig Telefon: +49 221 - 569 576 - 416 E-Mail: s.lienig@kernpunkt.de Ausbildung: Ich bin Mediendesignerin und habe den Studienabschluss „Bachelor of Arts in Media Design“. Job bei kernpunkt: Ich bin Art Direktorin. Darum arbeite ich bei kernpunkt: Sehr wichtig für mich: Die tolle Atmosphäre zwischen den Kollegen.
www.wirtgen.de die einem Facelift unterzogene Website
Das schiebe ich immer wieder auf: Seidenblusen bügeln
www.voegele.info. In den nächsten Monaten sehen wei-
und Auto aussaugen.
tere Marken sowie die Vertriebs- und Servicegesellschaften ihrem Relaunch entgegen, modernisieren ihr CMS
Das unternehme ich an einem verregneten Sonntag: Kaf-
und frischen ihr Corporate Design auf.
fee kochen, Plumeau zur Couch tragen und fernsehen oder lesen. Oder mein Freund und ich packen uns in wetterfeste Kleidung und trotzen dem Regen mit einem Spaziergang oder Café-Besuch. Wenn ich Superkräfte hätte wären das: Fliegen! Als eingefleischter Harry Potter-Fan wünsche ich mir ohnehin seit Erscheinen des ersten Bands einen fliegenden Besen. Das wäre also total super! Oder gilt zaubern können auch als Superkraft?! Mein letzter Urlaub: Ist zu lange her. Mit der AIDA auf Frühjahrs-Kanaren-Tour. Apple oder Android? Apple.
Frischer Online-Auftritt für Wirtgen
Die Mittagspause verbringe ich am liebsten: Immer mit meinen Kollegen, oft mit einem Avocado-Brot und zwei geschälten Möhren oder einem Salat. Mein Internet-Geheimtipp: Schon etwas älter, aber immer wieder interessant zum Stöbern: http://www.thefwa.com/ Alternativ dazu aber auch: http://www.awwwards.com/ # 3 | 2014
9
Lösungen
DESIGN MIT SYSTEM Responsive Seiten umsetzen und steuern
Integrierte Multi-perspective Preview (MPP)
Einfache und schnelle Redaktion
FIRSTSPIRIT CMS
INXMAIL
Highlights
Highlights
› Content-fokussiert und responsiv
› Responsive Design und Responsive Content
› Automatisierte Anpassung an Endgeräte
› Individuelle und vorgefertigte Newsletter-Templates
› Multi-perspective Preview (MPP)
› Analyse mobiler Zugriffe
Was kann es?
Was kann es?
FirstSpirit unterstützt Redakteure und Marketers zu-
Mit Inxmail Professional lassen sich sehr schnell und
verlässig bei der effizienten Steuerung ihrer digitalen
unkompliziert individualisierte und mobil optimierte
Multi-Channel-Kommunikation. Anhand der integrier-
Mailings und Newsletter erstellen. Neben Individual-
ten Multi-perspective Preview (MPP) lassen sich bei-
Templates stehen hierfür auch vorgefertigte Newslet-
spielsweise nicht nur jegliche Content-Varianten direkt
ter-Templates zur Verfügung, die sich in Darstellung
im CMS prüfen und optimieren, sondern auch die
und Bedienverhalten automatisch an das Endgerät
Darstellung gewünschter Inhalte einfach steuern.
des Empfängers anpassen. Auch die Inhalte können
FirstSpirit unterstützt durch seine flexible Architektur
abhängig vom jeweiligen Endgerät des Empfängers
und Skalierbarkeit nicht nur die einfache Umsetzung
ausgeliefert werden. Dabei wird zwischen verschie-
responsiver Webauftritte, sondern sorgt dabei glei-
denen mobilen Endgeräten unterschieden. Die detail-
chermaßen für eine herausragende Performanz und
lierte Reporting-Funktion zeigt, wie viele mobile Öff-
Usability im Front- und Backend.
nungen pro Versand verzeichnet werden und welche
Content Management auf allen Kanälen
Responsives Newsletter-Marketing
Betriebssysteme hierbei zum Einsatz kommen. Mehr Info: kernpunkt.de/kompetenzen/firstspirit-cms Mehr Info: kernpunkt.de/kompetenzen/inxmail
10
Optimal | Kundenmagazin der kernpunkt GmbH
Die Mehrkanalfähigkeit eines Online-Auftritts steht und fällt mit der technischen Basis. Wir stellen Ihnen Lösungen vor, mit denen Sie auf allen Kanälen gut aufgestellt sind.
Übersichtliches und individuelles Dashboard
Erstellung von responsiven Kampagnen
GOOGLE ANALYTICS
ORACLE ELOQUA
Highlights
Highlights
Responsive Analyse und Auswertung
Management von responsiven Kampagnen
› Segmentierung mobiler Aktivitäten
› Template-Galerie für mobile Newsletter
› Conversion-Optimierung
› Import externer Mail-Editoren möglich
› Mobile Reports
› Zusatzmodul Eloqua4FirstSpirit
Was kann es?
Was kann es?
Mit Google Analytics lässt sich vor einem geplanten
Marketing Automatisierung mit Eloqua ermöglicht ziel-
Relaunch prüfen, ob der Wechsel in ein responsives
gerichtete und hoch automatisierte Newsletter-Kam-
Design überhaupt Sinn macht. Beispielsweise können
pagnen. Unter Verwendung spezieller Templates kön-
die mobilen Zugriffe mit den Desktop-Zugriffen vergli-
nen mobil optimierte Newsletter verschickt werden.
chen werden. Zur Überprüfung des responsiven Auf-
Dabei muss der Inhalt nur einmal erstellt werden. Elo-
tritts stehen zahlreiche Möglichkeiten zur Segmentie-
qua passt den Newsletter automatisch an das jeweilige
rung zur Verfügung. Eingesetzte Endgeräte, Browser,
Endgerät an. Noch einfacher ist die Erstellung von mo-
Betriebssysteme oder die mobile Conversion können
bilen Newslettern in Kombination mit dem CMS First-
bis ins Detail ausgeleuchtet werden.
Spirit. Die Redaktionsarbeit wird mit dem speziellen Modul Eloqua4FirstSpirit zu FirstSpirit ausgelagert und
Mehr Info: kernpunkt.de/kompetenzen/google-analytics
erlaubt Redakteuren, E-Mails templatebasiert zu gestalten. Das Versand- und Kampagnenmanagement sowie die Kampagnenauswertung verbleiben bei Eloqua. Mehr Info: kernpunkt.de/kompetenzen/eloqua
# 3 | 2014
11
Case Study
Moderne Kundenansprache
ONLINE-KOMMUNIKATION FÜR NETCOLOGNE Die Website von NetCologne zeigt den Weg eines modernen Telekommunikationsunternehmens im Internet auf: Klare Strukturen und Prozesse, ein einfaches Bedienkonzept und gute Auffindbarkeit der Inhalte durch Suchmaschinen. Die Nutzer von www.netcologne.de haben die Möglichkeit, fast alle Anliegen online statt in einer Filiale zu klären.
Interessenten und Kunden, die den Online-Auftritt des Kölner
ches Produkt Sie haben möchten, können über den „Jetzt
Unternehmens besuchen, haben ein bestimmtes Anliegen.
bestellen“-Button einfach in den B2B-Shop wechseln.
Ziel von NetCologne ist es, dieses Anliegen zu bedienen und gleichzeitig Produkt- und Unternehmensinformationen anbzubieten. Die Herausforderung liegt hierbei in der breitgefächerten Zielgruppe mit ihren unterschiedlichen Bedürfnissen. Die hohe Qualität des Angebots soll sich auch auf der Website widerspiegeln, so dass aus Online-Interessenten Online-Kunden werden. Konversionsziele für unterschiedliche Zielgruppen Die Zielgruppe von NetCologne umfasst nahezu alle Menschen und Unternehmen der Region und reicht damit vom einzelnen Privatkunden bis hin zum Großkonzern. Daraus ergeben sich stark variierende Bedürfnisse und Ansprüche, denen die Website Rechnung trägt. Das Angebot wird nicht
Startseite von netcologne.de
nur nach Privat- und Geschäftskunden sowie Interessenten aus dem Bereich Wohnungswirtschaft unterteilt. Innerhalb
Übersichtlich und schnell für Privatkunden
des Geschäftskunden-Segments wird noch einmal zwischen
Online-Besucher, die auf der Suche nach einem Telefon-
kleineren, mittleren und großen Unternehmen unterschie-
oder Internet-Anschluss für den Privatgebrauch sind, werden
den. Durch die unterschiedlichen Zielgruppen ergeben sich
schon auf der Einstiegsseite mit übersichtlichen und verständ-
verschiedene Konversionsziele. Während im Privatkunden-
lichen Produktpräsentationen empfangen. Die Produkte wer-
bereich die Produktbestellung bzw. -beauftragung im Vor-
den in aller Kürze in einer Vergleichstabelle aufgeführt. Der
dergrund steht, wird im Geschäftskundenbereich und im
Besucher erkennt so auf einen Blick die verschiedenen Tarif-
Segment Wohnungswirtschaft zunächst die Kontaktaufnah-
pakete. Bei Klick auf das jeweilige Tarifpaket können weitere
me, also die Generierung von Leads, fokussiert. Bei den
Details in Erfahrung gebracht werden. Anstelle von komple-
Geschäftskunden wächst mit steigender Unternehmensgrö-
xen Darstellungen erwarten den Nutzer übersichtliche und
ße auch die Komplexität der Kommunikationslösungen und
verständliche Produktpräsentationen in Form von Reiterkar-
damit der Bedarf nach maßgeschneiderter Information und
ten. Darüber hinaus werden die Highlights eines Produkts am
Beratung. Interessenten, die sich bereits sicher sind, wel-
Kopf der Seite zusammengefasst und komprimiert präsentiert.
12
Optimal | Kundenmagazin der kernpunkt GmbH
Multi-Channel-Kommunikation mit Responsive Design
Persönlich für Geschäftskunden
die Seite emotional auf und geben ihr den typischen Net-
Auf der Startseite „Geschäftskunden“ erfolgt der zentra-
Cologne-Look. Buttons und Störer sind gut sichtbar platziert
le Einstieg über die Unternehmensgröße. Drei Text-Bild-
und greifen die Corporate-Farben auf. Die gesamte Webseite
Teaser verlinken in die Bereiche „Kleine Unternehmen“,
wird mittels Responsive Design realisiert und garantiert so
„Mittlere Unternehmen“ und „Große Unternehmen“, wobei
eine Darstellbarkeit auf unterschiedlichsten Endgeräten vom
die in den Teaser integrierte Mitarbeiterzahl und ein kurzer
Desktop über verschiedene Tablets bis zu Smartphones. Die
Einleitungstext dem Geschäftskunden bei der Einordnung
NetCologne-Website basiert technisch auf dem Content-Ma-
des eigenen Unternehmens helfen.
nagement-System Drupal. <
Aufgrund der hohen Produktvielfalt und -komplexität wird im Geschäftskundenbereich stärker leistungsbezogen argumentiert. Die Produkte werden als Lösung für bestimmte Anforderungen vorgestellt. Durch den hohen Beratungsbedarf ist im Geschäftskunden-Segment die Kontaktaufnahme zentrales und messbares Konversions-Ziel. Geschäftskunden werden gleich mehrere interessante Optionen geboten. Sie können nicht nur selbst eine telefonische oder schriftliche Anfrage stellen, sondern außerdem die Rückruf-Option oder den Service-Chat nutzen. Klar und offen im Layout Beim Layout wurde vor allem auf Offenheit und Übersichtlichkeit geachtet. Großflächige Bilder, die aktuellen Marketingkampagnen von NetCologne entnommen sind, laden
Übersichtlicher Produktvergleich › Ausführliche Case Study unter kernpunkt.de/ergebnisse/netcologne-gmbh
# 3 | 2014
13
Produktvorstellung
OXID ESALES: DEM VERÄNDERTEN NUTZERVERHALTEN GERECHT WERDEN Responsive Design ist ein Trendthema im E-Commerce. Das veränderte Nutzungsverhalten der Besucher macht es zur Pflicht, die Darstellung des Onlineshops an verschiedene Endgeräte anzupassen, um eine gleichbleibende Usability zu bieten.
Responsiver Shop der medi GmbH & Co. KG auf Basis von OXID
Einfache Umsetzung mit dem Mobile Modul von OXID
Gut gerüstet mit OXID eShop
Es geht um Usability
Um E-Commerce-Unternehmen im Bereich Responsive De-
Generell müssen sich E-Commerce-Treibende beim Thema
sign zu unterstützen, bietet OXID eSales mehrere Responsi-
Responsive Design oder Mobile-Strategie bewusst machen,
ve-Templates über den internationalen Marktplatz OXID eX-
dass es nicht ausreicht, sich allein mit der Darstellung der
change an. Wer viele Besucher in seinem Shop identifiziert,
vom Desktop bekannten Shopoberfläche zu beschäftigen.
die mit Smartphones einkaufen, sich informieren oder im
„Die Überlegung muss sein, welche Use-Cases unterstütze
Rahmen einer Crosschannel-Integration mobile Zusatzfunkti-
ich auf welchem Endgerät in welcher Nutzungssituation? Da-
onalitäten anbieten möchte, sollte in Betracht ziehen, eine ei-
bei geht es allerdings nicht nur um die reine Optik, sondern
gene Mobile-Strategie zu verfolgen, die über den Ansatz „Ein
vielmehr um die Usability“, erklärt Roland Fesenmayr, CEO
Template für alle Endgeräte“ hinausgeht. Ein in Kooperation
der OXID eSales AG. Shopbetreiber sollten sich folgende
mit PayPal entstandenes Mobile Theme von OXID eSales,
Fragen stellen: Welche Elemente aus dem Shop werden in
das mit der aktuellen Shop-Software ausgeliefert wird, steht
welcher Ausprägung auf dem jeweiligen Endgerät darge-
hier für Smartphones zur Verfügung. Die Königsdisziplin stellt
stellt? Sind tatsächlich alle Elemente des Shops für mobile
die Entwicklung einer Native App für iOS und Android dar,
Nutzer relevant? Oder erhöht in diesem Fall eine reduzierte
die um ausgefeilte unternehmensspezifische Services erwei-
Oberfläche im Sinne einer Fokussierung auf das Wesentliche
tert werden kann. Wobei sich der Einsatz einer solchen App
die Customer Experience? Sind diese Fragen beantwortet,
aktuell ausschließlich im Enterprise-Umfeld finden lässt.
steht der Umsetzung eines erfolgreichen Responsive Designs nichts im Weg.
14
Optimal | Kundenmagazin der kernpunkt GmbH
gezeigt werden sollen, während ein konsistentes Markenerlebnis gewahrt wird. Die Inhalte werden einmal erstellt und passen sich dann automatisch an das Format bestimmter Mobil- oder Tablet-Geräte an. Die Händler können selbst ganz einfach bestimmen, ob sie diese Funktion nutzen wollen oder nicht. Wachsende mobile Aktivität Laut einem aktuellen Bericht auf theguardian.com besuchen in Großbritannien mittlerweile 52% der Nutzer Online-Shops über ein mobiles Endgerät. 36% der Online-Käufe werden über ein Smartphone oder Tablet abgeschlossen, wobei Tablets hier noch beliebter sind. Derzeit laufen 924 Seiten auf der Demandware-Plattform. Unter dem Strich sind alle E-Commerce-Anbieter gut beraten, ein mobiles Angebot bereitzustellen. < Responsiver Online-Shop von Jack Wolfskin
Demandware: Channel-Management mit SiteGenesis Mit der Entscheidung für die Commerce-Plattform Demandware erhalten Händler eine Reihe von integrierten Services. Neben der ausgereiften Technologie, mit der Online-Shops sicher und skalierbar funktionieren, stehen den Shop-Betrei-
An oder aus: Responsive Design zum Ankreuzen
bern zahlreiche Entwicklungs- und Marketing-Tools zur Verfügung. Nicht zuletzt besteht Zugriff auf ein Set von Applikationen, mit denen der Live-Gang schnell und unkompliziert vonstatten geht. Eine dieser Applikationen ist die sogenannte SiteGenesis. Als Standard-Applikation begegnen Shop-Betreiber SiteGenesis direkt zu Beginn ihres E-Commerce-Projekts. Es kombiniert Best Practices in Nutzerfreundlichkeit, Verkaufsförderung und technischer Architektur, um ertragreiche Seiten zu bauen. SiteGenesis unterstützt Händler mit Beispielen und Vorlagen zu den Themen Promotion und Marketing, dynamische Suche oder Preislisten. Die Applikation wird regelmäßig aktualisiert und technisch optimiert, um den dauerhaften Erfolg der Kunden sicherzustellen. SiteGenesis ist eine Out-of-the-Box-Lösung, die einen guten Start in das Thema E-Commerce sichert. Inhalte einmal erstellen und automatisiert anpassen Multi-Channel-Management, und damit Responsive Design, ist bei Demandware bereits seit vielen Jahren ein wichtiges Thema. Über SiteGenesis kann deshalb einfach ausgewählt werden, welche Attribute oder Aktionen auf jedem Kanal an-
Mit der Demandware-Applikation SiteGenesis wachsen Online-Shops automatisch mit # 3 | 2014
15
Das bewegt die Online-Welt
Harald Schmidt
@BonitoTV
20.06.14 11:49
Einfach einmal im Gespräch nebenbei „Typo3“ erwähnen und schon ist man der King. #likeaboss 38 Retweets
56 Favoriten
„TYPO3 ist uns als Verantwortliche im Online-Marketing seit vielen Jahren ein Begriff. Dass allerdings einer der bekanntesten Talkmaster in Deutschland per Twitter die OpenSource-Technologie ins Gespräch bringt, zeigt, wie sehr das digitale Marketing im Alltag angekommen ist.“ Matthias Steinforth
16
Optimal | Kundenmagazin der kernpunkt GmbH