Résolution d'écran, Quelle largeur pour un site web?

[Cebastien]

Bonjour à tous,

Je viens d'être sollicité par une association sportive à laquelle je suis adhérent pour leur créer leur site internet.

Ceux que je gère déjà commençant à dater de quelques années et vu la vitesse d'évolution des matériels et notamment l'agrandissement des écrans, je me pose la question suivante :

La largeur du futur site étant fixe, quelle est la dimension à lui donner d'après vous pour une visualtisation optimale pour tous les visiteurs ou tout du moins la très grande majorité d'entre eux?

Les sites que je gère actuellement font 980 pixels de large, je pense que je peux agrandir sans trop de risque.

J'ai trouvé un article ici sur les statistiques de résolution d'écran qui tend à me conforter dans mon idée.

Il me semblait que Google Analytics donnait les résolutions d'écran des visiteurs mais je n'ai pas trouvé cette donnée, j'ai du rêver !!

Bref, quelle largeur de site me conseillez-vous?

Merci d'avance,

Seb...

[jcaron]

Dans Analytics: Technologie -> Navigateur et système d'exploitation -> Résolution d'écran.

Ce qui me donne des résultats très différents de ceux de l'article (il est possible que les iPads y soient pour quelque chose, mais leur gestion de la largeur de la page fait que ce n'est pas forcément un souci).

Il convient de noter quand même (comme l'un des commentateurs dans la page citée) qu'il peut y avoir une différence significative entre la taille de l'écran et la taille de la fenêtre. Quand on voit ce que ça donne avec des outils comme Clicktale (qui permettent d'enregistrer les sessions des visiteurs, et de les rejouer en taille réelle), on peut avoir de sacrées surprises.

Perso je pense que malheureusement, on n'est pas encore prêt d'abandonner le 900-et-des-brouettes pixels de large...

Jacques.

[Dadou]

La réponse aujourd'hui, c'est d'étudier ce que l'on appelle le responsive design, c'est un plus compliqué à mettre en place, mais un vrai bonheur pour les visiteurs quand c'est bien fait

[Ernestine]

De nos jours, les dimensions d'écran ne veulent plus dire grand chose, surtout sur les navigateurs mobiles. Si tu prends l'iPhone 4, la largeur physique (device width) retournée par l'appareil est de 320 pixels en mode portrait, mais sa largeur d'écran constructeur (screen width) en portrait est de 640 pixels, et la largeur du viewport, qui est une largeur virtuelle, est de 980 pixels avec Safari. Mais si tu utilises un autre navigateur, la largeur du viewport sera différente : les navigateurs Opéra pour mobile fixent tous la largeur du viewport à 850 pixels, quelle que soit la largeur physique de l'écran, qu'on soit en mode portrait ou en mode paysage.

Ce qui compte réellement c'est la largeur du viewport, qui par ailleurs peut être modifiée dans les méta (on peut fixer que la largeur du viewport = celle du device, ce qui est l'idéal pour une intégration responsive).

Bref, on va des plus petites résolutions aux plus grandes et si tu raisonnes avec des valeurs fixes tu vas vraiment galérer. Il vaut mieux regarder du côté du responsive design comme le dit Dadou, et faire un site parfaitement fluide, avec un comportement différent selon la largeur de l'écran. Ce n'est pas forcément évident à mettre en place, ça demande notamment une bonne connaissance de la part du graphiste, qui doit savoir ce qu'il est possible de faire. Car faire un design responsive ne se résume pas à pondre deux versions (une petite et une grande).

[Cebastien]

Merci pour vos réponses. Il ne me reste plus qu'à étudier le "responsive design" !!

Pour ce qui est des différences entre les résultats de l'article que j'ai cité et ce que l'on trouve sur nos stats G.A. (d'ailleurs merci Jcaron pour le guide, j'ai bien retrouvé, je n'avais pas rêvé lol) celà peut venir de la différence de cibles entre deux sites différents.

Je ne peux pas vraiment me baser sur les stats de mes sites car le nombre de visiteurs est vraiment bas, ce qui rend les résultats peu significatifs, mais ils sont dirigés vers des publics précis et bien différents, et je me rends compte que les résultats tant au niveau de la résolution d'écran que pour les navigateurs utilisés par exemple sont vraiment différents, et mêmes parfois étonnants.