Tenez-vous compte du 800*600 ?

[Wolf18]

Je n'en tiens jamais compte... Je trouve que c'est beaucoup trop petit, donc je me limite en général autour des 950px.

Maintenant c'est vrai qu'il existe encore des internautes qui naviguent avec cette résolution, mais je pense que de toute façon mes sites ne les interessent pas trop donc voila

[TheRec]

Peut-être que pour vous décider choisir le compromis entre un layout flexible et un layout à largeur fixe il faudrait attaquer le problème sous un autre angle. Du point de vue de l'usabilité il est nécessaire de maîtriser la largeur du texte d'une page, cette affirmation se base sur un étude (qui date un peu je vous l'accorde), The Effects of Line Length on Children and Adults Online Reading Performance (2002) et la plus récente suite de cette étude The Effects of Line Length on Reading Online News (2005) Document en anglais, désolé je n'ai pas trouvé de traduction.

Cela vous indique qu'un design complètement flexible qui permet au texte d'une page de s'étendre au delà de 95 caractères par ligne ou en dessous de 35 cpl ne sera pas "agréable" à la lecture... c'est aussi un de facteur qui pousse beaucoup de gens à utiliser des layouts à largeur fixes qui sont compatibles avec la résolution 800x600, cela donne à peu près 775px "exploitables" (à cause des barres de défilement, bordure de fenêre, etc.) et cela correspond à environ 100 caractères par ligne (espaces compris) et on rejoint la longueur "idéal" d'un point de vue de l'usabilité.

Le problème est que, comme cela a été évoqué précédemment, le Web n'est pas un média "statique", chaque utilisateur peut obtenir des résultats différents (polices installés, taille des caractères, résolution) et donc ce calcul fonctionne dans le cas des configuration "par défaut" des navigateurs (en plein écran).

Pour travailler avec cet état de fait il y a plusieurs solution et selon moi la meilleure est de partir d'un point de référence, c'est-à-dire largeur fixe pour optimiser l'usabilité de la page et laisser la possibilité de briser cette largeur fixe par une action de l'utilisateur (c'est à dire au moyen de Javascript, soit pour présenter la page une feuille de style alternative, soit en ôtant ces largeur fixe directement, la méthode importe peu). Premier inconvénient de cette méthode est que cette fonctionnalité ne sera pas accessible aux personnes qui n'ont pas activé Javascript (volontairement ou non), le contenu restant accessible cela ne me gêne pas outre mesure. Second inconvénient c'est le temps de développement supplémentaire nécessaire, malheureusement peu de clients souhaitent investir dans ce genre de fonctionnalités ce qui me force souvent à revenir au bon vieux layout à largeur fixe et cette largeur fixe n'est pas motivée par la résolution mais par l'usabilité comme je l'ai expliqué précédemment.

[pmadfm]

Bonjour,

AMHA, l'élastique est effectivement important.

Pour le public, je dirais que la plus grande majorité peut tourner en 1024*768, toutefois si ton affichage peut ou doit être lu par des seniors, il vaut mieux envisager le 800*600.

Peu me contredirons, vers les 45-50 la vue baisse, alors la résolution doit pouvoir s'adapter.

N'est il pas, messieurs les jeunes des années 50 ...

[tankia]

Ce que je fais quand je crée une mise en page de site, je pense au 800x600 en mettant le contenu important (navigation 1ère, logo, articles 1er) dans la zone de vision du site sans besoin de scroller. Par contre, je n'hésite pas à créer le site pour une résolution de 1024x768 car c'est la résolution de la majorité des internautes. La scrollbar horizontale et verticale est là pour que les 800x600 voit le reste du contenu (secondaire) et le Ctrl + est là pour les résolutions supérieures à 1024x768 pour agrandir les textes si les internautes les trouvent trop petits.

[Loupilo]

Bon ben, je suis d'accord avec Dudu

J'ajouterai quand même que quitte à vouloir proposer une maquette fixe, le choix de ses dimensions doit alors se faire en fonction de son public... Une cible âgée, par exemple, aura tendance à utiliser des résolutions plus faibles que celles permises par leur écran, et la population de 800*600 risque de ne pas être négligeable.

Par contre, pour une cible jeune ou branchée, les 17" sont de loin les plus répandus sur les ordinateurs de bureau (et les 19" percent), et permettent une résolution de 1024*768 ; les portables sont en 17" et ceux avec avec petits écrans ont bien souvent un format 16:9, avec plus de 1200px de largeur : choisir le 1024*768 n'est pas un pari risqué.

Ça dépend vraiment des utilisateurs.

Mais les maquettes étirables restent quand même le choix le plus flexible et le plus universel

[cweben]

Je confirme que j'ai connu des personnes qui utilise leur écran en 800x600 pour uniquement des raisons de ... lisibilité.

(en effet, elles ont l'impression que les caractères sont plus gros).

Mais, très souvent, les sites ne sont pas pensés en 800x600, ce qui rend difficile la navigation.

[TheRec]

Tout cela démontre une chose, la résolution n'est pas une constante chez les visiteurs donc il n'est pas possible de ce baser sur cette mesure pour créer un site, d'où mon approche du côté de l'usabilité. La contrainte en largeur s'applique pour une question d'usabilité et laisser la possibilité aux visiteur de "casser" cette limite de largeur et rendre la largeur de la page flexible (dans les deux sens, que ce soit fenêtre agrandie, plein écran, ou de taille réduite) permet à ceux qui le souhaitent d'obtenir une mise en page qui le convient mieux (parce qu'ils on une plus grande résolution, deux écrans, etc.). Où le faire dans l'autre ordre c'est-à-dire présenter une page avec une largeur flexible et proposer une alternative avec une largeur fixe.

On ne peut pas se baser sur une expérience empirique et/ou statistique pour définir un nombre d'or dans la réalisation d'une page vu la nature du média et de la diversité des visiteurs. Ce dont je parle se base sur des études scientifiques (certes empiriques dans une certaine mesure).

Mais les maquettes étirables restent quand même le choix le plus flexible et le plus universel

Je ne suis pas d'accord, une page totalement flexible peut se dégrader et/ou nuire à l'usabilité lorsque la la taille a disposition devient plus large ou moins large que les valeur "habituelles"... c'est pour cela que je propose un compromis. Ce que propose Leonick est un début, mais le problème est que cette solution mélange la couche de présentation et la couche de comportement en incluant du Javscript dans la feuille de style (ce n'est pas un hack, c'est une fonctionnalité). C'est pour cela que je suis plutôt pour un système de changement de feuille de style qui ne pose pas ce problème de conception.

[Leonick]

Ce que propose Leonick est un début, mais le problème est que cette solution mélange la couche de présentation et la couche de comportement en incluant du Javscript dans la feuille de style (ce n'est pas un hack, c'est une fonctionnalité).

En fait, le hack vient de l'appel de cette feuille de style IE

<!--[if IE]><link rel="stylesheet" type="text/css" href="/css/style-IE.css" media="screen, tv, projection" /><![endif]-->

[Loupilo]

Je ne suis pas d'accord, une page totalement flexible peut se dégrader et/ou nuire à l'usabilité lorsque la la taille a disposition devient plus large ou moins large que les valeur "habituelles"... c'est pour cela que je propose un compromis. Ce que propose Leonick est un début, mais le problème est que cette solution mélange la couche de présentation et la couche de comportement en incluant du Javscript dans la feuille de style (ce n'est pas un hack, c'est une fonctionnalité). C'est pour cela que je suis plutôt pour un système de changement de feuille de style qui ne pose pas ce problème de conception.

Je parle bien entendu de flexibilité accompagnée de max-width, comme l'indique Leonick. Perso, le mélange CSS/JS ne me gène absolument pas ; et le système de changement de feuille de style, en plus d'être assez contraignant à maintenir, est loin d'être accessible niveau utilisation à un internaute lambda. Demander à un public "de base" de choisir entre 800*600 et 1024*768 me semble être assez audacieux. Enfin, c'est au site de s'adapter à ses visiteurs, et non pas l'inverse.

Mais ce n'est que mon avis

[TheRec]

Oui, le mélange de la couche de comportement de la couche de présentation est gênant dans la mesure ou cela nuit justement à facilité de la maintenance... mais c'est un choix, comme ont peut choisir de mélanger la couche du contenu et de la présentation et on se retrouve avec les mêmes problèmes Je ne vais pas trop débattre sur ce point car c'est un peu hors-sujet et je n'ai pas vraiment d'argument plus probant à t'apporter (d'ailleurs je doute qu'il y en ait besoin).

Concernant le choix pour l'utilisateur je ne propose pas de le laisser choisir en "800x600 et 1024x768" (un point technique que je n'ai même pas évoqué, car il n'est pas significatif à mon avis), mais entre un contenu extensible en largeur (dans les deux sens) et un contenu qui a une largeur fixe. Voici un exemple accompagné d'un article (en anglais, désolé pour ceux qui n'en profiteront pas) qui reflète mon point de vue : Fixed Or Liquid?

Et je ne vois pas en quoi un tel système ne serait pas accessible aux utilisateurs, du point de vue de la compréhension. Du point de vue de la maintenance et de l'évolutivité, il est clair que cela demande un peu plus de travail à la conception. Mais en admettant que, comme dans l'exemple ci-dessus, on tire avantage des feuilles de styles et qu'on ne définit que les styles qui changent d'un layout à l'autre (flexible, et largeur fixe) et que les autres styles se trouvent dans une feuille de styles commune, ces problèmes sont tout à fait surmontables.

Pour ce qui est de la mise en place du système ce n'est pas vraiment une difficulté, il existe des style switcher de plusieurs natures: Javascript seulement, PHP (ou langage interprété côté serveur) uniquement, mélange des deux. Si le site est bien conçu l'entier du code agit simplement sur l'en-tête HTML des pages (liaison des feuilles de style). Tout ceci conservant l'accessibilité au contenu et en augmentant l'usabilité des pages. Maintenant il est clair que si l'investissement que cela représente ne vaut pas selon toi le gain en usabilité c'est ton droit, j'exposais juste la manière que je préfère utiliser

[jahmasta]

Bonjour

Tu peux aussi faire ton site à 100% ça permet de gérer tous les cas de figure.

@+

[Leonick]

Non, car un texte écrit sur du 1280 cela fait des lignes trop longues.

[Loupilo]

Oui, le mélange de la couche de comportement de la couche de présentation est gênant dans la mesure ou cela nuit justement à facilité de la maintenance... mais c'est un choix, comme ont peut choisir de mélanger la couche du contenu et de la présentation et on se retrouve avec les mêmes problèmes Je ne vais pas trop débattre sur ce point car c'est un peu hors-sujet et je n'ai pas vraiment d'argument plus probant à t'apporter (d'ailleurs je doute qu'il y en ait besoin).

Je suis d'accord sur le principe, mais ce JavaScript là est assimilable à la couche de présentation, donc ça ne rentre ama pas dans tes considérations de séparation

Et je ne vois pas en quoi un tel système ne serait pas accessible aux utilisateurs, du point de vue de la compréhension. Du point de vue de la maintenance et de l'évolutivité, il est clair que cela demande un peu plus de travail à la conception. Mais en admettant que, comme dans l'exemple ci-dessus, on tire avantage des feuilles de styles et qu'on ne définit que les styles qui changent d'un layout à l'autre (flexible, et largeur fixe) et que les autres styles se trouvent dans une feuille de styles commune, ces problèmes sont tout à fait surmontables.

Pourquoi pas. Mais c'est assez gadget pour la difficulté de maintenance que ça comporte... Et pour le rapport utilisateurs/utilisateurs qui s'en servent, aussi.

Pour ce qui est de la mise en place du système ce n'est pas vraiment une difficulté, il existe des style switcher de plusieurs natures: Javascript seulement, PHP (ou langage interprété côté serveur) uniquement, mélange des deux. Si le site est bien conçu l'entier du code agit simplement sur l'en-tête HTML des pages (liaison des feuilles de style).

Tout à fait d'accord.

Maintenant il est clair que si l'investissement que cela représente ne vaut pas selon toi le gain en usabilité c'est ton droit, j'exposais juste la manière que je préfère utiliser

L'idée peut-être séduisante sur le papier, mais pour moi, ça apporte plus de problèmes que ça n'en résoud... Après en effet, chacun peut l'utiliser s'il trouve que ça vaut le coup.

[TheRec]

En fait, le hack vient de l'appel de cette feuille de style IE

Le code que tu proposes n'est pas réellement un hack, c'est un commentaire conditionnel et c'est une fonctionnalité du navigateur Internet Explorer depuis sa version (un hack CSS est l'utilisation d'une mauvais interprétation du parseur d'un ou de plusieurs navigateur), mais je te l'accorde ce n'est qu'une question de terminologie.

@Loupilo> Ce que je propose et que tu considères comme un gadget est une solution qui permet de ne pas se limiter à une largeur fixe ou une largeur minimum (qui ne satisfont pas mes critères d'usabilité).

Concernant la séparation des diverses couches d'une page Web, pour moi elles sont claires, elles sont motivées par le langage utilisé entre autres (je ne vais pas faire la liste de critères vu que ce paragraphe est déjà hors sujet).

La syntaxe utilisée dans ce cas est du Javascript (invoquée par la fonction CSS expression), dans une feuille de style. Pour moi, et je doute être le seul dans ce cas, cela revient exactement au même que d'utiliser l'attribut style de n'importe quel élément HTML alors que l'on souhaite faire une séparation du contenu et de la présentation. Il n'y a pas d'assimilation à faire selon moi, contrairement à ce que tu penses, si je devais faire ce que Leonick propose j'invoquerai un script écrit en Javascript au chargement de la page (et cela correspond à la couche de comportement, aussi connue sous le nom de behaviour layer).

Comme je l'ai dit, par expérience c'est ce genre d'assimilation qui mène aux problèmes de maintenance. Il est possible de faire ainsi, mais tu ne me verras jamais le conseiller.

[BigVicente]

Personnellement je dispose d'une résolution de 1280*1024 mais je surf toujours en mode fenêtre. Et celle ci fait de 750 à 1100px de large, au delà je trouve les textes fatigant à lire sur un design étiré (impression personnelle).

Du coup quand c'est possible je fais des designs élastiques pouvant être consultés en 800*600 voir moins mais aussi en 1024*768 et plus. Quand mes designs ne sont pas élastiques, ils sont compatibles 800*600 dans la mesure du possible (pour certains sites comme des sites photos par exemple c'est parfois limite). Je ne suis pas encore près à abandonner cette façon de faire, quand je veux quelque chose de large je passe presque toujours en design élastique, j'essaie de ne pas imposer une résolution minimale trop élevée...

[Wefficient]

Si tu tiens vraiment à contenter tout le monde, rien ne t'interdit de recuperer la resolution de tes visiteurs et pour ceux dont tu arrives à le savoir, tu les reorriente vers le CSS approprié. Une version 800*600 et une version supérieure.

L'avantage c'est que ton site sera parfaitement représenté dans toutes les resolutions, avec les pubs visibles (si les pubs sont importantes pour le site)

l'inconvenient, c'est que cela peut representer 2 fois plus de boulot selon comment tu administre ton site...

[Broyax]

Je reste pour ma part en 800x600, ça fait des pages moins lourdes et plus rapides.

Et puis je connais pas mal de gens qui sont encore en 800 sur leurs vieux 15" (si, si, ça existe)

[Yazerty]

Si tu tiens vraiment à contenter tout le monde, rien ne t'interdit de recuperer la resolution de tes visiteurs et pour ceux dont tu arrives à le savoir, tu les reorriente vers le CSS approprié. Une version 800*600 et une version supérieure.

L'avantage c'est que ton site sera parfaitement représenté dans toutes les resolutions, avec les pubs visibles (si les pubs sont importantes pour le site)

l'inconvenient, c'est que cela peut representer 2 fois plus de boulot selon comment tu administre ton site...

Très peu pour moi, merci .

ps : parce que je ne trouve pas la solution très sexy...

[ThX]

C'est vrai que la redirection en fonction de la résolution n'est pas très "sexy" comme tu dis.

Personnellement, mon site est centré, et fait 750px de large. 10% de mes visiteurs sont en 800x600, je ne veux pas leur imposer un scroll vertical.

Et moi-meme, je suis en 1027x768 sur un 15" tout pourri, na

[froidure_nicolas]

Je fais du 800*600 aussi pour trois raisons :

• ne pas laisser d'utilisateurs sur la touche.
  
• les personnes qui utilisent d'énormes résolutions naviguent rarement en plein écran. De plus, quand on a une bonne résolution, on a tendance à laisser toujours ouverte une barre latérale (lecteur de flux, extensions etc...).
  
• créer un design extensible impose des limitations côté complexité du design.
  

Bref, je pense que le 800*600 a encore de long jours devant lui sans compter que les ordinateur portables sont de plus en plus nombreux et qu'il faudrait être fou pour les utiliser avec une résolution astronomique...

Et puis, vous en connaissez beaucoup vous, des gens dont l'écran ressemble à ça ?

[froidure_nicolas]

Ce petit sujet m'a inspiré un billet sur les sidebars qu'on a tendance à oublier et qui sont aussi à prendre en compte. Dans ce cas, même avec une résolution de 728*1024, il faut faire un design du type de ceux compatible avec le 800*600.

Bref, de quoi devenir cinglé !

Modifié 28 Février 2007 par froidure_nicolas

[ludo88]

Moi je pars du principe qu'il faut faire un site optimisé pour le plus grand nombre des qu'une large majorité se dégage. Sur mon site j'ai pas loin de 1.5 % de résolutions "farfelues" : pocket pc, smartphone, minitel : - de 640 ...

Je ne peux pas faire un site qui accepte du 300*200, donc par principe je laisse des utilisateurs de coté, ceux qui ont encore une résolution en 800*600, restent eux aussi de coté pour améliorer la navigation de plus de 85% des utilisateurs.

C'est un choix : sacrifier 10 ou 15% pour améliorer la situation de 85 ca me parait honnete.

Maintenant si vous me trouvez des stats qui disent qu'il y a plus d'utilisateurs en 800*600 que le contraire, avec toutes les configs qui sortent par défaut avec du 1024 (ordinateurs portables largement compris), je repasserai peut etre à du 800*600.

Mais dans la tendance actuelle je serai plus pour réflechir à passer sur du 1280 (meme si c'est encore trop juste), sauf que la, le probleme des barres latérales ou autre me pose soucis, et que je penaliserai 70% d'utilisateurs : ce qui est pas possible.

[Leonick]

Sur mon site j'ai pas loin de 1.5 % de résolutions "farfelues" : pocket pc, smartphone, minitel : - de 640 ...

Je ne peux pas faire un site qui accepte du 300*200,

pourtant je pense qu'il va falloir qu'on s'y mette, dès que l'accès internet va se retrouver en illimité sur les portables, ça risque de représenter un quota de visiteurs non négligeables

[ludo88]

Tous les amateurs de visionage à la loupe parce que sur un pocket pc on voit pas grand chose et sur une résolution en 300 par 200 faut pas trop en mettre, je pense que tant que les écrans resteront à ces tailels et ces résolutions se sera réservé à certains types d'applications : email, recherche rapide...

[Dadou]

Pour les très petites résolutions, pour moi, ce n'est pas mettre tout le site à cette résolution, mais uniquement, les parties qui peuvent intéresser les utilisateurs nomades (Rubrique contact, des infos succinctes...)