Développons en 1024 (et plus en 800 X 600) !

Bonjour,

J'apporte ma pierre à l'édifice.

Je suis surpris de lire que certains d'entres-vous développent des sites pour toutes les tailles d'écrans, écrans d'ordinateurs comme écrans de Palm ou autres Pockets PC, avec une unique feuille de styles ?

Parce que, si des sites ne contenant qu'uniquement du texte, comme certains des vôtres, ne posent pas de problèmes particuliers, ce n'est pas le cas des sites dont le design a été réalisé par des graphistes, et non par des programmeurs.

On ne peut pas prétendre créer un site optimisé, et pour une sortie écran haute résolution, et pour une sortie sur périphérique mobile.

On ne créé pas une affiche A3 comme on créé une carte de visite.

On ne manipule pas la souris comme le stylet.

Comme il l'est écrit par Biscotte ci-dessus, les agences web travaillent souvent à plusieurs sur un même site, et les compétences se complètent. Les graphistes sont souvent exigeants. La plupart du temps, ils ne s'accommoderont pas d'un design fluide. Je ne sais pas si vous travaillez en équipe, mais si c'est le cas, vous savez sûrement que les graphistes sont très pointilleux, et sont capables de rejeter un document à cause d'un pixel superflu, qui remet en cause l'équilibre de la page.

Mais en fin de compte, cela ne pose aucun problème !

Les navigateurs de poche (sur PPC, Palm) n'interprètent pas toujours les feuilles de style. Dans un tel cas, que votre site internet ait un design fluide ou rigide ne change rien, pourvu qu'il est été développé selon les standards. S'il s'affiche convenablement dans votre navigateur, feuille de styles désactivée, c'est à peu prêt gagné.

Il faut savoir que ces appareils, ou plus exactement les navigateurs s'exécutant sur ces outils, possèdent parfois un moteur qui leur est propre et qui permet de palier au scrolling horizontal. C'est le cas du navigateur Opera Mini.

Mais la force des CSS, c'est justement de pouvoir associer plusieurs feuilles de styles à un site internet. CSS2 permet précisément de lier des feuilles de styles à un média spécifique.

Si on souhaite tenir compte, du mieux possible, des contraintes des Palm et autres PPC, on doit développer une feuille de style spécifique. Et si le site a bien été construit, le surcoût de travail est très faible.

Pour moi, chercher à développer un site graphique destiné à être vu dans 99% des cas sur un écran d'ordinateur en le rendant compatible avec un Palm est une erreur, car cela en tirera inévitablement la qualité vers le bas, et c'est en quelque sorte un retour en arrière, alors que les CSS permettent plutôt d'aller de l'avant.

Consultez le lien suivant, vous verrez que des boîtes prennent en compte cette réalité :

http://www.honet.be/fr/articles/site-web-pocket-pc/

Je précise que je n'ai rien à voir avec cette société, et les admins peuvent supprimer ce lien s'ils le jugent apparenté à de la publicité gratuite.

Je pense qu'il y a plus de développeurs que de graphistes sur votre forum, ce qui est normal. Mais ne négligez pas le rôle de ces derniers quant à l'expérience qu'ils ont sur l'impact d'un design (la forme) sur le contenu (le fond).

Le design rigide permet de s'affranchir non pas d'un problème technique (bien que le fait que IE ne comprenne pas la propriété max-width n'aide pas), mais de compromis de qualité, nécessaires au design fluide. Car finalement, qu'apporte un site fluide ? Une étendue de la surface de l'information à l'écran, mais à part a ? Il est rare que l'ergonomie du site en soit améliorée. A vrai dire, c'est souvent le contraire. Et il est tout à fait possible de créer un design rigide sans sacrifier l'accessibilité.

Ce qui me semble important, c'est de développer en dissociant bien le fond et la forme, via les CSS. Ainsi, le site internet sera lisible sur les périphériques mobiles sans feuille de style. Ce qui permet bien de créer un design rigide dans les CSS. Et si on veut vraiment prendre en compte les périphériques mobiles, alors je pense qu'il faut écrire une feuille de style sépcifique.

Tout ceci n'est en aucun cas une vérité, juste un sentiment personnel. Et si je devais le remettre en cause, je devrais admettre que je n'ai rien compris au rôle des CSS

Dimitri.
Modifié par Dimitri (26 Apr 2006 - 09:34)

@ > Dimitri

Pour ma part je suis plus graphiste que développeur. J'apporte donc mon point de vue de graphiste.

La première remarque, c'est qu'un site figé (en 800 ou en 1024 peu importe) sera de toute façon "graphiquement pitoyable" sur un écran 1933x1452 ou plus... Bien sûr que ces formats ne courent pas encore les rues, mais qu'en sera-t-il dans 1, 2, 3 ans ?

La deuxième c'est pour dire qu'en tant que graphistes nous avons à chercher comment rendre nos designs compatibles avec les standards (ça n'est pas aux informaticiens de le faire à notre place, chacun son job). Si nous ne sommes pas capables aujourd'hui de produire des sites qui soient en même temps conformes à une qualité esthétique et conformes aux besoins liés aux restitutions alternatives, ça n'est ni de la faute à l'utilisateur, ni de la faute au W3C, mais bien la nôtre. Ça ne démontre qu'une chose : que les graphistes n'ont pas encore trouvé comment s'approprier l'outil.

<mode=nostalgie>
Ça me rappelle exactement le débat stérile vers la fin des années 80 entre graphistes "crayon-papier" et les graphistes "mac", où les mêmes arguments étaient utilisés (ouaais l'ordi ça tue la créa ! ouais le mac ça fait du design dégueu ! etc) Remplace "ordi/mac" par "accessibilité" et la machine à remonter le temps s'emballe
<end mode>

Notre boulot c'est aujourd'hui d'inventer comment produire du design accessible, et pas de chercher à reproduire à l'infini nos savoirs-faire nés du papier imprimé sur un outil où ils sont par définition inapplicables.
Poser le débat en termes de graphisme contre accessibilité c'est passer à côté de tout l'enjeu qui est de solutionner l'équation graphisme ET accessibilité. Qu'on ne soit pas encore capables de trouver de solutions satisfaisantes est une chose, dire - comme tu sembles le faire - que ces solutions n'existent pas en est une autre.

Au boulot au lieu de causer

Arsene a écrit :
Pour ma part je suis plus graphiste que développeur. J'apporte donc mon point de vue de graphiste.

Attention à ne pas confondre Webdesigner et Infographiste. Je me pensais, moi aussi, graphiste jusqu'à ce que je bosse sur de gros projets (cd-rom) avec de "vrais" graphistes. La valeur ajoutée par ceux-ci sur les interfaces sont énormes. Si peu de sites sont graphiquement de qualité, c'est précisément parce que beaucoup s'improvisent développeur/ergonome/graphiste... J'ai d'autant plus de facilité à le dire que j'en fais partie. Par contre, pour avoir travaillé avec des graphistes, je sais être distant sur ce que je suis moi-même apte à produire.

Mais attention, ne prends pas cela pour toi, tu as peut-être fait des études d'infographie. C'était juste une mise au point.

a écrit :
La première remarque, c'est qu'un site figé (en 800 ou en 1024 peu importe) sera de toute façon "graphiquement pitoyable" sur un écran 1933x1452 ou plus... Bien sûr que ces formats ne courent pas encore les rues, mais qu'en sera-t-il dans 1, 2, 3 ans ?

Comme dis par Yann, une page qui serait étirée sur 2000 pixels serait bien plus "pitoyable" qu'un 800 pixels. De plus, et comme il l'a déjà été écrit plus haut, les gens qui utilisent de telles résolutions laissent quantité de palettes autres à l'écran. Ils naviguent en mode fenêtré.

a écrit :
La deuxième c'est pour dire qu'en tant que graphistes nous avons à chercher comment rendre nos designs compatibles avec les standards (ça n'est pas aux informaticiens de le faire à notre place, chacun son job).

Je suis ici en désaccord total. Le graphiste peut et doit connaître au minimum les contraintes liées au média, mais c'est tout. Il n'est pas obligé de savoir ce qu'est le XHTML.

Et encore une fois, il est tout à fait possible de créer un design rigide, et conforme aux standards ! Attention, parce que vous êtes plusieurs à entretenir l'ambiguité à ce sujet.

a écrit :
Ça ne démontre qu'une chose : que les graphistes n'ont pas encore trouvé comment s'approprier l'outil.

Absolument faux !

L'écran n'a jamais et ne bouleversera jamais les lois fondamentales, que les plus anciens peintres maîtrisaient déjà. Si on prend l'exemple de la photo, elle n'a en rien modifiée la culture de l'image de base, et c'est même le contraire. Les plus grands photographes sont inspirés par la peinture, pour y puiser les secrets de l'équilibre d'une conception graphique.

Je ne vois pas en quoi l'écran modifierait la donne !

Il est contre-créatif de devoir réaliser un design qui ne s'affichera pas de la même manière partout. Cela crée des contraintes, qui constituent de fait un obstacle à la création. On peut faire, bien évidemment, quelque chose de correct, mais si on peut le faire en fluide, on peut le faire en rigide.

L'inverse n'est pas vrai.

Imagine la tête d'un peintre ou d'un photographe, qui apprendrait que sa peinture ou photo pourrait être plus ou moins étendue selon les spectateurs ! Peut-être qu'effectivement, cela l'amuserait et il essayerait de créer une réalisation originale pour en tirer partie. Mais très vite, il abandonnerait. Passé l'attrait d'une telle expérimentation, le classique, qui fonctionne et qui permet un esprit pleinement créatif, reprendrait ses droits.

Par contre, ce qui est intéressant dans les médias comme internet ou le cd-rom, c'est l'interactivité ! Et là, oui, on a pas encore exploité 100% des possibilités. Mais cela est indépendant de l'écran.

Depuis toujours, on a associé l'interface à une sorte de tableau de bord, ou la souris, remplaçant la main, appuie sur de gros boutons que sont les icones. C'est sûrement ce qu'il y a de plus ergonomique, et c'est ce qui explique que c'est la solution qui a été retenue depuis déjà fort longtemps.

Mais rien n'empêche de surprendre le "spectateur", en lui créant une expérience originale, dont il se souviendra.

Je me souviens des CD qui accompagnaient les magazines Computer Art, où l'interface se moquait des codes habituels en matière d'expérience utilisateur (et non de design ! La différence est importante !). Ainsi, une fois, la souris servait à déplacer un aimant, pendu à un élastique, et il fallait l'accrocher (par magnétisme) à des boules de métal comportant le nom de la rubrique, et les déposer dans un panier.

Si l'interface avait été plus banale, je ne m'en souviendrais absolument plus ! Et c'est là toute la puissance de l'expérience utilisateur pouvant être provoquée à l'aide des médias interactifs.

Mais, encore une fois, tout cela ne remet absolument pas en causes les règles qui font qu'un design "fonctionne".

J'ajouterais une remarque, qui m'est venue à la lecture de ce forum.

Celui ci exploite toute la largeur de mon écran, qui est en 1280 X 960. A première vue, pour un forum, cela peut parraître une bonne idée.

Mise en page simple, allant droit vers l'utile, information purement textuelle. Et pourtant, faites l'essai si vous utilisez une résolution d'écran élevée :

Parcourrez le forum, lisez quelques posts puis refaites la même chose en redimensionant la largeur de votre navigateur (vers du 1000, par exemple).

Que remarquez-vous ?

La lecture n'est-elle pas plus agréable et facile dans le deuxième cas ? Le passage d'une ligne à l'autre n'est-il pas facilité ?

Et avez-vous remarqué comme, en haute résolution, la proximité des yeux par rapport à l'écran conduit à un déplacement exagéré ?

La première chose que l'on apprend dans les techniques de lecture rapide, c'est de limiter le déplacement (rotation ?) de l'oeil, responsable de la fatigue provoquée par la lecture.

Ce n'est pas un hasard si le texte en colonnes étroites (type journal) est plus facile à lire.

dimitri a écrit :

Je ne vois pas en quoi l'écran modifierait la donne !
Il est contre-créatif de devoir réaliser un design qui ne s'affichera pas de la même manière partout. Cela crée des contraintes, qui constituent de fait un obstacle à la création.

Disons qu'avec le vingt-unième siècle est apparue cette possibilité qui n'existait pas du temps de Michel Ange et qui permet à l'internaute d'afficher ou pas les images, de changer la taille des objets, de décider à quelle taille il préfère lire le texte, d'en modifier la typo, d'en changer les couleurs s'il en a envie, de l'écouter plutôt que de le lire, etc etc.

Une attitude possible est de se dire qu'on développe un design carré soigné pile poil ultrabeau pour les écrans compris entre 1000 et 1600px : plus on s'en tape, et moins, on s'en tape encore plus. En affinant, on pourrait réserver l'ultrafinesse de la gamme chromatique aux écrans calibrés en chromie, les autre on s'en tape aussi. Intervient ensuite le mode de lissage des polices, le gamma système (finalement je décide de n'offrir mon superdesign que pour un gamma 1.5 mac, les 1.8 PC n'ont qu'à aller se faire voir vu qu'ils ne respectent pas mes couleurs) et servir aux autres une pure page 100% texte.
A force d'éliminer des configurations visiteurs tu comptes aller jusqu'où ?

Donc je persiste et signe, c'est bel et bien notre métier qui change. A nous de vite le comprendre.

1) Le 21ième siècle ne changera pas ce qui est communément admi en ce qui concerne les principes de base du graphisme.

2) En rien une feuille de style avec un width de 800px créé un site ne pouvant être grossi, ne pouvant être écouté... D'où sorts-tu ça ? D'ailleurs, tu devrais engueuler Raphaël puisque son site s'appuie sur un design rigide.

3) La deuxième partie de ton post est caricaturale et ne mérite pas de commentaires, si ce n'est que notre métier change. Oui, et grâce aux CSS, il devient plus facile.

4) Où as-tu vu que je limite les configurations des utilisateurs ? Réponds-moi parce que je suis intéressé. En quoi un design fluide serait plus approprié ? Figures-toi que pour moi, c'est presque le contraire (cf. mon dernier post).

D'ailleurs, le débat fluide/rigide pourrait avoir lieu si déjà on savait que le fluide est plus approprié, mais ce n'est même pas une vérité absolue (cf dernier post). Autrement dit, tu te fais le défenseur du fluide alors qu'il n'est même pas acqui qu'en fin de compte, il soit plus ergonomique.

5) Encore, et encore, et encore une fois, si je limite la configuration de mon public, serais-tu près à le redire aux très nombreux concepteurs de sites, respectueux des standards et de l'accessibilité, et ayant malgré tout choisi un design rigide ?

Les CSS sont précisémment là pour nous faciliter la vie, et nous permettre de créer des interface en accord avec l'outil servant à les lire.

Evite de tomber dans le trop caricatural. Quand tu dis que l'internaute peut aussi ne pas afficher les images... Ca, c'est fort. Effectivement, une fois que tu as dis cela, le débat est clos !

Alors enlevons les images ! Et ne faisons que des sites purement textuels !
Et supprimons les feuilles de style, une lecture linéaire du code html, à base de blocs, fonctionnera partout.

Je n'y avais pas pensé

OK Raphael, désolé. Merci du rappel.

Désolé, Raphaël. Entre passionnés, le ton peut vite monter

A moins de parler du Flash, il faut bien reconnaître que les pages webs sont relativement statiques. Ce qui signifie bien que, lorsque nous sommes devant notre écran, nous avons sous les yeux une mise en page, une mise en forme, je devrai même dire une mise en valeur du contenu. Ce n'est pas très différent du print.

Je ne dis rien d'autre que lorsqu'un graphiste passe une journée entière sur un travail de création graphique, souvent très précis, savoir que sa création peut varier d'une personne à l'autre ne constitue pas un progrès.

Mais fort heureusement, les CSS sont là pour justement optimiser cette mise en forme en fonction du player.

Contre l'agrandissement du texte par l'utilisateur, on n'y peut pas grand chose, mais ce n'est pas dramatique en soit. Il faut juste l'accpeter.

Et c'est justement parce que ces cas là existent (et c'est tant mieux), que le design fixe permet déjà d'être sûr que dans les autres cas, tout le monde voit bien la même chose. Sans les CSS, il fallait autant de versions différentes d'un même site que de players ciblés. Maintenant, on a la possibilité de travailler sur une mise en valeur du contenu, sans pénaliser personne.

Arsene a écrit :
Je ne suis pas contre les design fixes ni pour les fluides, je suis contre l'attitude consistant à ne pas tenir compte du fait que la restitution du flux peut s'opérer d'un tas de façons différentes et à ne développer des sites que pour une part - certes aujourd'hui encore majoritaire, mais pour combien de temps - d'internautes ayant une certaine configuration matérielle et logicielle.

Je ne développe pas que pour une partie des internautes avec un design figé. Pas plus qu'avec du fluide. Cela n'a rien à voir, à mon sens. Tout me semble très bien expliqué plus haut.

a écrit :
Je reconfirme et resigne que tout l'enjeu de notre métier de graphiste est aujourd'hui dans la solution de ce problème important, et que s'arcbouter sur des savoirs-faire datant d'une époque où le "lecteur" était passif et prenait ce qu'on lui donnait tel qu'on le lui donnait (design graphique "classique") est révolue.

Ce n'est, pour moi, pas révolu du tout. Comme dis plus haut, tous les préceptes de base restent d'actualité.

Mais on ne se mettra pas d'accord ce soir, c'est clair.
A+
Modifié par Dimitri (26 Apr 2006 - 17:26)

My 2cents,

Reprenons en gros les statistiques :

50% de 1024
20% de 800
30% du reste.

Si l'on reste dans la notion d'accessibilité, on se positionne en gros pour 10 à 15% potentiel du marché (désolé si je choque, mais dans une posture professionnelle on parle en terme de maché ou d'utilisateurs) et pourtant on essaie de s'y positionner.

Donc pour moi, si on travaille l'accessibilité pour 10 à 15% du marché, restons pour l'instant en mode 800 qui représente 20% du marché autrement y'a un peu contradiction dans le positionnement d'accès pour tous.

2 ou 3 autres petites choses comme ça, sauf sur des sites 100% informatifs/texte, et encore, on utilise que rarement totalement l'espace, un peu pour laisser l'utilisateur respirer, mais aussi parce que l'usage des blancs est pour certains ce qu'il y'a de plus important dans un visuel à caractère informatif.
Petit exemple tout bête, les livres, mais pourquoi donc avons nous tout cet espace gâché autour du texte, alors que profitant a fond du format de la page, on caserai plus d'information, on aurait moins de pages, donc au final des coûts de matière première et d'imprimerie réduits? pour des questions de lisibilité.

Dites vous bien que même les sites qui sont "construits" pour du 800/600 sont également pensés pour le 1024 (je me plait à penser que tous les créateurs de sites ont un positionnement professionnel) ne serait-ce que dans l'équilibre "tailles" de visuels et "tailles" des textes.

Pour rire faites ce petit exercice sur plusieurs sites soit disant construits pour du 800, regardez le avec votre 1024 et passez en 800, des fois c'est amusant voir risible, des logos énormes, des textes bien gras et bien gros etc etc...(sauf bien sur si on construit celon les bons principes ).

Ce n'est pas seulement le choix de la construction fixe/flexible qui est important, c'est l'accessibilité à l'information et celle ci, je le pense est déja optimisée pour le 1024, ne serais-ce que parceque une personne travaillant le design web ce doit/ devrait de travailler sur un ecran en résolution "courante".

Apres, honnettement pour les grosses résolutions, la plupart des gens que je connais et qui ont des écrans monstres/resolutions de mamouth, naviguent avec leur browser en mode fenêtre.

++
Aymeric