Connect with us
Red top

Internet

ViewLike.us pour tester un site sur plusieurs résolutions d’écran

Il y a

le

Bien sûr il existe des plugins pour Firefox, et notamment l’indispensable Web Developper, mais pour ceux qui veulent avoir une idée de l’aspect d’une page web selon différentes résolutions d’écrans sans rien installer, voici ViewLike.us.

viewlikeus

Ce service web développé en Ajax permet de basculer entre différentes résolutions d’écran, de celle d’un iPhone à celle d’une Wii, puis de 800×600 à 1920×1200.

Utile pour visualiser un site dans une petite résolution, ou en tout cas dans une résolution inférieure à celle de son propre moniteur, ce service ne fonctionnera pas en sens inverse car il ne redimensionne pas l’image de rendu : si vous avez une résolution de 1024×780 et que vous voulez voir à quoi ressemblerait un site en 1400×900, ViewLike.us ne vous sera pas d’un grand secours.

32 Commentaires

32 Commentaires

  1. Pyksel

    29 juin 2009 at 7 h 26 min

    Merci !!!! 🙂

    Je connaissais un plug pour ie qui faisait ca mais impossible de remettre la main dessus 🙂

  2. jcfrog

    29 juin 2009 at 8 h 48 min

    oui pas mal, d’autant qu’après vérification ça fonctionne sur localhost, c’est là que c’est le plus utile pour le développeur 🙂

  3. Rockweb

    29 juin 2009 at 9 h 08 min

    Dans le même style il y a http://browsershots.org qui permet de visualiser un site web sur plusieurs navigateurs et OS différent sous forme de screenshot !

  4. coreight

    29 juin 2009 at 9 h 21 min

    pas de valeur ajoutée par rapport à Web developper, que tu cites, qui permet de plus de redimensionner à la taille exacte que l’on souhaite… inutile pour moi, contrairement à d’autres services qui permettent en plus de tester le rendu en simulant différents navigateurs et/ou systèmes d’exploitation.

  5. Aurélien

    29 juin 2009 at 9 h 27 min

    Bonne idée d’accéder au service pour visualiser un site en localhost !

  6. William

    29 juin 2009 at 9 h 46 min

    A l’instar de coreight je ne vois pas la valeur ajoutée de ce service par rapport à Web Developper sous Firefox ??

  7. Eric

    29 juin 2009 at 9 h 53 min

    @William : comme je le précise dans mon article, pas grand chose si ce n’est un accès rapide sans avoir à installer quoique ce soit

  8. jcfrog

    29 juin 2009 at 9 h 57 min

    et puis c’est marrant cet éternel « rien de nouveau ». C’est bien la diversité, c’est toujours différent. Un détail suffit parfois à préférer un service à un autre, même si les 2 se ressemble sur le fond.
    Plus y’en a mieux c’est 🙂

  9. Nicolas Laustriat

    29 juin 2009 at 10 h 04 min

    Pas top, ce que je reproche à tout ces outils c’est que ce n’est « juste » qu’un recadrage en pixel d’une taille d’écran. Mais pour certain site réalisé on peut être amené (comme moi) à revoir son style d’affichage (CSS) en fonction du browser (user agent) et de la taille d’affichage de l’utilisateur. Est ce quelqu’un connait un vrai simulateur/émulateur générique? blackberry en propose un sur son site et microsoft aussi pour les pocket pc…en fait ViewLike.us devrait recharger la page en simulant un agent et ce serait plus objectif.

  10. Galdon

    29 juin 2009 at 11 h 11 min

    Avant de cliquer sur le lien j’étais sceptique sur ce genre de service, mais je dois avouer que c’est bien foutu :

    Rapide grâce à l’ajax, avec des transitions et tout et tout, et c’est très simple aussi, l’interface est dépouillée, sobre.

  11. Daniel

    29 juin 2009 at 11 h 32 min

    Hey,

    Sorry I don’t know any French! But this site DOES allow you to view what a site looks like in larger windows than the browser, thans to scrollbars, UNLIKE the firefox webmaster toolbar.

    Thanks,
    Daniel.

  12. Nomogo

    29 juin 2009 at 11 h 44 min

    Rien de nouveau par rapport à Web Developper, certes peut-être, mais perso :
    1/ j’ignorais la fonctionnalité dans Web Developper
    2/ Presse-citron présente un site dont c’est la fonctionnalité principale, et très efficace pour le coup.

    Franchement, des fois, il y a juste à dire: « Merci, ça fait zizir 🙂 « .

    Donc je le dis: merci, ça fait zizir.

  13. Alias+Docteur+House

    29 juin 2009 at 14 h 01 min

    d’où l’interet de créer une interface qui puisse s’adapter partout.
    on peut utiliser des gabarits élastiques. on peut aussi faire comme moi :
    en haute résolution (à partir de 1600×1200)la page d’accueil du site donne toute sa splendeur

    en dessous de cette résolution et jusqu’à 1024×768 même si l’affichage du bas est tronqué, ça reste agréable à regarder.

    et même si vous passez en 800×600, on peut se passer de la sidebar extérieure qui est rétractable.

    j’ai mis l’accent sur l’ergonomie de façon à ce que le visiteur puisse avoir accès aux infos principales (featured content en flash + les 4 derniers articles) et ce, sans trop de superflu.

    Oui je sais, je suis un génie de l’ergonomie.
    prosternez vous devant sa grandeur Messieurs les noobs !

    ps : oui je sais le flash caylemal !

  14. Pyksel

    29 juin 2009 at 14 h 06 min

    @Alias+Docteur+House : Par contre temps de chargement… Lamentable, du coup je ne me prosterne pas ^^ (humour humour)

    Sinon : Trés joli

    Seul hic, la barre de menu latéral qui est inavigable… Si on passe la souris et qu’on remonte c’est un autre menu qui se déploie…

  15. Alias+Docteur+House

    29 juin 2009 at 14 h 23 min

    @pyksel : ah oui tu as déjà essayé de faire fonctionner WP avec 60 plugin activés toi ? ^^’
    par contre j’ai pas mis de super cache, pas de compression à la volée, juste une optimisation des codes JS, PHP et CSS mais ça ne suffit pas.

  16. Pyksel

    29 juin 2009 at 14 h 30 min

    @Alias+Docteur+House : pour 700€ H.T. je te le transforme en avion de chasse supersonique qui va plus vite que superman et bob l’éponge réunis ! ^^

    Et en prime je t’offre un porte-clef de snoopy 🙂

  17. fred

    29 juin 2009 at 16 h 46 min

    Pas mal ça peut servir pour voir très rapidement le resize des éléments de page, mais vite limité quand même à bookmarker.

  18. Alias+Docteur+House

    29 juin 2009 at 16 h 59 min

    @Pyksel : je te signale que ton blog n’est pas super rapide non plus de chez moi (connection en 56K lol) alors je crois que je vais investir mes 700 Euros sur autre chose ^^’

    ps : euh t’as pas plutôt un porte-clef playboy ?

  19. Mpok

    29 juin 2009 at 17 h 14 min

    @Alias : les gabarits élastiques sont « en théorie » la meilleure solution.
    Malheureusement, « dans la pratique », cela s’avère difficile à mettre en place..
    Tout dépend en fait du degré de contrôle que tu as sur le site en question : s’il s’agit d’un site « fixe » (genre site institutionnel ou vitrine), alors OK, tu peux pondre un css élastique qui va bien. Mais dès qu’il peut y avoir des interactions avec les utilisateurs (genre forum), c’est la merde, et franchement tu as tout intérêt à fixer la largeur dès le départ, sinon tu te retrouves à devoir gérer plein de cas particuliers, c’est vite l’enfer…

  20. Pyksel

    29 juin 2009 at 17 h 36 min

    @Alias+Docteur+House : Normal, qu’il soit lent 🙂 Y a 8 sites qui tournent sur ce serveur là 😉 Et en plus mon blog est under construction ^^ (oui je sais ca se voit ;))

    Un porte-clef play boy ? heu… Il m’en reste un… Mais il est collector…

    Plus serieusement. Je ne pretends pas faire tourner un blog vite au jour d’aujourd’hui. Mais j’ai pu optimiser magento de 15% en plus des 60% de gain qu’a proposé Varien…Là je m’atele au code wordpress pour une optimisation du cache… Donc pas encore gagné (vu que je débute en code wordpress – j’ai aps touché un blog de ma vie. J’étais dans Typo3 avant celà…). En fait je pense que le theme est la cause de tout. Cette architecture melangeant php/hmtl est pas des plus conviviale… Mais y a de quoi faire…

  21. Durable

    29 juin 2009 at 18 h 36 min

    Je viens de tester le lien, le site semble indisponible (trop de trafic ?)

  22. Alias+Docteur+House

    29 juin 2009 at 19 h 09 min

    @Pyksel : je crois que dans mon cas, l’utilisation abusive d’ajax (qui plus est, pas forcément visible dans le frontend) nuit au temps de chargement du site : n’étant pas spécialement développeur-codeur JS (malgré un passage éclair en sup-info, EPITA, mes notions de programmation sont vieilles de 20 ans…) j’utilise pêle mêle des plugins pas forcément compatibles les uns des autres et utilisant chacun ou presque des librairies différentes bien que j’ai pu en allèger quelques uns en les interprétant moi même.
    mon prochain défi sera de règler ce petit problème.

  23. Denis

    29 juin 2009 at 21 h 30 min

    Dans quelques temps, les inventeurs d’extensions Firefox vont trouver du pétrole… ainsi que ceux qui éditent Et commentent ce genre d’informations ! ;+)

  24. Smackitta

    30 juin 2009 at 0 h 57 min

    depuis le temps que je cherchais un tel service ! merci beaucoup pour la trouvaille !

  25. Patdebigorre

    30 juillet 2009 at 12 h 11 min

    merci pour cette info bien pratique !

  26. JOE

    1 août 2009 at 2 h 18 min

    Merci ERIC, c’est vraiment utile surtout pour un designer débutant comme moi !

  27. gridin

    1 décembre 2009 at 14 h 01 min

    Hey, tu te trompes, ou alors le site a changé depuis ton article : contrairement à Web Developper pour FF (que j’utilise), ViewLike.us permet de voir le rendu d’un site dans une résolution supérieure à la sienne.
    Et tant mieux, ça va m’être bien utile, merci !

  28. kartoch

    27 octobre 2010 at 10 h 53 min

    Vous savez si il est possible de combiner sur le même site woredpress une grande partie en statique et créer une petite partie blog ?

    • Eric

      27 octobre 2010 at 11 h 29 min

      @kartoch : oui bien sûr, tu as un menu « Pages » pour ça

  29. Estelle

    10 février 2012 at 18 h 48 min

    Très bien, vu qu’il n’y a de version Firesizer compatible avec Firefox 9!
    Merci

  30. darknote

    20 juillet 2012 at 18 h 49 min

    le site n’existe plus ??
    ViewLike

  31. noaneo

    14 août 2012 at 19 h 29 min

    un remplaçant à viewlike, en anglais par conte,

    http://testsize.com/

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Dernières news

Les bons plans

Les tests