Adapter aux résolution des visiteurs

bonjour,

Je viens vous voir car j'ai besoin d'aide .

J'ai crée un site a partir d'une image que j ai découpé et travaillé sur dreamweaver après.
Je me suis aperçu que le site ne s'adapter a toute les résolutions et que je me retrouvais forcement avec des marges sur les cotés. Il me semble un code java ou javascript qui permet d'adapter le site aux résolutions des utilisateurs.

Est ce une bonne solution ? Auriez-vous des conseils à me donner ?

Merci de votre aide
a bientôt
Tense

Salut,

Il n'y a pas de solution miracle pour adapter ton site à la résolution d'écran de tes visiteurs. Il y a, en gros, 2 approches possibles :

1. travailler en largeur fixe, avec un espace vide sur les résolutions supérieures à la résolution "cible". Dans ce cas, on définit en général la largeur globale de la page en pixels.

2. travailler en largeur fluide, avec une largeur de page proportionnelle à la largeur de la fenêtre, ce qu'on peut obtenir en définissant la largeur en %.

La deuxième solution est souvent plus délicate à gérer correctement, surtout lorsque le design n'a pas été prévu pour cet usage.

Il y a un article récent expliquant les différentes possibilités sur smashing magazine (en anglais)

Merci de ta reponse rapide.

Le souci aujourd'hui s'est que le site a ete fait sous photoshop, une image découpé avec les tranches.
En gros s'est une photo avec les élément du site dessus, et que j'ai découpé, et exporté grace a l'outils tranche dans dream afin qu'il me creer la page que j'ai plus qu'a envoyé sur le web.

Je ne peux pas séparer les éléments. si non un vide se creer dans mon image.

J'espère avoir ete explicite dans ma description

J'ai fait pas mal de recherche sur le net mais je trouve pas pour le style de site que j'ai fait. (peut etre un peu trop simple peut etre)

tense a écrit :
Le souci aujourd'hui s'est que le site a ete fait sous photoshop, une image découpé avec les tranches.
En gros s'est une photo avec les élément du site dessus, et que j'ai découpé, et exporté grace a l'outils tranche dans dream afin qu'il me creer la page que j'ai plus qu'a envoyé sur le web.

Oui c'est effectivement le gros problème : un design fluide se prépare et se conçoit en amont.

Je ne suis pas à l'origine du design en amont, il faut que je me débrouille avec ça pour les mettre en ligne .. On me demande donc que le site soit adapter a la résolution de tous les utilisateurs . C'est pour cela que je viens de vous demander votre aide.
Encore Merci

tense a écrit :
On me demande donc que le site soit adapter a la résolution de tous les utilisateurs.

Réponse courte: ce n'est pas possible.

Réponse longue: ça veut dire quoi «adapté»? Si le site présente peu de contenu et que j'ai un écran 24 pouces avec une fenêtre de navigateur sur toute la surface de l'écran, est-ce qu'il faut «zoomer» le site afin qu'il occupe toute la surface, quitte à présenter des graphismes extrêmement pixelisés et un texte très gros? À l'inverse, sur mon écran de smartphone, le site doit-il être réduit à une vignette? Il faudrait donc d'abord savoir de quel type d'adaptation on parle.

Ensuite, une fois l'adaptation voulue définie, on pourra dire si elle est possible et comment. Mais, vu ce que je sais de l'état de l'art dans ce domaine, et ce que l'on peut deviner de test compétences techniques, je dirais à priori que 1) il n'y a pas de solution miracle, 2) les solutions réelles doivent être prises en compte avant la création du design et 3) elles demandent une bonne maitrise de HTML-CSS (et éventuellement JavaScript) pour être mises en place.
Modifié par Florent V. (30 Jun 2009 - 19:50)

tense a écrit :
Je ne suis pas à l'origine du design en amont, il faut que je me débrouille avec ça pour les mettre en ligne ..

En gros, tu fais de l'intégration, c'est donc à toi de découper cette image (j'espère pour toi qu'il s'agit d'un fichier psd dont les calques n'ont pas été écrasés, si ce n'est pas le cas, demande un autre fichier) pour l'intégrer.

Pour faire un design étirable, le découpage de l'image sera différent de celui pour un design figé.