Aller au contenu

Strategie integration pr interface complexe


Rockz

Sujets conseillés

Salut,

Je vous soumets cette maquette HTML : GuiTarGeT

(Les liens ne marchent pas, les images sont lourdes, le chargement est long : juste une maquette en somme)

Cette interface graphique ne fera pas l'objet d'un projet abouti mais je souhaite m'en servir comme terrain d'essais pour l'integration "conteneurs+css+fluide", dans la mesure où elle semble complexe à integrer en conteneurs+css+fluide.

J'aimerais avoir vos avis sur la strategie de decoupe et d'integration à adopter pour cette maquette, et plus globalement, pour des interfaces graphiques complexes, lorsqu'on souhaite les integrer en css+fluide. Savoir egalement où sont les grosses difficultes et challenge lors de la future integration (les cadres arrondis deja ?)

Le but : anticiper les difficultes d'integration html au moment de la conception graphique, lorsqu'on vise une integration css+fluide (gros spam sur "css+fluide" dans ce post :D); connaitre les types de visuels/graphismes à eviter dans l'interface pour faciliter l'integration en css+fluide. (je ne suis pas webdesigner, mais l'integration decoule de l'interface graphique non ?)

Bah ouais, encore un topic qui découle de "sites fluides = mort du webdesign?" .. Ca m'obsède ? Naann pas du tout pensez-vous :D

P.S : si çà peut motiver certaines âmes libidineuses, le lien se trouve sur ifra**ce et c'est bourré de pubs X :P

Lien vers le commentaire
Partager sur d’autres sites

Bonjour Rockz,

Ma réponse ne sera pas celle que tu attends :rolleyes:

Je te dis : abandonne cette idée de page photoshop et de découpe !

Cette manière de travailler n'est pas adaptée au design fluide.

Je t'invite à lire cet article sur Pompage.net : Les coulisses d'un design.

Douglas Bowman y explique les étapes de son travail pour réaliser une feuille de style pour le Jardin Zen CSS.

En gros, il prépare ses matériaux (images, contenu) et réfléchi à la manière de les mettre en valeur, il dessine un projet de disposition de ces éléments...

Il commence sa feuille de style par la structure globale (dans ton cas : une entête et 3 colonnes, le tout dans un conteneur centré), il traite ensuite les détails...

Et même s'il a une idée de départ, il lui arrive de changer d'optique au cours de son travail...

Lien vers le commentaire
Partager sur d’autres sites

Merci Monique :D

C'est vrai, je m'attendais à autre chose, mais à force de lire tes posts, je sais que tu es de bon conseil :)

Et puis là tu donnes des conseils methodologiques, tres importants à mes yeux : Merki

Je m'empresse d'aller lire le lien !

Lien vers le commentaire
Partager sur d’autres sites

Je ne pourrais qu'approuver ce qu'a dit Monique.

La page est pour moi vraiment trop lourde (après optimisation, elle le serait quand même : 20 secondes de chargement en 4500 kb/secondes, c'est gigantesque).

Commence plutôt par réfléchir directement à la structure de ta CSS. Réfléchi à quels et combien de calques vas-tu utiliser. Et que vont-ils comporter ? Une fois que tu as l'organisation dans ta tête, tu peux faire les images, mais en pensant : "celle la, ce sera pour le calque de droite, ce sera l'image de fond", "celle la, c'est l'image de fond du calque où sera situé l'article", etc. ...

Ne pense pas en slices ImageReady mais en calques CSS. Ne te retrouve pas avec 50 images, mais avec 10, que tu sauras ou placer.

Bonne chance ;)

++

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...