Mobilisez-vous, le web est de plus en plus ... Mobile - Petit déjeuner du 27 octobre 2016 - Paris

MOBILisez-vous !Yann Sauvageon

27 Octobre 2016

30mn pour vous parler de Mobile !

2

Les usages mobiles deviennent prééminents

Optimiser son site pour les

usages mobiles

L’algo de Google en

usage mobile

Le futur des usages

mobiles

Qui suis-je ?Search-Foresight

La montée inexorabledes usages mobiles

La compatibilité mobilePopupgeddon

Les pages AMP

Introduction

Amplifiez vos pages pour le mobile

App vs SiteSite mobile ou site

responsive ?

Agence conseil en stratégie digitale | SEO • SEM • CRO • Inbound Marketing • Analytics

1. Contexte / Les usages mobiles deviennent

prééminents

Nous entrons dans l’ère post-desktop !

> 50 %des requêtes effectuées sur Google le sont sur Smartphones.

(Octobre 2015)

“We should stop talking about ‘mobile’ internet and ‘desktop’

internet – it’s like talking about ‘colour’ TV, as opposed to black and white TV.”

Benedict Evans - Analyst at Andreessen Horowitz

Une majorité du temps sur SmartphoneRépartition du temps passé online / US

47%

40%

35%

41%

46%

54%

30%

35%

40%

45%

50%

55%

60%

Dec-2013 Dec-2014 Dec-2015

Desktop Smartphone

Le mobile ne fait qu’amplifier les connexionsRépartition du temps passé online (en mn) / US

0

200 000

400 000

600 000

800 000

1 000 000

1 200 000

1 400 000

1 600 000

Dec-2013 Dec-2014 Dec-2015

Desktop Smartphone Tablet

Et en France ?

Search Mobile > Desktop depuis début 2016!

51%des Français se connectent

chaque jour à Internet sur leur smartphone.

Source : Mediametrie Netratings (Internautes, Mobinautes, Fev2016)

Un média de masseLes français se connectent chaque jour sur :

Mobile > 51%

Desktop > 47%

Tablette > 18%

Intention et Devices Part des recherches par Device

Assurance AdidasHoraires Cinéma

“Assurance”Part des recherches en provenance des Smartphones / France

“Assurance”Part des recherches en provenance des Smartphones / France

5,9%

11,2%

17,8%

28,6%

38,8%

0

0,05

0,1

0,15

0,2

0,25

0,3

0,35

0,4

0,45

oct-12 oct-13 oct-14 oct-15 sept-16

“Adidas”Part des recherches en provenance des Smartphones / France

“Adidas”Part des recherches en provenance des Smartphones / France

10,8%

17,5%

27,7%

42,1%

51,5%

0

0,1

0,2

0,3

0,4

0,5

0,6


“Horaires Cinéma”Part des recherches en provenance des Smartphones / France

“Horaires Cinéma”Part des recherches en provenance des Smartphones / France

25,7%30,2%

39,9%

53,3%

61,9%

0

0,1

0,2

0,3

0,4

0,5

0,6

0,7


C’est plus grave que vous le ne

pensez !

Le mobile s’immisce partout !

Source : Flurry Analytics, Consumer barometer 2015

Le mobile s’immisce partout !

87%des personnes qui regardent la TV surfent sur d’autres terminaux digitaux en même temps (61% en France)

Les 2 modes d’usage multi-écran

- 26 -

Usage SéquentielPasser d’1 écran à l’autre pour effectuer une tâche

Usage SimultanéUtiliser différents écrans pour un usage

complémentaire ou non

Multi-tasking – Activités différentes Usage Complémentaire – Activités reliées

Source : Think With Google

/ Les Smartphones sont utilisés en même tempsque d'autres médias

Les usages multi-écrans

- 27 -

Source : Think With Google

Bousculant le parcours d’achat !

Mobile et Parcours d’achat

La conversion = Un casse tête

37% des transactions en « cross-device »

Source : http://www.criteo.com/media/3748/criteo-state-of-mobile-commerce-q4-2015-ppt.pdf

Conversions sur TOUS les écrans

Sessions sur TOUS les écrans

Les consommateurs sont multi écrans

et les utilisent tous pour accéder

à votre site avant l’achat

Quand ils veulent faire un achat,

ils le font sur un seul écran

Les performances sont reflétées

par le CvR Multi-Ecran

SESSIONS CONVERSIONS MULTI-DEVICE CVR

Un nouveau KPI fait sensLe taux de conversion Multi-Ecran

Only-Mobile / Only-APP !

20% des « millenians » sont Mobile-Only !

>50% des indiens sont Mobile-Only !

In-App;

85,70%

Mobile Web;

14,30%

US / Sept. 2016

2015


2. Optimiser son site pour les usages mobiles

Sites ou Applications ?

du temps Mobile sur les apps ?

Chiffre

TROMPEUR

C’est un monde

à 2 faces !

La réalité

Les APPs > Un monde d’« Happy

Few » !

Tout le monde n’a pas besoin d’une

APP.

Le web mobile reste un passage obligé et complémentaire aux

APPs.

RARES SONT LES ÉLUS :

95%des applications téléchargées sont

abandonnées dans les 30 jours

1APPapp téléchargée sur 4 n’est utilisée

qu’une seule fois

En France, 32 apps en moyenne installées,

12 utilisées régulièrement

Sites ou Applications ?

Temps ≠ Valeur

86%

14%

Temps passé

sur les sites

(US)

Temps passé

sur les apps

(US)

14%

40%

GAMING

& ENT.

28%

SOCIAL

18%

OTHER 66%SITES

6%

APPS

28%

SITES

& APPS

1ère source pour

les parcours

commerciaux

Temps passé sur les

appareils mobiles

Sources: Time spent stats: http://www.flurry.com/bid/109749/Apps-Solidify-Leadership-Six-Years-into-the-Mobile-Revolution#.U44l461dVX4;

Commercial task stats: Google/Ipsos Multiscreen Industry Study of 29k smartphone users across 9 industries (to be published).

Sites ou Apps ? Temps ≠ Valeur

2016 Retour en arrière !

Les APPs convertissent mieux…Encore faut-il être découvert et installé !

Source: Criteo State of Mobile Commerce Report Q4 2015

Site mobileDécouverte / Recherche / Occasionnel

APP Usage récurrent / Fidélisation / CRM / UX

Quelle techno pour son site mobile ?

Site Mobile Dédié

Responsive Web Design

Dynamic Serving

Le choix de la technologie

Mobile dédié

56

Responsive Web Design

57

Dynamic Serving / Adaptative

58

Techno Mobile

Source : https://developers.google.com/webmasters/smartphone-sites/details

Responsive web design

1 URL

Même code HTML / CSS

Dynamic Serving

1 URL

Code différent

Site Mobile dédié

2 URLs

Code différent

http://3.bp.blogspot.com/-RYJGq_t1YLY/UsKe2Rbd9BI/AAAAAAAAGOk/VVOyvJ1AaV8/s1600/chiffres-mobile.jpg

https://developers.google.com/webmasters/smartphone-sites/details

“Responsive design is Google’s recommended design

pattern.”

Août 2014

Google sait indexer les 3 technos à partir du moment où

elles sont correctement paramétrées.

Dynamic serving + compliqué à gérer

Deux applicatifs webs, deux jeux de code à maintenir et un outil d’aiguillage vers desktop

ou mobile mais peut être 100% compatible SEO

- 62 -

/!\ Redirections avec les sites mobiles dédiés

- 63 -

Tip 1 : Code 302 à renvoyer

Tip 2 : 404 si la page n’existe

pas en version mobile ou

desktop (pas l’idéal)

Un code responsive certes, mais un code correct

Attention à ne pas bloquer avec le robots.txt les ressources qui permettent à Google de

générer la rendition sur les différents dispositifs

Vérifier ce que donne vos pages à l’aide de l’outils « Fetch as Googlebot » de la search

console

- 64 -

/ Attention aux méthodes à la mode

Certaines techniques à la mode génèrent

tout le code en javascript pour faciliter la

création de pages responsive

Pb de SEO assurés

Il est recommandé de coder en suivant les

principes du :

-Progressive enhancement

-Et de l’unostrusive javascript

- 65 -

CSS

Javascript

HTML

ET mon APP ?

APP-Indexing

APP-Indexing > Des liens « Install » dans les SERPs Mobile

APP-Indexing > Des liens « Install » dans les SERPs Mobile

APP-Indexing > Des Boxs APPs proéminentes !

APP-Indexing > Des Boxs APPs proéminentes !

#1 Association APP/Site

#2 Paramétrage APP

#3 Deep Linking

Ne pas confondre !

App Indexing :

Consiste à

indexer une

application

dans les résultats

de recherche.

ASO :

Consiste à optimiser le

positionnement d’une

application dans les App

Store


3. Les spécificités de l’algode Google en usage mobile

Il n’y a pas d’index Mobile !Pour l’instant.

Les classements dans les pages de résultats mobiles

sont faits en analysant les contenus trouvés dans la

version desktop !

Changement d’algorithme

depuis le 21 avril 2015

Google déclasse les pages non compatiblesPour l’instant.

La compatibilité mobile est devenue un signal !

Toutes choses égales par ailleurs, entre deux pages, si une page n’est pas compatible mobile, elle sera classée derrière l’autre page.

21 Avril 2015

Label « Mobile-Friendly »

79

Eléments tactiles

trop proches

Affichage du

contenu non

adapté

Taille de la police

non adaptée

Vérifiez la compatibilité de votre sitehttps://search.google.com/search-console/mobile-friendly

Nouvelle étape : le « popupgeddon »10/01/2017

La présence d’insterstitiels intrusifs conduira au déclassement de vos pages sur smartphone. Une étude SF montre que 38% des sites medias/information testés sont non conformes !

- 81 -

Next Step ?

Prise en compte de la

vitesse mobile ?

Prochaine étape : les performances ?La prise en compte du temps de chargement Mobile ?

SPEED UX

Prochaine étape : les performances ?La prise en compte du temps de chargement Mobile ?

Prochaine étape : les performances ?https://developers.google.com/speed/pagespeed/insights/

https://developers.google.com/speed/pagespeed/insights/

L’étape ultime ? L’index Mobile

Un index « mobile-only »

Desktop

TablettesMobile




Les pages AMP

AMP = AcceleratedMobile Pages

Bêta Oct. 2015 / Lancement 24 février 2016

AMP = La bataille pour un standard Mobile

AMP

Objectif = Instantanéité

« Instant. Everywhere. »

Poids des pages mobile

Source : http://www.webperformancetoday.com/2015/01/14/mobile-page-growth/ - Etude Radware Janvier 2015

> +110%

94

AMP

un code HTML revu (AMP

HTML)

des bibliothèques de scripts réduites

un système de cache spécifique

WWW RWD WWW AMP

Google Page Speed – Score « Vitesse Mobile »

WWW RWD57 / 100

WWW AMP94 / 100

+65%

Test Temps de Chargement (via WebPageTest.org)

WWW RWD11.146sFirst View

WWW AMP1.918sFirst View

-9,22 s

/ Adapté pour les news et les pubs, mais pas que…

- 100 -

Pages AMP

Démo AMP

Are you planning to begin inviting e-commerce sites to deploy the AMP code?

“Oh, absolutely, there’s nothing about the AMP format that doesn’t enable its use for all kinds of things. You could build an entire

website out of it.”

Source : Recode.net – 24/02

/

- 103 -

Pages AMP pour les sites ecommerce

Un projet ambitieux pour GG

Sites/blogs d’actusContenus

informationnels (Recettes, Films, …)

E-Commerce ?

AMP Adoption / Mai 2016


Le futur de la recherche mobile

Vers une forte adoption de la recherche vocale

Voice Everywhere

La recherche « visuelle »Chercher avec la caméra de votre smartphone

112

Voice + IA + Chatbots + DonnéesConversationnel / Prédictif / Personnalisé

114

Merci.

Des questions ?

Yann Sauvageon

@yahn