Google recommande le Responsive Design pour les sites mobiles

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par JanoLapin, 8 Juin 2012.

  1. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
    D'après l'article suivant (en allemand) consacré aux conseils de Google pour le SEO des (versions de) sites pour mobiles, le Googler Pierre FAR aurait donné pour la première fois des instructions claires à ce sujet, à l'occasion des rencontres SMX Advanced qui se tiennent en ce moment.

    Google préconise d'utiliser dans la mesure du possible le Responsive Design (adaptation dynamique à la taille de l'écran via la CSS), sous une seule url. En cas d'impossibilité, il faut alors appeler du code html spécifique à chaque appareil, en se basant sur le user-agent respectif du visiteur.

    L'utilisation d'urls spécifiques pour les versions mobile et desktop ne seraient donc recommandées qu'au cas où les deux ne seraient pas implémentées ensemble (cf. rel=alternate)


    Source originelle / complémentaire:
    http://searchengineland.com/google-finally-takes-a-clear-stance-on-mob ... ces-123543
     
  2. -Romu-
    -Romu- WRInaute occasionnel
    Inscrit:
    19 Avril 2012
    Messages:
    280
    J'aime reçus:
    0
    Hello,

    Une question bête, en utilisant le responsive soit html5 visé...
    L'intérêt est de masquer des bloc de son site Web pour un affichage Mobile.
    Soit => display:none;

    N'y aura-t-il pas un impact avec le référencement avec Google, Bing... ?
     
  3. fredfan
    fredfan WRInaute accro
    Inscrit:
    2 Juillet 2008
    Messages:
    2 868
    J'aime reçus:
    2
    On peut masquer quelques détails, mais en principe le contenu textuel reste en grand partie.
    L'idée c'est surtout de déplacer les éléments entre eux pour qu'ils prennent des emplacements plus pratiques
     
  4. SpeedAirMan
    SpeedAirMan WRInaute passionné
    Inscrit:
    2 Juin 2007
    Messages:
    2 391
    J'aime reçus:
    0
    On peut faire un design "responsive" sans utiliser un seul "display:none;".

    Comme d'habitude : si Google remarque des abus, il sanctionnera (exemple d'abus: contenu visible uniquement sur les appareils ayant une définition supérieure à 4000px).


    Merci d'avoir relayé l'info JanoLapin !
    L'info ne me surprend pas : le responsive design est actuellement la meilleure solution (amha) pour adapter les sites à diverses résolutions (et donc différents appareils).
     
  5. anemone-clown
    anemone-clown WRInaute passionné
    Inscrit:
    11 Novembre 2007
    Messages:
    1 599
    J'aime reçus:
    20
    Nous étions quelques-uns à une session de formation Google Adsense cette semaine à Paris, et l'aspect mobile a été fortement mis en avant : la consigne qui nous a été donné pour réaliser des versions strictement mobiles des sites est de mettre la version mobile dans le sous-domaine "m." au lieu de "www." comme m.webrankinfo.com si WRI avait un site purement mobile. Avec ce sous-domaine, il n'y aura pas de DC (duplicate content) chez Google (mais pas garanti avec Bing...). Evidemment, sur un site comme WRI avec des sous-domaines pour séparer les grandes parties du site (forum, dossiers, annuaire,etc.), ça peut vite coincer. Ceux qui ont utilisé des répertoires pour hiérarchiser normalement leur architecture seront avantagés sur ce point.

    Au niveau adsense, ils recommandent d'avoir 2 versions totalement distinctes des sites... en allant à l'essentiel.

    Bref : encore 2 sons de cloches différents en fonction des diverses sources "Googliennes".

    A noter le lien Google sur les recommendations pour sites mobiles : http://googlewebmastercentral.blogspot.fr/2012/06/recommendations-for- ... phone.html
     
  6. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
    Petite info connexe (qui date de plusieurs jours déjà), le W3C vient d'eccepter les media queries comme norme.

    ' sont qd même malins chez Google. A moins qu'ils n'aient eu l'info avant moi :mrgreen:
     
  7. SpeedAirMan
    SpeedAirMan WRInaute passionné
    Inscrit:
    2 Juin 2007
    Messages:
    2 391
    J'aime reçus:
    0
    J'ai vu ça aussi hier

    Comme je disais plus haut, y'a rien d'étonnant à ça, actuellement c'est quand même une technique qui possède beaucoup d'avantages !

    L'avenir ça sera qq chose comme le responsive design, mais avec des possibilités avancées plus accessibles qui permettront notamment de ne pas avoir à télécharger tous les éléments d'une page à chaque fois (ex: un site "responsive" visualisé sur un appareil mobile télécharge également les contenus qui ne sont accessibles qu'à la version "desktop"). C'est actuellement possible mais pas aussi simple à mettre en place(à base d'Ajax par exemple).
     
  8. zeb
    zeb WRInaute accro
    Inscrit:
    5 Décembre 2004
    Messages:
    12 192
    J'aime reçus:
    1
    Ou tu attend deux trois ans que la techno des écran monte en puissance pour qu'on ai plus affaire à Des "timbre poste".

    Il a pas fallu attendre longtemps pour passer des 640x480 et 800x600 sur les écran classiques à plus de 1024 de large bref ça devrait pas trainer et en ce cas on aura rien a changer (bon ok je suis en mode grosse flemme mais ça me saoule les éternelles adaptations pour une techno ou un autre).
     
  9. SpeedAirMan
    SpeedAirMan WRInaute passionné
    Inscrit:
    2 Juin 2007
    Messages:
    2 391
    J'aime reçus:
    0
    Je ne partage pas ton point de vue.

    Les dernières années ont plutôt vu de plus en plus de résolutions différentes plutôt que de moins en moins, et à mon avis ça ne va pas changer tout de suite.
    Certes, les résolutions augmentent (la "base" pour un ordinateur de bureau n'est plus 1024, ouf !), mais surtout elles se multiplient. Il faut penser aux tablettes low cost en 800x600 (ça existe... si si), voire 1024x600, et ça il en existera toujours ou aux téléphones smartphone low cost. Tant qu'il y'aura des résolutions différentes, le responsive design y apportera une solution.


    Pour info, le 1280px (1170 ou 1140px de large pour le site) se démocratise.

    /CSB : je développe un site "responsive" actuellement, dont la largeur par défaut(si on peut dire) est 1170px de large, et qui s'adaptera en 1024, 800 et 480. En bref, on peut déjà développer des sites "larges" pour profiter de la largeur des écrans de bureau, et je ne peux qu'encourager les développeurs et webdesigners à travailler en ce sens pour un meilleur confort des internautes.
     
  10. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
    +1 speed airman

    On peut même aller plus loin: inversement à la miniaturisation des appareils, il faut aussi compter avec ceux dont l'écran grandit de plus en plus, comme les écrans de PC, par ex., ou ceux qui sont de plus en plus connectés: les TV, l'affichage distant, (les frigidaires intelligents ?), toussa...
     
  11. XoSt
    XoSt WRInaute passionné
    Inscrit:
    6 Octobre 2003
    Messages:
    2 231
    J'aime reçus:
    0
    Frigidaire font encore des réfrigérateurs ?
     
  12. Koxin-L.fr
    Koxin-L.fr WRInaute passionné
    Inscrit:
    15 Janvier 2012
    Messages:
    1 891
    J'aime reçus:
    8
    Bonjour,
    Ca reste tout de même illusoire.
    800px sur PC et sur mobile, c’est pas la même chose.
    Le pitch va très vite diminué pour les mobile pour offrir des résolution énorme mais les écran ne ferons jamais 15''.
    T'aura beau gérer la résolution, un site en 1280 sur PC est ... illisible sur une ecran 1280 de mobile.


    Sinon, je relève des choses qui me font m'interroger.

    Déjà, que le Responsive Design existe depuis la nuit des temps et qu'il n'est pas si utilisé que cela pour des raisons technique, mais aussi de confort. (Mon tout premier site en 1999 était comme cela... mon dieu quelle horreur...)

    Alors, les puristes et accro du tout élastique me diront non, mais pour moi, un site (à part pour des sites avec mise en page ultra simpliste) se doit d'exister en 2 versions. Une pour les PC, une pour les mobiles.

    Le coup du sous-domaine m, pourquoi pas. Mais y a pourtant le .mobi fait à l'origine pour cela.

    Rod
     
  13. zeb
    zeb WRInaute accro
    Inscrit:
    5 Décembre 2004
    Messages:
    12 192
    J'aime reçus:
    1
    Je comprend pas bien. Pour moi une norme "passe partout" est encore (mais bon je peux débloquer ça m'arrive) de dev les site en environ 1000px de surface utile (mettre plus quand on lit que 300 / 500 mots est une norme en rédaction de contenu frise le suicide au passage :wink: )

    Bref le "responsive" est il la pour adapter l'affichage au petits écrans ou pour offrir une visibilité XL au machines de bureau ? car si la norme tend vers les 1170px comme tu le souligne pourquoi s'affoler les méninges avec ça ?

    Ensuite pour la téléphonie "low cost en 800x600" cela vaut il le coup de se prendre la tête pour des système surtout dédiés a faire de la téléphonie familiale "over méditerranéenne" (entre autre) sachant que la clientèle est surement pas composée de surfeurs (a quelques exception près lié a la thématique des sites par exemple).

    Bref dubitatif ... mais ouvert a ton avis qui semble éclairé.

    Assez d'accord avec ça dans la mesure ou mes petites icônes en 16 16 dédiées a dérouler un contenu sur un 800 x 600 il faut le mode loupe pour les voir et le système en lui même n'est pas adapté donc une version élastique c'est bien pour les screen shoot mais pour la fonctionnalité nada ...
     
  14. YoyoS
    YoyoS WRInaute accro
    Inscrit:
    14 Septembre 2006
    Messages:
    3 249
    J'aime reçus:
    0
    Je suis du même avis que Koxin-L. Il est illusoire de penser qu'on peut faire un même site pour toutes les plateformes. A moins que son site ne contienne même sur pc qu'un bloc de texte sans design, là c'est autre chose ...

    Il suffit de regarder les sites mobiles très connus sur lesquels vous préférez surfer. Imitez-les, ils ne font pas de responsive design.
     
  15. anemone-clown
    anemone-clown WRInaute passionné
    Inscrit:
    11 Novembre 2007
    Messages:
    1 599
    J'aime reçus:
    20
    Idem Koxin-L : il est obligatoire d'avoir 2 sites et ce n'est pas le Responsive Design qui va permettre d'obtenir des liens cliquables avec le pouce d'un bûcheron (la règle du lien cliquable sur un mobile : il doit être cliquable avec le pouce sans agrandissement!) sur un écran de téléphone, à moins qu'on revienne aux cabines téléphoniques portables qu'on avait avec Radiocom 2000...

    J'ai eu mon premier IBM PC/XT en 1983 (ça valait pas loin de 60.000 francs français, soit près de 10.000 €, avec une imprimante matricielle 9 aiguilles - c'était grosso-modo le prix d'une BMW 320i de l'époque!) avec écran couleur et résolution 320x200 ! Le 1024 a du apparaître en 1998 je crois (peut-être même avant? j'étais en Afrique en 1999 et j'avais déjà des écrans 1024). Conclusion, ça fait près de 15 ans qu'on se base sur du 1024. Belle évolution... :mrgreen:

    Pour les téléphones, la taille du pitch va baisser et donner de belles résolutions "potentielles" mais la taille du pouce d'un homme ne va pas rétrécir...
     
  16. fredfan
    fredfan WRInaute accro
    Inscrit:
    2 Juillet 2008
    Messages:
    2 868
    J'aime reçus:
    2
    Je ne développais qu'en "élastique" à la base. J'ai arrêté parce qu'il y a trop d'éléments en pixels (vidéos, modules sociaux, etc..)
    Le responsive design n'a rien à voir avec l'élastique. Tout est en valeurs fixes mais ces valeurs changent à la demande. Ca reste donc très contrôlé (voire un peu rigide)
     
  17. Koxin-L.fr
    Koxin-L.fr WRInaute passionné
    Inscrit:
    15 Janvier 2012
    Messages:
    1 891
    J'aime reçus:
    8
    OK, mais au final, c'est quoi la différence entre une div en 35% qui change à la demande en fonction de la taille de la fenêtre et une div en 200px qui change à la demande en fonction de la taille de l'écran ?

    C'est juste une question de mot et de manière de concevoir un design. La finalité est la même, trop casse bonbon. :)

    Rod
     
  18. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
    inversement, je partage l'avis précédent, selon lequel un site est tout de même fait pour un type d'écran, et qu'il ne peut y avoir de site "universel", cad qui fasse sens pour toute définition possible. C'est le principe même du design, me semble-t-il.
     
  19. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
  20. zeb
    zeb WRInaute accro
    Inscrit:
    5 Décembre 2004
    Messages:
    12 192
    J'aime reçus:
    1
    Tu connaitrait pas un "navigateur" qui s'installe sur PC et qui donne un rendu type Mobile par hasard ? (je constate un accroissement régulier des visites mobiles donc je me tâte a passer a une version mobile)
     
  21. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 028
    J'aime reçus:
    291
    @Zeb:
    Avec la barre webdevelopper: Resize > View Responsive Layouts.
    ou
    Dans le débuggeur de Chrome (F12), dans les paramètres (roue dentée en bas à droite) => Overrides => User Agent (et le device metrics s'adaptera).
     
  22. JanoLapin
    JanoLapin WRInaute accro
    Inscrit:
    21 Septembre 2008
    Messages:
    4 250
    J'aime reçus:
    0
  23. zeb
    zeb WRInaute accro
    Inscrit:
    5 Décembre 2004
    Messages:
    12 192
    J'aime reçus:
    1
    Merci a vous deux.
     
  24. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 414
    J'aime reçus:
    0
    http://iphone-simulator.softonic.fr/
     
  25. viggo
    viggo WRInaute discret
    Inscrit:
    27 Avril 2006
    Messages:
    103
    J'aime reçus:
    0
    Merci spout pour avoir expliqué comment simulé un small device avec Chrome : l'option "Fit in window" donne un rendu réel (à priori, j'ai pas testé).

    En tout cas avec cette option on à l'impression que les pixels sont divisés par 2 et donc tout rapetisse, ce qui devient illisible sans zoom - damned !

    Sinon pour émuler il y a le très pratique http://emulateurmobile.com/
     
  26. viggo
    viggo WRInaute discret
    Inscrit:
    27 Avril 2006
    Messages:
    103
    J'aime reçus:
    0
    Euh d'ailleurs, en début de topic quelqu'un semblait dire que le display:none pouvait être nuisible au référencement.

    J'imagine que Google peut assimiler cela à du cloaking, mais la gestion du display est très pratique en CSS pour faire plein de choses, faut-il s'en priver ?

    Je sais qu'avec une gestion du max-height on peut simuler le display mais à ce compte là j'imagine que google l'interprète de la même manière.

    Perso j'utilise beaucoup le display:none pour mes versions responsives, est-ce que cela peut nuire à mon ref ? :?:
     
  27. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 414
    J'aime reçus:
    0
    je l'utilise aussi pour tous mes sites ayant des menus déroulants css, sans aucun problème seo depuis des années
     
  28. viggo
    viggo WRInaute discret
    Inscrit:
    27 Avril 2006
    Messages:
    103
    J'aime reçus:
    0
    Cela me rassure, merci :)
     
  29. teleatlantic
    teleatlantic Nouveau WRInaute
    Inscrit:
    27 Décembre 2008
    Messages:
    3
    J'aime reçus:
    0
    Bonjour
    A titre d'info nous gerons un site qui fait la promotion d'artistes en video Nous avons été oblige de faire deux sites différents
    pour le net http://www.tele-atlantic.com
    pour les mobiles et tablettes http://www.tele-atlantic.com/teleatlantictab.htm
    A savoir qu'il est vrai que maintenant presque le tiers des connexions sont realisees pour les mobiles et tablettes...
     
  30. teleatlantic
    teleatlantic Nouveau WRInaute
    Inscrit:
    27 Décembre 2008
    Messages:
    3
    J'aime reçus:
    0
    juste oublie de vous dire qu'on avait teste l'affichage avec http://emulateurmobile.com/ ...nickel.....
     
Chargement...
Similar Threads - Google recommande Responsive Forum Date
Référencement url sur Google - Affichage positions sur mobile différents d'un OS à un autre ? Référencement Google Hier à 16:47
Publication dans Google Actualités Référencement Google Jeudi à 07:31
Google Chrome et gestion des cookies Google : l'entreprise, les sites web, les services Mardi à 17:58
Installer un évènement sur Google Analytics Google Analytics 31 Juillet 2020
A lire si Google refuse d'indexer toutes vos pages pourtant indexables Crawl et indexation Google, sitemaps 22 Juillet 2020
Disparition pages résultats Google Débuter en référencement 21 Juillet 2020
Google search console: Mots clés bien positionné mais site invisible dans les résultats google Problèmes de référencement spécifiques à vos sites 15 Juillet 2020
Chute brutale du taux de rebond dans Google Analytics Google Analytics 15 Juillet 2020
Impact en SEO Google si on n'est pas propriétaire du nom de domaine Noms de domaine et référencement 14 Juillet 2020
Moteur de recherche interne Google Développement d'un site Web ou d'une appli mobile 10 Juillet 2020
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice