Bientôt, nous serons plus nombreux à accéder à Internet via un écran mobile que via notre PC… L’accessibilité de votre contenu sur les plateformes mobiles est donc, aujourd’hui, un enjeu majeur. Time Magazine l’a bien compris, lui qui est passé, ce lundi 22 octobre, au responsive Web design avec des versions optimisées pour smartphones et tablettes qui offrent même l’accès aux archives remontant jusqu’en 1923! Time.com est d’ailleurs le premier grand site d’information à franchir le pas. Un contenu unique qui s’adapte à toutes sortes et toutes tailles de supports : la convergence frappe à nos portes soutenue par le responsive Web design et l’avènement du langage de programmation HTML5 aux  nouvelles fonctionnalités résolument innovantes. Le département communication de Vanksen  - Vicky Balnave, Marie-Magali Sarry et Christophe Dos Santos - décrypte pour VOUS les forces en marche avec des mots simples pour que la révolution de la convergence et de la mobilité soient embrassées par le plus grand nombre.

1. Etes
vous
prêts?
Convergence et mobilité des contenus :
enjeux et intérêts
Encore silencieuse, une révolution sourde

2. Regardez attentivement vos sites Web et mobiles,
d’ici 1 an, ils n’auront plus la même tête.

3. Résumé
Encore silencieuse, une révolution sourde.
Un contenu unique qui s’adapte à toutes sortes et toutes tailles d’écran :
la convergence frappe à nos portes soutenue par l’avènement du langage de
programmation HTML5 et ses nouvelles fonctionnalités résolument innovantes sur mobile.
Le département communication de Vanksen décrypte les forces en marche,
avec des mots simples, pour que la révolution de la convergence et
de la mobilité soient embrassées par le plus grand nombre.
Soyez
Prêts!

4. Aujourd’hui,
les supports se multiplient à tire-larigot.Les entreprises entrent dans une
course effrénée pour développer une multitude d’applications afin que
leurs contenus soient consultables sur tous ces supports.

5. Ce qu’il faut savoir sur les supports*
Chaque support a ses contraintes :
taille et définition d’écran,
format : paysage ou portrait,
débit Internet : Wifi ou 3G,
navigation : tactile ou souris
Et chaque support requiert
autant de contraignantes mises à jour.
*On parle aussi de plateformes, de terminaux, ou encore d’écrans.

6. Immanquablement, tout ceci prend du temps, beaucoup de temps
I’m in
a hurry

7. Et comme l’a judicieu- Quid des PME
sement remarqué qui ne peuvent pas se
Benjamin Franklin permettre de dégager
au 18e siècle (déjà) un budget conséquent
« le temps, c’est de pour s’assurer une
l’argent ». présence globale ?
Quid des Mais aussi,
des contenus
entreprises déconnectés les uns
qui n’ont pas de temps des autres, est-ce
à perdre pour mettre à vraiment logique dans
jour tous ces contenus un monde justement
éclatés ? connecté ?

8. Haro sur l’injustice et
l’incohérence !
La révolution de la convergence
est en marche...

9. Demain,
t
ul e nu !
U n se onte
c
q ue
uni
les entreprises qui le veulent auront
1 seul et unique contenu
pour l’ensemble des supports
sur lesquels elles souhaitent
être présentes.

10. Merci qui ?
esign!
e Web d
es ponsiv
Mer ci le r
Merci HTML5!
Pardon...qui ?

11. Responsive Web design: quèsaco ?
« Un site dit responsive s’adapte automatiquement au terminal
sur lequel il est consulté : quantité et taille des textes, format
des images, organisation et agencement des contenus... En
détectant la largeur de votre écran ou navigateur, il devient
possible de déterminer quel type d’affichage sera le plus
approprié. »
Jérémie Cook dans atlantico.fr, 20 août 20122

12. Depuis le 21 octobre 2012, le Time Magazine s’est mis au responsive Web Design

13. HTML5: quèsaco ?
H HTML L5 est une terminologie ombrelle qui englobe :
HTML
HTML est le langage de programmation (balisage hypertexte) qui permet de structurer
et de présenter le contenu des pages Web.
a plus de 20 ans. Au début, ce langage était rudimentaire et comprenait
des lignes de texte, des liens et des images.
est en constante évolution, chaque nouvelle version de sa norme apporte
son lot de fonctionnalités et d’améliorations supplémentaires.

14. HTML5 : quèsaco ?
Puis, la page Web est devenue
dynamique grâce à l’invention
du langage de script JavaScript,
et encore plus dynamique avec
JavaScript XHR.

15. HTML5 : quèsaco ?
Avec l’arrivée des feuilles de style en
cascade, les fameuses CSS, les pages Web
sont également devenues plus vivantes.
Elles améliorent l’esthétique des pages avec
notamment des couleurs, des coins
arrondis, des dégradés et des animations.

16. HTML5...
Le nouveau standard universel Web et mobile ?
Il y a des chances.

17. Quel intéret pour les entreprises ?
+ de sens :
HTML5 introduit de nouvelles balises pour aider le navigateur et les moteurs de recherche
à déterminer la sémantique d’une page.
A noter que l'analyse des pages par des robots ou par des synthétiseurs vocaux sera facilitée.
+ pratique :
Fonction « glisser-déposer » : chaque élément d’une page peut-être déplacé dans le navigateur
Fonction « hors connexion » : permet de continuer à travailler sans connexion à Internet
Fonction « local storage » : pour stocker facilement des informations dans le navigateur
...

18. Quel intéret pour les entreprises ?
+ de géolocalisation:
Si l’utilisateur a donné son feu vert, le navigateur est en mesure de fournir les coordonnées
de l’utilisateur telles que sa latitude, sa longitude et son altitude. Il est même possible
de déterminer la vitesse à laquelle il se déplace !

19. Quel intéret pour les entreprises ?
<video>
Cette balise intègre directement un lecteur vidéo dans la page, avec des boutons
Lecture, Pause, une barre de progression, du volume… en fait, un petit Youtube plus
vrai que nature dans la page et natif au navigateur.
<audio>
La balise audio c’est grosso modo trois lignes de code pour avoir l’équivalent d’un
lecteur MP3.
<canvas>
Cette balise que tous les éditeurs de jeu attendaient comme le Messie est une surface
sur laquelle il est possible de tracer des formes et de les animer : en deux mots, de
réaliser des animations ou des jeux. Couplée avec le standard WebGL de rendu
3D, Canvas permet d’obtenir des résultats éblouissants au sein même du navigateur.
HTML5 fonctionne partout, à condition de télécharger une version récente de son navigateur.
Certaines fonctionnalités sont en cours d’adoption.

20. Quel intêret pour les entreprises
Réduction des coûts
Sécurité
Flexibilité
Mobilité
HTML5 fournit aux entreprises des avantages qu’aucun autre modèle
informatique n’est en mesure de lui apporter. C’est, en effet, un gain de
productivité évident que d’user d’un seul code source pour l’ensemble de ses
écrans.
18

21. Ils ont franchi le Rubicon

22. Responsive Web design & HTML5 :
de nouvelles techniques et bonnes pratiques, indépendantes mais
complémentaires, pour vous aider à relever le défi de la mobilité
et de la multiplication des écrans car les consommateurs
d’aujourd’hui et de demain sont des consommateurs connectés.
Soyez où vos consommateurs sont.
Soyez
Prêts.!

23. Contactez
nous!
Sur le web Nos agences
vanksen.fr France / +33 1 55 33 89 00
Twitter.com/vanksen Benelux / +352 48 90 90 100
Facebook.com/vanksen Suisse / +41 22 306 49 90
Pinterest.com/vanksen