SEO never stands against Design! Wir zeigen dir konkrete Beispiele, wie Rankings und ein höherer Umsatz durch die Optimierung der User Experience entstanden sind und welche Erfolge daraus konkret resultieren. Zudem erhältst du konkrete Tipps & Hacks, die deinen Arbeitsalltag im Bereich "SEO feat. Design" erleichtern werden.Dieser Vortrag ist richtig für dich, wenn du die folgenden Fragen mit JA beantworten kannst: Du setzt dich neben SEO auch mit der Konvertierung deiner Nutzer auseinander? Du bist überzeugt davon, dass Traffic-Generierung nur einen Teilbereich in der Online Marketing Maschinerie einnimmt? Du nutzt bereits heute mehr als nur einen Kanal zu Kundengewinnung oder -bindung?

1. Copyright by xpose360 GmbH 2009 - 2018
So gehts wirklich:
Die Symbiose aus
Webdesign, UX & SEO

2. 2013
explido iProspect
2017
xpose360 GmbH
2011
xpose414 UG
Digital Strategie
80%
Internationales SEO
72%
Disney & Popcorn
90%
Im Winter gehe ich gerne Ski- oder Snowboardfahren, im
Sommer wechsle ich dann aufs Wakeboard. Zusätzlich dazu
versuche ich mich das ganze Jahr mit Fitness wie z.B. Zumba
oder Joggen fit zu halten. Außerdem bin ich generell gerne
unterwegs, d.h. ich versuche jede Gelegenheit zu nutzen zu
reisen, einen Ausflug zu machen oder in Augsburg etwas mit
Freunden zu unternehmen.
Lisa Purrucker
SEO Teamleitung

3. 2012
Sweepstake
2009
xpose414 UG
Digital Strategie
Gründer
72%
New Metal & Hard Rock
90%
Mich inspiriert der Antrieb der Szene, diese natürliche
Begeisterung für die stetige Weiterentwicklung in unserem
Beruf. Wir haben mit einem im SEO notwendigen, breiten
Wissens-und Erfahrungsschatz die Möglichkeit, annähernd
jede Idee zu realisieren und Start Ups zu gründen. Da ich genau
so impulsiv ticke, passt das einfach zu mir.
Alexander Geißenberger
Gründer & Geschäftsleitung xpose360
2018
Quiveo GmbH
2014
xpose360 GmbH
2002
Online
Marketing
100%

4. Internationale Digital Marketing Agentur aus Augsburg
Unsere wichtigsten Auszeichnungen:
SEO PPC AffiliateCreation
Gründung
2009 als
xpose414
Inhabergeführt
& unabhänging
Kampagnen in
16 Ländern
45+ Digital
Marketing
Experten

5. Wir unsere Kundn

6. chapter #1: facing the challenge
Copyright by xpose360 GmbH 2009 - 2018

7. Wind of Change
(whistle)

8. Mobile web in an always on mobile world
Quelle: Brightedge Research 2017
43% 57%

9. Durchschnittliche Nutzungsdauer / Endgerät / Tag
Quelle: https://www.go-gulf.ae/blog/multi-device-content-consumption/
120 min.
170 min.
75 min.

10. Boden-Ampeln = Bompeln
Quelle: https://de.sputniknews.com/gesellschaft/20160426309471418-lebensschutz-smartphone-leser-augsburg/

11. Mobilegeddon 2015 = Mobile Index 2018
Quelle: Searchmetrics Research Cloud
craigslist bank of america

12. Device übergreifende Kampagnen
Quelle: https://www.go-gulf.ae/blog/multi-device-content-consumption/
= 70%
> 90%
der User greifen über
mehrere Geräte auf das Internet zu
der Multi-Device User nutzen mehrere
Geräte um eine Aufgabe zu erledigen

13. ist
anspruchsvoller

14. SERP Features

15. User behavior as a ranking faktor
Quelle: https://www.link-assistant.com/news/user-behavior-and-seo.html

16. Neuer Such-Algorithmus als Grundlage der
Google Suche zum besseres Verständnis
von semantischen Zusammenhängen bei
Suchanfragen
2015
Hummingbird
Selbstlernender Algorithmus von Google auf
Basis von Maschine Learning und K.I. zur
Beantwortung von neuen Suchanfragen
2015
RankBrain
Unangekündigtes Core Algorithmus Update
welches sich auf die Qualität und Relevanz
von Webseiten bezieht
2015
Phantom
Webseiten mit minderwertigen Inhalten, viel
Werbung und Affiliate Links wurden massiv
abgestraft
2017
Fred
Updates
Driving the change

17. UI Anforderungen
Quelle: Google Design & Material Design

18. UI Anforderungen vs. Pageload
Quelle: https://cdn.keycdn.com/support/wp-content/uploads/2016/01/web-page-size.webp &
https://www.hobo-web.co.uk/best-screen-size/ & https://speedcurve.com/blog/web-performance-page-bloat/
2010 2018
702 KB 1.097 KB 1.850 KB 2.332 KB 3.034 KB
<8 Sek <2 Sek<3 Sek<4 Sek<6 Sek
Retina Display
Responsive
Webdesign
Javascript
Frameworks
Font Libraries
Parallax
full-width pics

19. Fazit
Chapter #1: Facing the challenge
Mobile first, mobile first, mobile first
Ladezeiten sterben aus
Multi-Channel = Voraussetzung
SEO erfordert ein Zusammenspiel
aus Kreation, Technik & Content
Verständnis

20. Kanalübergreifende
NUTZERERFAHRUNG
im Zentrum aller Marketingmaßnahmen

21. chapter #2: solve the challenge
Copyright by xpose360 GmbH 2009 - 2018

22. #1 in User
Satisfaction

24. Let’s start and lose some wait.

25. Pagespeed
Quelle: Pingdom Tools

26. Pagespeed
Quelle: Pingdom Tools

27. What does my Site cost?

28. What does my Site cost?

29. Pagespeed Update

30. quick Tipps

31. 1. Preloading via http(s)
Quelle: https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content

32. 1. Preloading responsive media
Quelle: https://github.com/mdn/html-examples/blob/master/link-rel-preload/media/index.html

33. 2. tinyJPG & PNG
Quelle: tinyjpg.com

34. 2. tinyJPG & PNG
Quelle: https://github.com/mdn/html-examples/blob/master/link-rel-preload/media/index.html
323KB 29KB

35. Quelle: web.dev / Google Measure
Lighthouse / Measure

36. Lighthouse / Measure
Quelle: web.dev / Google Measure

37. Ziel erreicht: geringere tatsächliche Ladezeit

38. Aber was ist mit
der gefühlten
Ladezeit?

40. Preloading im Browser

41. Skeletons
Quelle: https://uxplanet.org/popular-web-animation-techniques-a6a467309028

42. Skeletons

43. Skeletons feat. gradual progression

44. Progressive Loading
Quelle: https://uxplanet.org/popular-web-animation-techniques-a6a467309028

45. Blur & Scale
Quelle: https://uxplanet.org/popular-web-animation-techniques-a6a467309028

46. Blur & Scale
285 KB8KB

47. Progress Bar
Quelle: https://uxplanet.org/popular-web-animation-techniques-a6a467309028

48. Active State Formulare

49. Active State Formulare

50. Ziel erreicht: geringere gefühlte Ladezeit

51. Jetzt
soll er auch
bleiben

52. Words on Page
Quelle: https://conversionxl.com/blog/the-effects-of-typography-on-user-experience-conversions/

53. Quelle: https://conversionxl.com/blog/the-effects-of-typography-on-user-experience-conversions/
ABER: Alle sagen immer “holistisch”

54. Schriftgröße
Quelle: https://conversionxl.com/blog/the-effects-of-typography-on-user-experience-conversions/

55. Quelle: https://conversionxl.com/blog/the-effects-of-typography-on-user-experience-conversions/
Readability
große Aufmerksamkeit schenken.
#Fließtext min. 16px

56. Quelle: Smashing Magazine & finanzchef24

57. Quelle: https://material.io/design/typography/the-type-system.html#type-scale
Schriftgröße

58. Quelle: reddit/

59. Quelle: https://material.io/design/color/text-legibility.html#

60. Content Design

61. “Design is not what it looks like
and feels like.
Design is how it works”
(Steve Jobs)

62. Auf der Suche nach Inspiration?
Wirf einen Blick in die Google SERPs

63. SERP Diversifikation

64. SERP Diversifikation

65. SERP Diversifikation

66. Design Trends

67. Video Content

68. Video Content im eCommerce
Quelle: https://www.asos.de/damen/

69. Branding mit Giphy

70. Design
Evergreens

71. Hero Shots in voller Breite
Quelle: https://squareup.com

72. White Space
Quelle: https://squareup.com
Quelle: https://squareup.com

73. Quelle: https://www.friday.de/kfz-versicherung
Paradox of choice

74. Quelle: https://www.friday.de/kfz-versicherung
Paradox of choice

75. Starke Kontraste nutzen
Quelle: https://vimeo.com/de/upgrade

76. Die sieben Farbkontraste
Quelle: https://www.uni-weimar.de/kunst-und-gestaltung/wiki/Farbe

77. Nutzen simulieren
Quelle: https://n26.com/de-de

78. Sorge für den richtigen Flow
Anforderungen
Fähigkeiten
FLOW
Langeweile
Überforderung

79. Stock Photos

80. Stock Photos

81. Stock Photos

82. Stock Photos

83. Stock Photos

84. Original Content

85. Original Content

86. Best Case

87. Content richtig präsentieren

90. Customer Journey
Pre-Awareness Awareness Consideration Purchase Loyalty

91. Tipps & Tricks

106. chapter #3: win the challenge
Copyright by xpose360 GmbH 2009 - 2018

107. Nutze…
… diverse SERP Features
innerhalb deines
Keyword Sets

108. Beschäftige
dich…
… mit modernen
Webdesign Patterns

109. Liefere
Content…
… schnell
… einfach lesbar
… spannend gestaltet

110. Generiere…
… Workflows und
… nutze Tools, um deine
… Strategien zu
skalieren

111. Biete eine
…einheitliche
User Experience
… über die komplette
Customer Journey

112. Foliendownload: xpose360.de/omx
Copyright by xpose360 GmbH 2009 - 2018
Nutze…
… SERP Features innerhalb
deines Keyword Sets
Beschäftige dich…
… mit modernen Webdesign
Patterns für deine Content
Präsentation
Liefere Content…
… schnell
… einfach lesbar
… spannend gestaltet
Generiere…
… Workflows und
… nutze Tools um deine
… Strategien zu skalieren
Biete eine
…einheitliche User Experience
… über die komplette Customer
Journey

113. Foliendownload: xpose360.de/omx
Copyright by xpose360 GmbH 2009 - 2018