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

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. 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

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.


Nos dernières vidéos

32 commentaires

  1. 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 🙂

  2. 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.

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

  4. Eric

    @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

  5. 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 🙂

  6. 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.

  7. 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.

  8. 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.

  9. 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.

  10. 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 !

  11. @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…

  12. @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.

  13. @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 🙂

  14. @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 ?

  15. @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…

  16. @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…

  17. @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.

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

  19. 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 !

Répondre