SlideShare ist ein Scribd-Unternehmen logo
1 von 58
Downloaden Sie, um offline zu lesen
Internet to go
Neue Anforderung an die Mobilisierung von Websites
am Beispiel der Verlagsmarke Kiepenheuer & Witsch
Online Marketing Forum 2014 – Düsseldorf
Daniel Riemer
User Interface Designer
www.active-value.de
Organisation
Inhabergeführte GmbH
Standort
Düsseldorf
Gründungsjahr
2005
Anzahl Mitarbeiter
25
Das Web im Zeitalter von
iPhone und iPad
http://bradfrostweb.com/wp-content/uploads/2012/03/03-650x487.png
http://bradfrostweb.com/wp-content/uploads/2012/03/03-650x487.png
http://bradfrostweb.com/wp-content/uploads/2012/03/03-650x487.png
Das Smartphone als
ständiger Begleiter
http://instagram.com/p/W2BuMLQLRB/
Verbreitung internetfähiger
Smartphones in Deutschland
18% 29% 40%
2011 2012 2013
http://services.google.com/fh/files/misc/omp-2013-de-local.pdf
Smartphones werden
überall genutzt
95%
http://services.google.com/fh/files/misc/omp-2013-de-local.pdf
87% 78% 72%
Mehr als nur ein Unterhaltungs- und
Kommunikationsmedium
http://services.google.com/fh/files/misc/omp-2013-de-local.pdf
86% 81%
http://de.slideshare.net/kleinerperkins/kpcb-internet-trends-2013
Mobile Traffic
http://www.flickr.com/photos/brad_frost/7387824246
http://opensignal.com/reports/fragmentation-2013/
Wie können Unternehmen
diesem Trend gerecht
werden?
Option A
„Wir machen nix.“
Vorteile
•  Kostengünstig
Nachteile
•  Führt mittel- bis langfristig
zum Aus. Garantiert.
Option A
„Wir machen nix.“
Option B
Separate, mobile-optimierte Website
http://m.spiegel.de & http://www.spiegel.de
Vorteile
•  Mobile Website unabhängig
Nachteile
•  Ignoriert Vielfalt der Devices
und Displaygrößen
•  Doppelter Pflegeaufwand
•  Fehleranfälligkeit bei Redirects
•  Unter Umständen
Schwächung des SEO-Signals
Option B
Separate, mobile-optimierte Website
Option C
Responsive Webdesign
Responsive Webdesign
Gestalterischer und technischer Ansatz zur Erstellung von Websites,
so dass diese auf Eigenschaften des jeweils benutzten Endgeräts
reagieren können. Der grafische Aufbau einer „responsiven“
Webseite erfolgt anhand der Anforderungen des jeweiligen Gerätes,
mit dem die Seite betrachtet wird.
http://de.wikipedia.org/wiki/Responsive_Webdesign
http://www.bbc.com/news?view=beta
Vorteile
•  Optimale Darstellung
•  Einfacher Pflegeaufwand
•  Keine Redirects notwendig
•  Volle SEO-Power
Nachteile
•  Schlechtere Performance
•  Höherer
Entwicklungsaufwand
Vorteile
•  Optimale Darstellung
•  Einfacher Pflegeaufwand
•  Keine Redirects notwendig
•  Volle SEO-Power
Nachteile
•  Schlechtere Performance
•  Höherer
Entwicklungsaufwand
Vorteile
•  Optimale Darstellung
•  Einfacher Pflegeaufwand
•  Keine Redirects notwendig
•  Volle SEO-Power
Nachteile
•  Schlechtere Performance
•  Höherer
Entwicklungsaufwand
Vorteile
•  Optimale Darstellung
•  Einfacher Pflegeaufwand
•  Keine Redirects notwendig
•  Volle SEO-Power
Nachteile
•  Schlechtere Performance
•  Höherer
Entwicklungsaufwand
Von Google
empfohlen!
Responsive Webdesign
Die Zutaten
1
2
3
Fluides
Gestaltungsraster
Flexible Bilder
und Videos
„Media Queries“
1
2
3
Fluides
Gestaltungsraster
Flexible Bilder
und Videos
„Media Queries“
1
2
3
Fluides
Gestaltungsraster
Flexible Bilder
und Videos
„Media Queries“
Media Queries
Ermöglichen medienabhängige und
mediengerechte Gestaltung
Performance
Touch
Ergonomics
Feature Detection
Conditional Loading
Neuer Workflow
Content Strategy
Designer Developer
http://www.flickr.com/photos/brad_frost/7387824246
Style Tiles
Prototypen
Designer + Developer
Quantifizierbarer Nutzen
Das leistet Responsive Webdesign
Mobile Traffic + 80%
Mobile Traffic
Unique Visitors
+ 80%
+ 25%
Mobile Traffic
Unique Visitors
Time spent
+ 80%
+ 25%
+ 10%
http://www.magazine.org/timecom-gm-craig-ettinger-bringing-responsive-web-design-iconic-brand
Mobile Traffic
Unique Visitors
Time spent
Mobile Bounce Rate
+ 23%
+ 15%
+ 7%
- 26%
http://electricpulp.com/notes/you-like-apples/
iPhone / iPod Android Non-Mobile
Conversion Rate
Umsatz
+ 65,7%
+ 101,2%
+ 407,3%
+ 591,4%
+ 20,3%
+ 41,1%
Wie „responsive“ ist
Ihre Website?
Tools
www.active-value.de/
responsive-design-viewer
Haben Sie Fragen?
Vielen Dank!
daniel.riemer@active-value.de

Weitere ähnliche Inhalte

Ähnlich wie Responsive Webdesign am Beispiel von Kiepeneheuer & Witsch

Digitalisierung: Neue Geschaeftmodelle und der Druck der Märkte
Digitalisierung: Neue Geschaeftmodelle und der Druck der MärkteDigitalisierung: Neue Geschaeftmodelle und der Druck der Märkte
Digitalisierung: Neue Geschaeftmodelle und der Druck der MärkteSven Jänchen
 
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...Goldbach Group AG
 
Das Potential von Anwendungen aus der Cloud
Das Potential von Anwendungen aus der CloudDas Potential von Anwendungen aus der Cloud
Das Potential von Anwendungen aus der CloudiBROWS
 
Ivan Schmid: Moderne Website und Online-Shop Lösungen
Ivan Schmid: Moderne Website und Online-Shop LösungenIvan Schmid: Moderne Website und Online-Shop Lösungen
Ivan Schmid: Moderne Website und Online-Shop LösungenONE Schweiz
 
Artikel im Swiss IT Magazine: Marktuebersicht Web-Agenturen
Artikel im Swiss IT Magazine: Marktuebersicht Web-AgenturenArtikel im Swiss IT Magazine: Marktuebersicht Web-Agenturen
Artikel im Swiss IT Magazine: Marktuebersicht Web-Agenturenxeit AG
 
Dem mobilen Internet gehört die Zukunft
Dem mobilen Internet gehört die ZukunftDem mobilen Internet gehört die Zukunft
Dem mobilen Internet gehört die Zukunftahorn. gmbh
 
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...University St. Gallen
 
Vortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt GladbeckVortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt GladbeckAppPlusMobile.info
 
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013Stefan Willkommer
 
W3C/DFKI Automotive Workshop
W3C/DFKI Automotive WorkshopW3C/DFKI Automotive Workshop
W3C/DFKI Automotive WorkshopGeorg Rehm
 
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETER
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETERRADiOSPHERE | TALKWALKER & WEBANALYSEANBIETER
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETERRADiOSPHERE
 
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?enpit GmbH & Co. KG
 
Meine 10 TOP Nachrichten zu Mobile der vergangenen Wochen
Meine 10 TOP Nachrichten zu Mobile der vergangenen WochenMeine 10 TOP Nachrichten zu Mobile der vergangenen Wochen
Meine 10 TOP Nachrichten zu Mobile der vergangenen WochenStefan Pfeiffer
 

Ähnlich wie Responsive Webdesign am Beispiel von Kiepeneheuer & Witsch (20)

Digitalisierung: Neue Geschaeftmodelle und der Druck der Märkte
Digitalisierung: Neue Geschaeftmodelle und der Druck der MärkteDigitalisierung: Neue Geschaeftmodelle und der Druck der Märkte
Digitalisierung: Neue Geschaeftmodelle und der Druck der Märkte
 
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...
Wie Sie mit spezialisierten Apps Ihre Geschäftsprozesse einfacher und effizie...
 
Das Potential von Anwendungen aus der Cloud
Das Potential von Anwendungen aus der CloudDas Potential von Anwendungen aus der Cloud
Das Potential von Anwendungen aus der Cloud
 
Ivan Schmid: Moderne Website und Online-Shop Lösungen
Ivan Schmid: Moderne Website und Online-Shop LösungenIvan Schmid: Moderne Website und Online-Shop Lösungen
Ivan Schmid: Moderne Website und Online-Shop Lösungen
 
Digital design 2015 neue und alte entwicklungen - vortrag tourismuscamp 2015
Digital design 2015   neue und alte entwicklungen - vortrag tourismuscamp 2015Digital design 2015   neue und alte entwicklungen - vortrag tourismuscamp 2015
Digital design 2015 neue und alte entwicklungen - vortrag tourismuscamp 2015
 
Artikel im Swiss IT Magazine: Marktuebersicht Web-Agenturen
Artikel im Swiss IT Magazine: Marktuebersicht Web-AgenturenArtikel im Swiss IT Magazine: Marktuebersicht Web-Agenturen
Artikel im Swiss IT Magazine: Marktuebersicht Web-Agenturen
 
Dem mobilen Internet gehört die Zukunft
Dem mobilen Internet gehört die ZukunftDem mobilen Internet gehört die Zukunft
Dem mobilen Internet gehört die Zukunft
 
Trends im Mobile Web
Trends im Mobile WebTrends im Mobile Web
Trends im Mobile Web
 
VDC Newsletter 2012-10
VDC Newsletter 2012-10VDC Newsletter 2012-10
VDC Newsletter 2012-10
 
VDC Newsletter 2009-03
VDC Newsletter 2009-03VDC Newsletter 2009-03
VDC Newsletter 2009-03
 
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...
Die neue Digitale Realität - Wie die Digitale Transformation Strategie, Proze...
 
VDC Newsletter 2011-12
VDC Newsletter 2011-12VDC Newsletter 2011-12
VDC Newsletter 2011-12
 
VDC Newsletter 2005-07
VDC Newsletter 2005-07VDC Newsletter 2005-07
VDC Newsletter 2005-07
 
Vortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt GladbeckVortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
Vortrag zu Apps AppPlusMobile, Kreativamt Gladbeck
 
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013
E-Commerce Architektur aus Sicht eines Dienstleisters, IPC 2013
 
W3C/DFKI Automotive Workshop
W3C/DFKI Automotive WorkshopW3C/DFKI Automotive Workshop
W3C/DFKI Automotive Workshop
 
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETER
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETERRADiOSPHERE | TALKWALKER & WEBANALYSEANBIETER
RADiOSPHERE | TALKWALKER & WEBANALYSEANBIETER
 
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?
Rapid Application Development (RAD) im Enterprise - Quo vadis Portal?
 
RAP im Enterprise - Quo Vadis Portal ?
RAP im Enterprise - Quo Vadis Portal ?RAP im Enterprise - Quo Vadis Portal ?
RAP im Enterprise - Quo Vadis Portal ?
 
Meine 10 TOP Nachrichten zu Mobile der vergangenen Wochen
Meine 10 TOP Nachrichten zu Mobile der vergangenen WochenMeine 10 TOP Nachrichten zu Mobile der vergangenen Wochen
Meine 10 TOP Nachrichten zu Mobile der vergangenen Wochen
 

Responsive Webdesign am Beispiel von Kiepeneheuer & Witsch