Responsive design, HTML5,… autant de concepts permettant notamment d’adresser la fragmentation des écrans (smartphone, tablette, PC, TV connectée) au travers desquels les consommateurs accèdent à votre marque digitale. Tour d’horizon des enjeux, des fonctionnalités clés (réseaux sociaux, SEO, SEM, geolocalisation, gestion du offline, adaptation du design) et des meilleures pratiques dans le développement de site internet mobile. Etudes de cas notamment sur PMU & Interflora récompensés par Google comme M site de l’année.

1. Les Slides de l’Expert
Si vous utilisez les informations de cette présentation, merci de citer le nom de l’entreprise et le nom de l’événement dans vos sources

2. USER ADGENTS
Nom et prénom: Renaud Ménérat
Titre: Co-Fondateur
Twitter: @rmenerat
Le Pitch > Développement HTML5 : les enjeux et best practices
Responsive design, HTML5,… autant de concepts permettant notamment d’adresser la
fragmentation des écrans (smartphone, tablette, PC, TV connectée) au travers desquels les
consommateurs accèdent à votre marque digitale. Tour d’horizon des enjeux, des
fonctionnalités clés (réseaux sociaux, SEO, SEM, geolocalisation, gestion du offline,
adaptation du design) et des meilleures pratiques dans le développement de site internet
mobile

3. Mobile First !
Site / Web app multi-écrans & HTML5
Renaud MENERAT – Président
@rmenerat
La French Mobile Day - 2 Octobre 2012 – 11h58

4. Qui sommes-nous?
userADgents est une agence conseil en marketing mobile
spécialisée dans la conception, le développement & la promotion
de webapps et d’applications nomades
pour Smartphones, tablettes, PC et TV Connectées
Une société 100% spécialisée sur les problématiques nomades multi-écrans
4

5. Pourquoi sommes-nous là à 11h58?
Une expertise sur le développement de sites / webapps optimisés pour le multi-écrans
5

6. Le multi-écrans pourquoi?
1 - L’audience
Un accès internet via de plus en plus de terminaux
Source : Lewebmarketeur
Les entreprises ont l’obligation d’offrir une expérience optimisée sur tous les écrans
6

7. Le multi-écrans pourquoi?
1 - L’audience
Fin 2012, 20 à 25% de votre audience digitale
Smartphones & tablettes
25%
PCs
Source : userADgents - 2012
Les entreprises ont l’obligation d’offrir une expérience optimisée sur tous les écrans
7

8. Le multi-écrans pourquoi?
1 - L’audience
67% des e-acheteurs ont un parcours d’achat séquentiel
Mono-écran
67% +
Multi-écrans
Source : Etude Google / Ipsos – Multiscreens - 2012
Les entreprises ont l’obligation d’offrir une expérience optimisée sur tous les écrans
8

9. Le multi-écrans pourquoi?
2 - La simplicité
Une problématique de déploiement et de maintenance
Smartphones Tablettes PCs
Une multiplication des versions rendant la mise à jour & le déploiement complexes
9

10. Le multi-écrans comment ?
1 – Exposer les données de l’entreprise
Mettre en place une couche de médiation / services web
API / Web Services (Json / Rest)
Simplifier le déploiement, permettre le développement d’applications web / natives
nt, permettre le développement d’applications web / natives
10

11. Le multi-écrans comment ?
2 – Simplifier l’échange & l’accès aux données
Séparer couche de présentation & données
HTTP
Site (mobile) M V C
HTML
HTTP
Webapp (mobile)
M V C
JSON
Déporter une partie de l’intelligence au niveau des clients
11

12. Le multi-écrans comment ?
3 – Au-delà du HTML5, s’appuyer sur des standard ouverts
Le web est mort, vive le web
• Une évolution du HTML (encore en Beta)
• 90% des navigateurs compatibles en 2016
• Gestion du cache
• Geolocalisation
• …
Oubliez les features phones & s’affranchir des frameworks& solutions propriétaires
12

13. Le multi-écrans comment ?
4 – Adopter le responsive web, une réponse à presque tout
Papa ours, Maman ours, Bébé ours
Taille de l’écran, touchgesture, orientation UI, fonctionnel,…
Source : Sparky hubs
Une seul code, mais une présentation (CSS) & un fonctionnel (JS) adaptés
13

14. Le multi-écrans comment ?
5 –Osez le Mobile first !
Optimiser votre développement en repensant votre site à partir du mobile
4 - Optimisez le chargement & donc le SEO (LAZY LOADING)
14

15. Pourquoi nous revoir après 12h10*?
Performance Conversion
+80% +35%
*Horaire sans engagement
15

16. En conclusion
La prochaine fois que vous repensez
…osez interroger une

17. merci Renaud Ménérat
 r.menerat@useradgents.com
 +33 (0)1 77 75 67 88
+33(0)6 86 18 51 24
www.useradgents.com