28173 sujets

CSS et mise en forme, CSS3

Bonjour Smiley smile

Je suis nouveau sur votre site web et j'ai grand besoin de votre aide pour la mise en page d'un design que j'ai créer ; c'est la 1er fois que je m'attaque à un design aussi complet et le gros problème c'est que sa va faire longtemps que j'ai pas touché à du CSS... mais bon faut pas se décourager Smiley lol . Voici donc le design en question :
upload/13820-Web-Design.png

Le problème que je rencontre pour l'instant c'est comment découper au mieux l'image ? Puisque l'en tête n'est pas de la même taille entre chaque extrémité donc sa facilite pas la chose, de plus j'ai une ombre porté qui passe au dessus des autres éléments et la j'ai aucune idée pour la mettre en place Smiley ohwell

Merci de vos conseil et bonne journée Smiley smile
Hello,

Juste pour savoir, tu as pensé au fait que IE6 ne supporte pas la transparence graduelle (PNG-24 avec couche alpha)? Que comptes-tu faire pour ce navigateur? Une simplification du design (sans ombres portées) avec des correctifs pour IE 5-6 appelés via un commentaire conditionnel?

Ensuite, l'image que tu présentes fait 1440px de large. As-tu réfléchi à l'adaptation de ton design en 1024px de large, voire en 800px de large? En 800x600, ton en-tête (titre alpha arts) est hors-champ, et le bloc principal de contenu ne tiendra pas, vu qu'il fait pile 800px de large... et qu'un écran en 800x600 implique une zone de visualisation large de 770px maximum (bordures de la fenêtre, barre de défilement, fenêtre pas forcément maximisée...).

De même, ton image de fond principal est un quadrillage qui se répète, mais donc certaines cases sont coloriées. Est-ce que les mêmes cases coloriées doivent se répéter régulièrement?

Mon sentiment général à propos de ce design est qu'il va nécessiter beaucoup d'efforts au niveau de l'intégration, car il prend peu en compte certaines contraintes techniques. C'est regrettable, d'autant plus que les efforts nécessaires ne me semblent pas, en toute honnêteté, à la hauteur du résultat espéré. C'est-à-dire qu'il s'agit d'un design relativement médiocre (désolé... Smiley confused ), et qu'il serait quelque part assez rageant de multiplier les efforts pour l'intégrer.

Peut-être est-ce l'occasion de revoir sa copie avant de se lancer dans l'intégration? De moins abuser des ombres portées, de penser à l'adaptabilité en largeur, etc.?
Merci de ta réponse c'est très sympa de ta part Smiley smile

a écrit :
Juste pour savoir, tu as pensé au fait que IE6 ne supporte pas la transparence graduelle (PNG-24 avec couche alpha)? Que comptes-tu faire pour ce navigateur? Une simplification du design (sans ombres portées) avec des correctifs pour IE 5-6 appelés via un commentaire conditionnel?
Je sait que IE ne supporte par la transparence et c'est bien dommage ; mettre en place une simplification du design est pour moi à proscrire car sa ressemble plus à de la discrimination ; donc la mise en transparence en gif dans ce cas.

a écrit :
Ensuite, l'image que tu présentes fait 1440px de large. As-tu réfléchi à l'adaptation de ton design en 1024px de large, voire en 800px de large? En 800x600, ton en-tête (titre alpha arts) est hors-champ, et le bloc principal de contenu ne tiendra pas, vu qu'il fait pile 800px de large... et qu'un écran en 800x600 implique une zone de visualisation large de 770px maximum (bordures de la fenêtre, barre de défilement, fenêtre pas forcément maximisée...).
J'ai pensé à la chose ; mais j'ai aussi pensé au écran plus large ! Car il faut avouer les 800*600 se font tout de même de plus en plus rare ! La solution est donc que la bannière puisse s'adapter ; en gros les petites résolution voit la bannière rétrécir tandis que les plus grande se verra joindre des bandes noir supplémentaire mais la je ne sait guère si il serait possible de le faire puisque la bannière possède de hauteur différente sur chaque côté Smiley ohwell
Pour info j'ai commencer par faire le design pour mon écran (soit la résolution de mon image) ; mais sa ne passe pas sur le l'écran du PC à mon frére (il a une résolution encore plus grande !).

a écrit :
De même, ton image de fond principal est un quadrillage qui se répète, mais donc certaines cases sont coloriées. Est-ce que les mêmes cases coloriées doivent se répéter régulièrement?
La je met en place une texture qui comporte X * X case donc sa pose aucun problème... je voit comprend pas trop ta remarque Smiley ohwell

a écrit :
Mon sentiment général à propos de ce design est qu'il va nécessiter beaucoup d'efforts au niveau de l'intégration, car il prend peu en compte certaines contraintes techniques. C'est regrettable, d'autant plus que les efforts nécessaires ne me semblent pas, en toute honnêteté, à la hauteur du résultat espéré. C'est-à-dire qu'il s'agit d'un design relativement médiocre (désolé... Smiley confused ), et qu'il serait quelque part assez rageant de multiplier les efforts pour l'intégrer.
Tu peut trouvé le design médiocre c'est tout à fait normal ; mon objectif était de travailler avec plusieurs couleur et rajouter divers effet de hauteur ; bref c'est plutôt quelque chose qui me plaît ; mais pas forcement à tout le monde Smiley smile
Il sera certainement très retravailler mais si déjà la j'ai divers problème pour penser à la découpe autant stopper maintenant et poser bien les bases.
Par contre réfléchir en se limitant au contrainte technique est quelque chose qui me fait vraiment chi** ; un truc qui me soule bien c'est de devoir si limiter à cause de certaine limite ; dans ce cas la passer à Flash ? Je trouve que c'est pas forcement une mauvaise idée mais j'y connais rien et j'ai pas envie de me mettre dessus pendant 3 mois juste pour mettre en place mon site Smiley ohwell

Donc maintenant il faudrait que je puisse mettre en place tout sa ; cependant je trouve l'ambiance plutôt bien, et je souhaite mettre le fond ; dans ce cas la le décliner en mode extensible sera peut être plus simple... je vais essayé de rebouger un peu et on verra bien ; mais j'ai pas trop envie de toucher au ombre porté qui me donne la profondeur qui me plaisait Smiley decu

Par contre est-ce que tu pourrait être plus précis sur ce que tu trouve moyen ?

Merci bien.