web-dev-qa-db-fra.com

La taille de la fenêtre est-elle une contrainte de conception utile et comment les tailles de fenêtre sont-elles réparties?

J'essaie de soutenir ou de falsifier l'hypothèse selon laquelle la taille de la fenêtre d'affichage du navigateur de bureau est distribuée de manière multimodale (c'est-à-dire avec des "pics" dans la distribution qui pourraient créer des contraintes de conception de site Web utiles).

Des recherches sérieuses ont-elles été effectuées sur la taille des fenêtres de navigateur du bureau - si et quand les utilisateurs maximisent les fenêtres, comment les utilisateurs interagissent avec les grands écrans et toutes les données qui pourraient aider à cela?

Pour aborder spécifiquement un aspect de cette question: quelle est la relation entre la taille des fenêtres et la résolution de l'écran?

20
dhmstark

"... quelle est la corrélation entre la taille des fenêtres et la résolution de l'écran?"

C'est une question intéressante. Cette réponse est probablement un bon point de départ pour obtenir les informations que vous recherchez.

Je n'ai pas de données empiriques pour soutenir cela, mais j'imagine que la taille de la fenêtre d'affichage et la résolution d'écran divergent à mesure que la résolution d'écran augmente. Et il y a probablement une gamme distincte de résolutions d'écran à laquelle cette divergence entre en jeu.

Par exemple, sur les smartphones et les tablettes, d'après ce que j'ai vu, les fenêtres occupent toujours tout l'écran. Donc, avec ces appareils à faible résolution, résolution d'écran ~ taille de la fenêtre d'affichage. Pour les données sur la distribution de la résolution d'écran (et donc la taille approximative de la fenêtre d'affichage) parmi Android et smartphones et tablettes iOS, voir la section 'Résolution' vers la fin de http: // opensignalmaps.com/reports/fragmentation.php .

Avec un grand moniteur de bureau, la taille de la fenêtre d'affichage peut évidemment être beaucoup plus petite que la résolution d'écran. Cependant, je me suis simplement promené dans mon bureau, et l'écrasante majorité des gens ont maximisé la fenêtre de leur navigateur.

En ce qui concerne quand les utilisateurs maximisent la fenêtre de leur navigateur, je pense que les utilisateurs ont tendance à le faire lorsqu'ils sont dans un flux d'interface fluide/une interface rapidement réactive, et/ou lorsqu'ils se concentrent sur l'application . Par exemple, si les utilisateurs attendent plus de quelques secondes pour qu'une action se termine, ils peuvent redimensionner la fenêtre de leur navigateur pour permettre à un client de messagerie instantanée de discuter avec d'autres pour passer le temps. Inversement, si l'utilisateur travaille dans une application sans navigateur (par exemple, un éditeur de feuille de calcul), le navigateur peut être l'application que les utilisateurs développent jusqu'à, disons, la moitié de la largeur d'écran disponible en attendant une opération sur leur application principale. compléter.

Ainsi, la relation entre la taille de la fenêtre d'affichage et la résolution de l'écran peut dépendre légèrement de ce que votre application représente pour l'utilisateur: un moyen d'accomplir son travail ou un endroit où aller pour se distraire temporairement.

Le fait que les utilisateurs disposent de plusieurs moniteurs semble avoir également un effet sur la relation entre la taille de la fenêtre d'affichage et la résolution de l'écran.

Ce ne sont pour la plupart que de petites observations et spéculations. Il serait préférable d'avoir des données réelles à ce sujet.

Modifier :

"... y a-t-il des cas où la fenêtre d'affichage est plus grande que la résolution d'écran?"

Non; la taille de la fenêtre est toujours inférieure ou égale à la résolution d'écran.

La spécification CSS 2.1 indique que la fenêtre d'affichage est "une fenêtre ou une autre zone de visualisation à l'écran à travers laquelle les utilisateurs consultent un document", ou, en d'autres termes, la zone visible du document. Et la résolution d'écran est la largeur et la hauteur totales de l'écran de l'utilisateur. La zone visible d'un écran est toujours limitée par la largeur et la hauteur de l'écran, de sorte que la résolution de l'écran définit une limite supérieure sur la taille de la fenêtre.

La fenêtre d'affichage d'un navigateur Web est presque toujours plus petite que la résolution d'écran de l'utilisateur. Par exemple, même lorsqu'une fenêtre de navigateur est agrandie, la fenêtre d'affichage se trouve dans le navigateur chrome (les bordures et les widgets comme la barre de défilement et la barre d'adresse qui encadrent le document dans la fenêtre du navigateur). Navigateurs comme Chrome et Firefox ont cherché à minimiser la différence entre la résolution d'écran et la fenêtre d'affichage sur leurs produits de bureau au cours des dernières années. La fenêtre d'affichage est également presque toujours plus petite sur les navigateurs mobiles également. Dans les deux iOS et Android, une barre d'état du système d'exploitation (affichant les icônes de notification, le niveau de charge de la batterie, l'heure, etc.) est toujours située au-dessus de la fenêtre du navigateur. Je connais moins IE dans Windows Phone 7, mais cette image montre qu'il a un navigateur chrome sous la fenêtre).

La taille de la fenêtre d'affichage des navigateurs est presque toujours inférieure à la résolution d'écran. Sur les navigateurs de bureau, le seul cas où la taille de la fenêtre d'affichage et la résolution d'écran seraient égales serait lorsque l'utilisateur consulte le navigateur en mode plein écran, par exemple lorsqu'il regarde une vidéo, fait une présentation avec son écran transmis à un projecteur, ou peut-être jouer à un jeu.

Parce que l'immobilier visuel est si précieux sur les appareils mobiles, ils continueront probablement d'être à la pointe de la tendance vers la réduction de la différence entre la taille de la fenêtre et la résolution de l'écran en supprimant l'affichage du chrome du navigateur, des plateaux du système d'exploitation, etc. défaut.


Et pour revenir à votre question de base d'origine:

"J'essaie de soutenir ou de falsifier l'hypothèse selon laquelle la taille de la fenêtre d'affichage du navigateur de bureau est distribuée de manière multimodale ..."

Le graphique à barres ci-dessous, créé à partir de données à http://gs.statcounter.com/#resolution-ww-monthly-201111-201204-bar , montre que la part de marché mondiale de la résolution d'écran de bureau est multimodal . Notez les pics à 1024 x 768, 1280 x 800 et 1366 x 768.

Market share of desktop screen resolutions, 11/2011 through 4/2012

Le fait que la résolution d'écran du bureau soit multimodale ne signifie pas nécessairement que la taille de la fenêtre du bureau est multimodale, mais étant donné mes points ci-dessus, je pense que c'est une preuve indirecte que c'est souvent le cas.

17
jqp

quel est le lien entre la taille des fenêtres et la résolution de l'écran

La seule relation concrète est que la résolution d'écran = la taille maximale potentielle de la fenêtre.

À part cela, je ne sais pas s'il est logique de sur-analyser la corrélation.

Il est très plausible qu'il y ait des pics uniquement parce que a) beaucoup de gens maximisent les navigateurs et b) il y avait (traditionnellement, au moins) des résolutions d'écran courantes.

Cependant, comme nous sortons des moniteurs de plus en plus grands (encourageant ainsi les gens à NE PAS maximiser toutes leurs applications) ainsi que des moniteurs de plus en plus petits (téléphones, tablettes, etc.), les pics vont probablement devenir plus petits et plus nombreux.

1
DA01

L'optimisation d'un site Web pour une résolution ou une taille de fenêtre spécifique, même si l'optimisation est effectuée pour le top 2 ou 3, n'est pas une bonne idée à mes yeux. La conception doit être suffisamment flexible pour fonctionner avec un écran de bureau de 27 "ainsi qu'un netbook de 10" ou un écran de téléphone portable de 4 ".

Vous devez, d'autre part, définir une "barrière maximale" à partir de laquelle la conception n'est plus flexible mais reste fixe. La lisibilité du contenu diminuera si vous étirez la conception entière trop large.

Généralement, ces "barrières" changent très lentement. Il y a 5 ans, vous étiez plutôt en sécurité avec quelque chose entre 800 et 1024 px de largeur. Aujourd'hui, entre 1024 et 1280 px devrait fonctionner dans la plupart des cas, mais cela dépend fortement de l'utilisateur cible de votre site. Est-ce pour être vu par des jeunes qui naviguent principalement sur un smartphone ou est-ce que le public visé est plus du genre à travailler au bureau? L'affichage utilisé sera alors assez grand.

Vous devez vous demander qui utilisera le site d'où et quel appareil utilisera-t-il le plus certainement. Optimisez pour votre cas d'utilisation spécifique au lieu d'utiliser des statistiques générales comme base.

0
Michael

Lors de la conception de sites dans le passé, j'ai utilisé le Skeleton passe-partout pour gérer cela. Skeleton inclut automatiquement les requêtes CSS pour prendre en charge les tailles d'écran les plus courantes: iPhone portrait et paysage, iPad et écrans standard jusqu'à 960 px. Au fur et à mesure que la fenêtre du navigateur se redimensionne, le site s'adaptera.

Je ne sais pas si cela correspond à la prise en charge de votre hypothèse sur les "pics" de taille de la fenêtre, mais j'espère que cela vous aidera.

0
Jason Towne