Responsive Web Design : oui mais pas n'importe comment ! – SEO Camp Paris 2016

Responsive Web Design : oui mais pas n'importe comment ! – SEO Camp Paris 2016

Conférence donnée dans le cadre du SEO Camp Paris 2016, à Paris, autour des problématiques des projets Responsive Web Design.

Le Responsive Web Design est devenu une part importante de nos projets web. Plus un seul site ne peut voir le jour sans une stratégie mobile minimale. À première vue, le Responsive Web Design paraît de plus en plus simple à produire grâce à nos nombreux outils pourtant un projet RWD est en réalité semé de nombreuses embuches.
Gestion de projet, impact sur le référencement, perception de la performance : Ensemble, partons à la découverte de celles-ci !

Cette présentation est mise à disposition selon les termes de la Licence Creative Commons Attribution - Pas d’Utilisation Commerciale - Partage dans les Mêmes Conditions 4.0 International.

6362477fcff413a76db8da108fade362?s=128

Damien Senger

April 07, 2016
Tweet

Transcript

  1. RESPONSIVE WEB DESIGN : OUI, MAIS PAS N’IMPORTE COMMENT !

    Damien Senger · @iamhiwelo · SEO Camp’us 2016 · Paris
  2. et ça, c’est moi :) Damien Senger je suis designer

    & développeur web je suis passionné par la typographie web & WordPress j’ai créé mon studio hiwelo. et je travaille chez Alsacréations @iamhiwelo
  3. QUELQUES RAPPELS

  4. La « situation de mobilité » : cela ne veut

    plus rien dire…
  5. L’internet mobile a dépassé en usage
 l’internet desktop

  6. Le Responsive Web Design 
 n’est pas la solution unique

  7. • • UNE RÉALITÉ PLUSIEURS STRATÉGIES

  8. STRATÉGIE RESPONSIVE RETRO-FITTING

  9. On prend l’existant et on l’adapte pour le faire entrer

    dans le format mobile Crédit photo : zoetnet
  10. Le contenu n’est pas adapté au mobile… gros soucis de

    performance à l’horizon ! Crédit photo : Chris Keating
  11. STRATÉGIE MOBILE FIRST

  12. Le contenu est accessible quelque soit la plateforme

  13. Impose une réflexion globale 
 sur les contenus attendus et

    pertinents
  14. Création d’une interface efficace adaptée aux contraintes du mobile

  15. Au cœur du Mobile First : l’amélioration progressive Crédit photo

    : HannahLeePhotography
  16. Crédit photo : Marcus Lyra STRATÉGIE RESPONSIVE M-DOT SITE

  17. Un choix intéressant pour faciliter l’expérimentation et limiter la prise

    de risque Crédit photo : Paul
  18. On met en ligne un site mobile-first HTML en parallèle

    du site desktop existant Crédit photo : Alan English CPA
  19. Petit à petit, on développe les breakpoints du site mobile

    vers les écrans les plus larges Crédit photo : podluzny
  20. Être prestataire dans ce type de projet : flexibilité, itération

    & vision long terme Crédit photo : Davy Landman
  21. Budgétisation de ces projets : éviter que le projet cesse

    en cours de route
  22. UNE STRATÉGIE MOBILE : CELA NE S’IMPROVISE PAS ! Crédit

    photo : David Kasparek
  23. Prioriser ses contenus
 pour prioriser l’affichage

  24. Réfléchir ses breakpoints 
 en fonction du contenu Crédit photo

    : Luc Legay
  25. Quelle place pour les experts SEO dans ces projets ?

  26. Définir des objectifs de performance pour trancher en cas de

    conflit : design / développement / SEO
  27. RÉINVENTONS LES MODÈLES *

  28. Gestion de projet : la fin du modèle en cascade

  29. Au cœur du Responsive Web Design : la flexibilité et

    l’itération Crédit photo : timlewisnm
  30. Le Responsive Web Design c’est aussi la fin de la

    sacro-sainte maquette web le pixel pe ect n’a plus aucun sens aujourd’hui… Crédit photo : visualpun.ch
  31. LA PUBLICITÉ EN LIGNE : TOUT CASSER POUR RECOMMENCER

  32. Bannière, contenus, etc. : réfléchir cross-platform

  33. La publicité ne doit pas entraver 
 l’accès aux contenus,

    surtout sur mobile
  34. Adaptez vos choix publicitaires aux contraintes de vos utilisateurs

  35. Crédit photo : Trevor Devine RESPONSIVE RÉFÉRENCEMENT &

  36. SEO : Les experts, c’est vous ! Soyez en discussion

    permanente avec 
 les designers & développeurs Crédit photo : Ross Mayfield
  37. Google aime le
 Responsive Web Design

  38. Responsive Design is Google’s
 recommended design pattern. « »

  39. POURQUOI GOOGLE AIME-T-IL LE RESPONSIVE WEB DESIGN ?

  40. Une seule URL pour chaque contenu

  41. Un seul code source identique pour toutes les situations

  42. Cela réduit les erreurs de navigation Crédit photo : Tadson

    Bussey
  43. Les stratégies content first ou mobile first mettent en avant

    votre contenu (et donc sa qualité ou pas ;) )
  44. ENFIN, UN PETIT COUP D’ŒIL À L’ACTUALITÉ

  45. Accelerated Mobile Pages : une fausse bonne idée ?

  46. MERCI DE VOTRE ATTENTION :) Damien Senger
 @iamhiwelo hi@hiwelo.co Si

    vous avez aimé ce e conférence, je vous invite à suivre mon nouveau projet via Twi er : @WeAreRaccoon