Débat : sites fluides = mort du webdesign ?

[Rockz]

Bonjour,

Comme un peu tout le monde, je surfe sur la vague d'une intégration web conforme aux recommandations du W3C, qui semble passer par l'utilisation combinée de balises "conteneurs" et de CSS.

Le fait est que lorsque on attribue des dimensions proportionnelles à ces conteneurs (en-tete, menu gauche, corps, ..), on obtient bien un site "fluide" (glamour et sexy quelquesoit la taille de la fenêtre de navigateur:D ; le contenu de chaque bloc se déplace en fonction de la taille de la fenêtre), mais on perd alors l'unicité du graphisme (qui semble bien s'adapter à des sites basés sur des tableaux ou conteneurs ayant des dimensions absolues et fixes).

C'est cette unité du graphisme qui permet à mon sens de pouvoir associer à un site une belle maquette, une belle interface.

Avec les blocs de dimensions proportionnelles, le graphisme n'a plus d'unité et chaque bloc doit être travaillé indépendamment des autres (je ne pense pas qu'une image de fond globale puisse s'allier à cette technique d'intégration, elle serait déformée à chaque changement de taille du navigateur, mais ca j'en suis pas sûr, c'est bancal, c'est pourquoi j'attends vos opinions sur le sujet )

Quelles est votre opinion à ce sujet ? Dans votre boulot quotidien, comment gérez-vous les projets impliquant des sites "proportionnels" ? Vous avez surement dû réaliser des interfaces pour ce type d'intégration : quelles méthodes avez-vous adopter ? quels en sont les problèmes, les écueils, les points à prévoir avant de se lancer dans la maquette Photoshop ?

Enfin, ce type d'intégration vous pourrit-il la vie en tant qu'infographistes/webdesigners (moins de libertés ?) ? Enfin, question provoc' (ardisson ardissex !), est-ce que cela met en danger votre profession ?

Allez, je stoppe là et j'espère que ce topic va motiver moultes réactions

[Prélude]

Bonjour,

Je me souviens d'une époque où je disais à mes très chers collaborateurs : "Attention, ta charte graphique ne va pas passer en 640x480 ou en 800x600 !"

Et ils devait repenser leur charte graphique pour quelle s'adapte aux différents écrans de l'époque (14" et 15").

Alors, on faisait dans "l'élastique" : pas simple, mais nous étions des pros !

Et voilà qu'on y reviens !

Ce n'est pas la mort d'un métier, mais bel et bien sont annoncement !

Et ce n'est pas parcequ'une page ne contient "qu'une" ligne, "qu'un" trait que la charte graphique reste à la porté du premier venu. La sobriété est une difficulté qui se forge avec l'expérience (je ne dis pas cela pour mon site !)

Mais cela pourri la vie, oui !

Mais c'est pas cela que l'on demande ?

Alors ? Bientôt la reconnaissance ?

[Dinostrate]

Le fait est que lorsque on attribue des dimensions proportionnelles à ces conteneurs (en-tete, menu gauche, corps, ..), on obtient bien un site "fluide" (glamour et sexy quelquesoit la taille de la fenêtre de navigateur:D ; le contenu de chaque bloc se déplace en fonction de la taille de la fenêtre), mais on perd alors l'unicité du graphisme (qui semble bien s'adapter à des sites basés sur des tableaux ou conteneurs ayant des dimensions absolues et fixes)

Salut

Je dirai plutot qu'il va falloir complètement changer de style graphique et que l'imagination va arriver au pouvoir !!!! Maintenant, il ne faudra plus réaliser une image, mais plusieurs qui se combineront automatiquement, que l'on choisisse la sobriété ou pas.

Je viens à peine de découvrir cette chose, et j'entrevois d'immenses possibilités....

Internet explorer va bel et bien être obligé de se mettre à la page !

Mais attention, le métier de graphiste va devoir évoluer bougrement !

Dino

[thick]

Bonjour à tous,

Rockz, la question qu'il faut te poser est plutôt : est-ce que tu fais des sites pour ta poire ou pour satisfaire le besoin des Internautes ?

Sinon, il y a des gens qui ne voulaient pas du TGV ou de l'Autoroute, mais c'est pas grave ils ont pas empêché le Monde d'avancer.

Dans n'importe quel media, c'est l'utilisateur qui a fait le media et pas les professionnels. Regarde le livre, la radio et la TV et tu comprendra que c'est à toi de t'adapter et non l'utlisateur de s'adapter à tes besoins et envies d'infographiste.

Je me suis bien amusé en faisant mon site 7 Dragons et bien que je sois plus dans le minimaliste que dans le surchargé, je ne pense pas avoir à envier n'importe quel kit graphique en 800x600.

Sinon, j'admet que c'est une tout autre manière de penser la création de sites et que ça peut dérouter. On est bien confortable avec ses tableaux de 760x420 et ses polices à 12px, mais c'est fini tout ça et tant mieux. Ceci dit, j'ai pas fini avec les tableaux car c'est vrai que c'est sécurisant quand on a connu que ça, mais l'immobilisme dans la création et la technique ne nous amenera pas bien loin.

[Guest exabs]

Pour moi les sites proportionnels généreront toujours le même problème : Cela ne vous dérange pas des lignes de texte de plus de 1000 pixels de large (c'est ce que j'obtiens sur mon 19") ? Cela va tout à fait à l'encontre des règles de mise en page... Imaginez un quotidien sur une colonne !

[ams51]

Il n'y a rien de plus désagréable de visiter un site optimisé en 1024 sur un écran en 800. L'inverse est aussi vrai, visiter un site fixe en 800px sur un écran en 1600 est ridicule. Je pense aussi qu'il faut que les sites s'adaptent aux visiteurs et non l'inverse.

[thick]

Avec les pages sans tableaux en design fluide et police en "em" c'est l'utilisateur qui choisi.

Moi ça me dérange pas si quelqu'un veut mater le site avec des police XXL. C'est le visiteur qui choisi et pas le créateur. Il y a même un peu de Taoïsme derrière tout ça. On appele ça le "lâcher prise". Tu abandonnes le site au visiteur car tu ne veux pas l'empêcher de consulter l'info comme il veut.

Après, rien ne vous empêche de rester en tailles fixes, même avec le XHTML et le respect des standards du Web. D'ailleurs, il y a toujours des gens qui font leurs sites avec des frames, alors qu'on sait que c'est pourri.

[Guest exabs]

Il n'y a rien de plus désagréable de visiter un site optimisé en 1024 sur un écran en 800. L'inverse est aussi vrai, visiter un site fixe en 800px sur un écran en 1600 est ridicule. Je pense aussi qu'il faut que les sites s'adaptent aux visiteurs et non l'inverse.

Donc la réponse est : Non cela ne me dérange pas de lire un texte de plus de 1000 pixels de large...

800 pixels sur un écran 1600 = ridicule, y'a un paquet de sites qui sont ridicules et pas des moindre !!

[thick]

Je ne commenterais pas sur le boulot de certaines grosses Web agency, mais j'en pense pas moins.

On dirait que plus les budgets augmentent et plus on se fiche de l'internaute.

[ams51]

800 pixels sur un écran 1600 = ridicule, y'a un paquet de sites qui sont ridicules et pas des moindre !!

Quand je dis ridicule c'est que je trouve que le site fait tout petit au milieu de l'écran... Ce n'est pas le site en lui même

j'aime avoir un maximum d'information sur mon écran.

Je vais prendre l'exemple de Libération qui a un site en 740 fixe avec une colonne pour les articles de 300 il me semble. En plus le tout est collé à gauche. Bilan sur la plupart des articles on a 2 à 3 écrans de haut alors que si la colonne "utile" de l'article était variable je pourrai avoir l'intégralité de l'article devant les yeux sans avoir à utiliser la souris ou le clavier.

D'autres journaux sont en 1024 fixe (de mémoire le journal du net est comme ça), les utilisateurs en 800 sont oubliés alors qu'ils existent toujours !

D'autre part, si on a envie de ne pas avoir des textes sur 1000 pixels de large on peut réduire la taille de la fenêtre (si le site est elastique bien entendu)...

Tout ça pour dire qu'il faut s'adapter... peut etre en donnant le choix de la feuille de style à l'internaute, maintenant qu'on peut le faire très facilement !!

[Dinostrate]

Pour moi les sites proportionnels généreront toujours le même problème : Cela ne vous dérange pas des lignes de texte de plus de 1000 pixels de large (c'est ce que j'obtiens sur mon 19") ? Cela va tout à fait à l'encontre des règles de mise en page... Imaginez un quotidien sur une colonne !

salut

exabs

On a déjà eu une ou deux discussions à ce sujet.

Il se trouve que je viens de publier mon site dans son nouveau look...

Tu peux aller le voir et vérifier la proportionalité.

Il est loin d'être encore tout auto et n'est certainement pas parfait, d'autant qu'il y subsiste quelques erreurs, mais si tu n'oublies pas d'utiliser le zoom du navigateur pour les caractères, tu verras qu'on peut consulter plus que correctement y compris dans les résolutions maxi. Il me reste les images a rendre proportionnelles, mais si tu utilises opera7, le zoom se fait même sur les images.

L'intérêt d'une résolution élevée n'est bien entendu pas d'allonger les lignes, mais de rendre les caractères plus agréables a regarder, mais aussi les images (mais là, il faut bosser un peu plus)

En ce qui concerne les navigateurs :

En fait, c'est avec Ie qu'on obtient l'effet le moins bon.

Avec Mozilla et Opera, t'as la fluidité en plus.

Et grace au zoom sur images, c'est Opera le meilleur (bien que mon préféré soit Mozilla pour d'autres raisons)

Dino

[Beatnykk]

pour revenir au problème soulévé par Rockz (belle image de page dailleurs) :

non, je crois que créer un site en proportionnel est justement plus "graphique" qu'un site "bloqué" à une résolution d'écran donné. le travail est là plus "pro" parce qu'il oblige le créateur à faire un travail plus "abstrait" que la mise en page habituel en 800x600 par exemple, à la portée technique de n'importe quel newbie (aspect créa pure mis à part).

pour moi depuis que je me suis mis à créer des sites, l'authentique, le véritable travail de page est en proportionnel. j'ai assez ralé ici ou là (comme sur le hub) pour abandonner l'obsolète modèle 800x600.

avec le css et pas mal d'ingéniosité tu devrais y arriver aussi... et ne plus vouloir revenir en arrière... et te demander pourquoi tu le faisais autrement avant !!

[bigornot]

tu peux faire un site avec une taille définie ( assez petite ... ) et, après, tu mets un fond ( pas trop moche ) qui va bien avec le reste et qui s'adapte aux plus graaaaaaaaandes tailles ...

[Beatnykk]

pas vraiment : ton interface reste rikiki seul les espaces s'adaptent.. bof

[Rockz]

Merci à tous, je n'attendais pas tant de réactions et j'espère que çà n'est pas fini

Pour l'image Beatnikk, c'est celle d'un jeune con resté bloqué sur les vinyles de ses parents, et qui ne s'imagine plus la vie sans : Jimmy Page !!! (merci de recentrer le topic)

((>> Ch'tite apartée : Avant de continuer :

Dans n'importe quel media, c'est l'utilisateur qui a fait le media et pas les professionnels. Regarde le livre, la radio et la TV et tu comprendra que c'est à toi de t'adapter et non l'utlisateur de s'adapter à tes besoins et envies d'infographiste.

Là-dessus thick, je ne te suis qu'à moitié. Ca fait très marketinje de dire çà. Je suis bien d'accord pour dire que l'intégration en proportionnel vise un objectif d'adaptation à l'utilisateur, mais le pb n'est pas dans ce topic celui du "je bosse pour moi Vs je bosse pour l'internaute".

De plus, pour "le livre", l'auteur ne s'adapte pas à son public, il propose quelquechose de nouveau, qui plait ou non, mais qui ouvre l'esprit. Il en va de même pour la musique (que penser d'un artiste qui crée un morceau "qui doit plaire au public" ..on appelle çà faire du "commercial" non ?). Pour la télé, quand tu vois la daube qu'on nous propose, penses-tu vraiment que les chaînes s'adaptent aux envies des téléspectateurs ? Je crois qu'on le leur impose.. Alors "s'adapter".. Enfin, en Marketing, on dit souvent que "le client est roi" (sous-entendu l'entreprise s'adapte) pour faire politiquement correct, mais un marketeur "anticipe" souvent le besoin, voire même le "crée".

Donc même si les sites proportionnels vont dans cette optique d'adaptation, cela me semble faux en règle génerale.

Voilà voilà, au risque de faire déraper le sujet, désolé <<))

Sinon, vu qu'on se trouve dans la partie WebDesign, peut-on retourner sur les aspects techniques graphiques ? Beatnikk parle d'"ingeniosité", c'est quelquechose qui se pratique et qui ne s'apprend pas Alors ok, je fais des essais comme tout un chacun de mon côté, mais les "ingénieux" que vous êtes (rouuuh c'est bon la pommade dans le dos ! ) peuvent-ils témoigner ? :

Les écueils, les points à prévoir avant de se lancer dans la maquette Photoshop ?

Comment concilier un rendu graphique global lorsque que l'on développe une interface graphique propre à chaque bloc ?

Témoignages de plantages/ratés graphiques lors de premiers projets en proportionnel ?

Et que la boule qui roule amasse la mousse !

[thick]

Ok, j'admet que je pars dans des trucs un peu cheloud et qui sont trop longs à exprimer dans un petit post. Laissons tomber ce débat car on en finirait pas...

Je comprends ton point de vue artistique, mais mon côté "usabilité d'Internet" me fait oublier que la création artistique est très importante. Quand on lit trop de propos de Jakob Nielsen (comme moi en ce moment) on en viendrait à revenir au Minitel ...

Pour rentrer dans le concret, je vois pas vraiment comment tu peux faire une interface graphique, la découper en tranches et mettre tout ça en design fluid. Pour moi, ça peut pas marcher, mais je demande qu'à être convaincu du contraire.

[Rockz]

Héhé salut thick, j'ai peut-être été un peu trop virulent desolé (j'aime bien discuster le bout de gras cependant le débat y'a que çà de vrai pour comparer les visions ça roule, on retourne au sujet initial)

Pour ce qui est d'une interface graphique découpée en tranches, je te suis à 100% et je vois pas non plus comment intégrer çà en fluide..

Dites nous donc !

[thick]

Salut Rockz,

Je me laisse pas faire, mais le débat qu'on allait entamer est sans fin ...

Surtout qu'il y a du vrai dans ta réponse et que je suis pas allé au bout de mon argument. Sur un prochain post, on pourra se livrer bataille ...

Sinon, je te propose une visite sur Zen Garden pour voir qu'on peut quand même faire des choses sympas avec tout ce bazar de standards du Web et autre bizzarerie du W3C. Ce site est là pour illustrer comment tu peux changer tout le design d'un site par un click de souris en passant par du XHTML et Full CSS.

En espérant que tu apprécies la visite.

Moi aussi j'attends que qq'un nous dise comment faire une interface à 100%

@+

[Monique]

Bonjour,

Je voudrais d'abord revenir sur la notion d'adaptation au public.

Il ne faut pas comprendre cela comme une limitation ni comme une obligation de création selon une mode ou le goût du plus grand nombre.

Le Web n'est pas un support figé une fois la création terminée (contrairement au papier) : il y a la variété du matériel de lecture ou celle des habitudes de navigation des internautes, il y a les différentes aptitudes ou les handicaps des internautes.

En ne travaillant pas avec cela à l'esprit, le webmaster restreint ses catégories de visiteurs. Exemple : je suis incapable de consulter un site d'information en flash avec une taille de police minuscule, un site avec un contraste de couleurs texte/fond insuffisant... (je n'ai plus des yeux de 20 ans )

Je ne vois donc pas comment il serait possible de créer un site accessible (= lisible dans les meilleures conditions possibles et dans le plus grand nombre de situations possibles) à partir d'une maquette où la position de tous les éléments est prévue au pixel près, si belle soit-elle.

[Dinostrate]

Je dirai même plus, (comme l'un des deux "pseudo jumeaux" célèbres sais plus si c'est celui dont le nom finit avec un d ou avec un t) Ca m'énerve de ne pas pouvoir modifier la dimension des polices (tiens, encore la police ) alors que c'est une fonctionalité prévue par tous les navigateurs, sans exception (à ma connaissance).

Je déplore complètement que l'on puisse utiliser les feuilles de style pour empêcher les utilisateurs de dimensionner autrement !.... mais bon.... il faut dire aussi qu'il existe des contraintes générées par les (mauvaises ?) habitudes....

Dino

[Rockz]

((Apartée >>

utiliser les feuilles de style pour empêcher les utilisateurs de dimensionner autrement

Je comprends pas là Dino, peux-tu préciser ? Je pensais que CSS et blocs permettaient justement à l'utilisateur de consulter un site qqsoit la dimension du navigateur.

adaptation au public. Il ne faut pas comprendre cela comme une limitation ni comme une obligation de création selon une mode ou le goût du plus grand nombre..habitudes de navigation des internautes, il y a les différentes aptitudes ou les handicaps

Pas de soucis Monique Tu parles ici de l'intégration d'interfaces en proportionnel avec CSS/XHTML, qui permettent de s'adapter à un éventail le plus large possible d'internautes. On est d'accord dans ce cadre; en parlant du "gout du plus grand nombre", il s'agissait alors de l'adaptation au public dans les cadres littéraire, musical, .. où le fait de dire qu'on "se limite en s'adaptant au public" se justifiait plutot bien Je veux pas paraître lourdingue ni inquisiteur à faire du QUOTE à fond les galoches, mais çà prouve au moins que j'analyse avec attention et interet vos écrits Faut que je me mette aux discussions en PV je crois, 'va faire foirer le sujet sinon; thick et moi avons abandonné le débat des pour/contre de "l'adaptation" en ce qui concerne le topic) <<))

comment il serait possible de créer un site accessible (= lisible dans les meilleures conditions possibles et dans le plus grand nombre de situations possibles) à partir d'une maquette où la position de tous les éléments est prévue au pixel près

interface graphique découpée en tranches, je te suis à 100% et je vois pas non plus comment intégrer çà en fluide

comment tu peux faire une interface graphique, la découper en tranches et mettre tout ça en design fluid

Sinon, on tourne bien autour de la même question, n'attends plus que des témoignages et explications techniques de Photoshopistes et Fireworkers Voir les questions précises dans les postes précedents (le bâteau dérive ..)

Pour CSS Zen Garden, les interfaces graphiques les plus complexes (maya, springtime) sont réalisées en "fixe" .. L'interface d'origine avec les nénuphares n'est proportionnelle qu'uniquement sur les blocs n'ayant aucun fond graphique (la colonne de gauche avec les nénuphars en fond est fixe par exemple) A croire qu'il faut se résigner à utiliser un fond blanc pour les blocs proportionnels et abandonner toute recherche graphiqe

Allez svp, que ceux qui ont déjà bien planché sur les interfaces graphiques intégrées en proportionnel (ratés, difficultées, points cruciaux, méthodes) nous apportent témoignages et conseils.

Les questions se trouvent plus haut Du concret , du technique !

[thick]

Fallait pas lancer le topic avec le W3C.

C'est dur de défendre la cause des standards du Web !

Pour adresser directement ta question, je crois qu'il faudra te résoudre à faire un mix ...

J'imagine le fond, s'adaptant aux fenètres du navigateur, mais qui contiendrait une partie de ton design. Cette partie pourra se voir squizzée et étirée sans broncher.

L'autre partie de ton interface serait fixe et contiendrait les éléments qui ne peuvent pas changer.

Tu peux très bien mettre des tableaux dans tes div, même si c'est un peu "contre-nature".

Par contre, ça va être un peu chaud car il va sans doute falloir manipuler les fluxs comme il faut, mais je pense que c'est réalisable comme ça.

Voilà, j'ai vraiment essayé de faire avancer le schmilblik (c'est comme ça que ça s'écrit?), mais je sais pas si mon idée est bonne ?

[Raphael]

Sites fluides = mort du webdesign ?

Je pense qu'on peut en juger ici : http://www.cssvault.com/

Il y'a pas mal de sites fluides et ça vaut le détour !

[thick]

Ah Sibelius, mon maître !!!

Heureusement que tu passes par là. C'est une peu comme Zorro qui arrive sans se presser...

Rockz, va falloir t'accrocher pour contredire Sibelius, y a du répondant !!!

@+

thickparasite

[Rockz]

Merci thick, on va donc tenter le mélange div table =]

Bah tu sais, depuis que j'ai eu mes premiers émois CSStiques au travers des tutoriaux d'Alsacréations, il ne se passe plus un jour sans que j'invoque 3 fois le nom de Sybelius avant chaque repas (vive le répondant )

Heeu sinon pour CSSVault, merci pour le lien, y'a plus qu'à analyser comment ces interfaces sont integrées WebDesign is still alive ! Yeaah !

Et la ch'tite boule roule et roule toujours >>>