Question

En supposant qu'une mise en page fluide ne soit pas une option (puisqu'il s'agit d'une discussion différente dans son ensemble), quelle est la largeur recommandée pour une mise en page de site? Quels sont les avantages et les inconvénients de différentes tailles?

Était-ce utile?

La solution

J'ai toujours gardé avec 960px tel qu'il est visible sur 1024x768 et qu'il est parfaitement divisible par 2, 3, 4, 5, 6, 8, 10, 12 , 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 et 480 ... afin que je puisse diviser la conception de mon site ( en utilisant la règle des tiers) proprement.

EDIT au bout de quelques années: Pensez à utiliser les requêtes multimédia CSS pour adapter votre contenu à la myriade de périphériques existants. maintenant si vous ne pouvez pas utiliser une mise en page fluide. Je ne suis pas sûr que l'on puisse revendiquer une largeur de pixel pour les maîtriser en 2012.

Autres conseils

Consultez http://browsersize.com pour obtenir quelques statistiques rapides sur les résolutions d'écran que les utilisateurs utilisent actuellement. Vous pouvez utiliser http://setmy.browsersize.com pour redimensionner rapidement votre navigateur afin d'émuler l'affichage de votre site Web à résolution d'écran particulière. Assurez-vous que votre mise en page respecte au moins la résolution d'écran la plus utilisée (1024 x 768).

De même, ne visez pas nécessairement à occuper le maximum d’espace horizontal. La largeur du texte (nombre de mots par ligne) ne devrait idéalement pas dépasser un certain seuil de convivialité:

  

À l'écran très commun 1024 & # 215; 768   résolution, la plupart des sites Web à disposition fixe   n’utilisez pas tout l’espace disponible pour le   à gauche et à droite de leur contenu.   Les agencements flexibles font un meilleur usage de   espace horizontal, mais lutte pour   maintenir des longueurs de ligne utilisables.   Les experts en convivialité nous ont dit que   il y a tellement de mots que vous   devrait mettre sur une ligne. Entre 8 et 12   les mots semblent être la ligne idéale   longueur. Les médias imprimés, en particulier   journaux, n’hésitez pas à utiliser même   lignes plus courtes. Pourquoi? Parce qu'ils peuvent,   en plaçant le texte sur plusieurs   colonnes.

http://www.alistapart.com/articles/css3multicolumn

Si vous utilisez une largeur fixe plus large que le plus petit écran susceptible de visiter votre site, vous ennuierez et frustrerez les utilisateurs qui doivent défiler latéralement pour accéder au reste de votre contenu.

J'utilise également une mise en page comprise entre 950 et 980 pixels et toujours centrée sauf indication contraire du client:)

  1. N'oubliez pas que la résolution du moniteur souvent citée dans les statistiques n'est pas nécessairement la même chose que la largeur intérieure de la fenêtre du navigateur . Les utilisateurs peuvent disposer de barres latérales / d'outils supplémentaires et utiliser une fenêtre de navigateur non maximisée. Plus l'écran est grand, moins vous voudrez l'utiliser pour une seule page.

  2. Les très longues lignes de texte sont plus difficiles à lire. L'optimum est de 25-30em (dépend de nombreux facteurs, mais vous ne devriez pas simplement viser le maximum).

  3. Les navigateurs mobiles ont " virtual " résolution d'écran qu'ils utilisent pour le zoom et il est ~ 960px dans Opera Mini / Mobile et Mobile Safari.

Je vote pour diviser la motion ici. Ce n'est pas parce que les tailles d'écran sont en X que X ou tout ce qui en est proche est le meilleur design pour votre site Web.

Le but de votre site Web a beaucoup à voir avec la largeur que vous choisissez.

De nombreux experts en marketing pensent qu’une colonne plus étroite "Convertit" plus de visites dans les ventes. C’est peut-être parce qu’il est plus facile de diriger l’attention des gens si la page est étroite.

D'autre part, un site dédié aux images doit afficher la meilleure résolution disponible pour chaque navigateur en visite.

À une époque, c'était 800px ; Cependant, de plus en plus de sites commencent à utiliser 1000px . Ceci est dû au fait que, le plus souvent, les résolutions basses des visiteurs sont à 1024x768 . Les 24 pixels supplémentaires laissent une place au chrome du navigateur, au remplissage et aux marges que vous pouvez manipuler, etc.

Juste pour vous donner une idée, même la nouvelle vague de netbooks avec leur petit écran a une résolution de 1024x768 .

Mais, par-dessus tout, connaissez votre public comme le suggère @warren et exploitez-le.

Vous pouvez essayer de développer plusieurs mises en page et utiliser Javascript pour basculer entre elles en fonction de la fenêtre du visiteur.innerWidth

Cela dit, j’utilise habituellement entre 950 et 980 pixels.

La largeur maximale du site Web pour des performances optimales et une compatibilité entre moniteurs croisés est de 960 pixels par rapport aux ordinateurs de bureau et aux ordinateurs portables.

Pour plus de détails sur comment et pourquoi voir l'article suivant:

Taille et résolution de l'écran

Selon les statistiques , un minimum de 1024 pixels de large couvrira la plupart des utilisateurs .

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top