website adapte resolution ecran

bonjour
j'ai cree 2 sites persos, et je voudrais savoir comment faire pour que ceux ci s'adaptent automatiquement a la resolution des visiteurs ? (si bien sur, cela est possible...mais j'ai vu des sites ou cela se fait, ou alors les pages sont creees en plusieurs exemplaires)
j'ai essaye des javascripts,sans resultat
je susi en 1024*768, mais avec les ecrans lats, de plus hautes def sont courantes
si vous avez une astuce (qui evite de faire en double ou triple le meme site) ...merci

Consulte le site www.w3schools.com : il est très complet.
Je te conseille de lire les pages :
http://www.w3schools.com/htmldom/dom_obj_screen.asp
http://www.w3schools.com/htmldom/dom_obj_window.asp
http://www.w3schools.com/htmldom/met_win_resizeto.asp
http://www.w3schools.com/js/tryit.asp?filename=try_dom_window_resizeto
+ fonction moveTo(x,y) de l'objet window
Récupères les informations sur l'écran grâce à l'objet screen, puis tu déplaces la fenêtre du navigateur au point (0,0) (en haut à gauche) et tu redimensionnes la fenêtre avec resizeTo(hauteur_de_l_ecran, largeur_de_l_ecran).
Ca devrait donner ce que tu cherches à faire.

L'utilisation de simples % au lieu des pixels dans la taille des images et dans le CSS permet d'adapter le site entièrement à la résolution du visiteur.

Bien sûr !!!

Pourquoi faire plusieurs pages qui vont s'adapter à chaque résolution ?

Quelle lourdeur !!!

Alors que la puissance du CSS, permet de faire des sites complètements "élastiques"

En voici un exemple : http://pagesperso.laposte.net/divxtutos/testOK.php .
A noter que dans ce cas la boite s'étire en largeur en fonction de la résolution et en hauteur en fonction du contenu.

Bonjour a tous

Y a t'il quelque part un tutorial pour expliquer clairement l'utilisation de ces fameux "%" et des balises <div></div> étant débutant dans cette branche et ayant ce fameux problemes d'adaptabilité de résolution cela m'aiderait bien

Merci d'avance

Merci d'ouvrir un nouveau sujet pour ta question

merci Minus-et-Cortex mais je ne comprend spas trop l anglais
:-)
et N.Tary "Merci d'ouvrir un nouveau sujet pour ta question " :?
mais c'est justement le meme sujet la question de dede-70 non?
ca a un rapport direct avec ma question ikl me semble
;-)

d'apres fafane84 , c'est possible
il suffit par ex de creer un grand tableau avec taille 100% , et de mettre tout le contenu dedans?
est ce comme ca?

bah oui pour la base mais reflechissez un peu

meme sans mettre 100% ca s'adaptera

pas besoin de CSS pour les %

bah si tu veux coder proprement et aux normes si

Plus d'infos sur le design fluide >>ici<<

<img src="image.png" alt="Image" width="70%" height="80%" />

Tout simplement et c'est conforme XHTML 1.0 .

Oula, je sais que je suis nouveau ici mais je me permais de réagir contre ce que vous dites aprsque la ya des horreurs. Alors grand squatteurs de ce forum ne le prenais pas mal.

Pas besoin d'utiliser les % pour avoir un design FLUID (qui s'adapate a la taille de l'écran)

->Loranriga

Les tableaux ne sont pas faits pour faire des mises en page ils sont fait pour présenter des données tabulaires a ce sujet je conseil l'article pourquoi la mise en page par tableaux est elle stupide :

http://www.cybercodeur.net/weblog/presentations/seybold/everything.html

Quelques liens FR pour apprendre le codage et positionnement en CSS :

http://www.tutoxconseil.com/v2/tutox.php?zone=1
http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html
http://css.alsacreations.com/

et plus precisement la gallerie de mise en page

http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS

->PC_EXPERT
Ton code est certe valide mais il aurait était bien mieux avec une gestion en CSS, de plus un site se résume rarement a une image.

je vous laisse en éspérant ne pas m'attirer trop de foudres

++

bien sûr, mais si tu veux avoir un logo + une preview + l'image en grand + une autre image plus petite ...
Tu fais combien de classes ?

L'utilisation du CSS permet d'appliquer les paramètres à l'ensemble de la page, voire même du site, avec les quelques problèmes que cela pose en cas de particularité (création d'un nombre incalculable de classes)

Dans certains cas il vaut mieux utiliser le HTML directement.

A mon avis l'utilisation directe du HTML n'est bien que si tu a une seule fois un élément dans tout un site, si tu trouve cet élément une fois sur chaques pages tu fait un id et plusieurs fois sur chaques pages une classe. En fait il faut penser que les CSS permettent de tout changer d'un coup ce qui est souvent très sympa.

Si je peux me permettre, toutes les solutions que vous avancez sont bonnes, mais c'est pour adapter la taille du site à la taille de la fenêtre du navigateur et pas à la taille de l'écran. Je m'explique :
j'ai un écran LCD 17 pouces en 1280x1024, et mes fenêtres de navigateur WEB sont en 1024x768; quand je vais sur un site quelconque, celui-ci adaptera (avec vos solutions) sa taille à du 1024x768 et pas à du 1280x1024.
Il me semble que le titre du post est bien 'website adapte resolution ecran'.

non, c'est mathématiquement incorrect, car si ton affichage web est en 1024 * 768 et que tu affiches une image en 1280*1024, tu sera obligé d'agrandir ta fenêtre pour tout voir, donc passer en 1280*1024

A oui autant pour moi. En fait s'adapter a la résolution de l'écran c'est bien souvent s'adapater a la taille affichable dans le navigateur parsque si tu récupére la résolution par exemple en JS tu aura certe la taille de l'écran mais pas celle affichable (en raison des scrolls entre autres) donc tu peut faire un site de la taille de l'écran mais en ayant toujours le scroll horizontale qui est je pense a éviter au maximum.

En même temps je ne voit pas trop l'interet d'adapter un site a une résolution a part peut être pour des stats et encore ya mieux. Non francheemnt je voit aps je pense que Loranriga voulais un site qui s'adapte au navigateur.

Bon, disons que si je me suis planter je vais a genoux jusqu'a rome pour me faire pardonner ca marche ?

Le titre est trop vague, d'ailleurs ce n'est pas une erreur, l'autre solution n'ayant qu'un interêt très limité.

Il faut utiliser les % c'est le moins lourd et le mieux.

Je certifie que non : il y a deux barres de scrolling qui apparaissent sur ma fenêtre et si je veux tout voir, je 'scrolle'. Qui plus est, la plupart des navigateurs récents proposent par défaut d'adapter la taille des images à la taille de la fenêtre du navigateur si celle-ci est trop petite pour afficher la taille de l'image dans son entier

Justement, les % servent aussi à éviter les barres de scrolling horizontales

Et l'adaptation de l'image à la fenêtre ne se fait que lorsque l'on charge l'image directement (www.xxx.com/image.png)
Si elle est chargée directement dans la page, ce n'est pas toujours le cas.

Oula je suis perdu, on ne parle pas d'images mais de site. Sinon pour Loranriga je pense que tu peut te tourner vers un design JELLY qui t'éviterais bien des ennuis.

++

Il est rare de voir du texte déformer la page

Les % marchent aussi pour l'alignement, les menus etc...

merci a tous de participer a ce debat , car bcp de choses tres instructives ont ete dites
merci encore (je vais aller visiter les divers liens decris ici)
oui en fait je voulais que le site s adapte a ce que l on voit sur un ecran (surtout en largeur mais si hauteur on peut aussi c est encore mieux) c est a dire avoir la page en entier sans besoin de faire defiler pour voir le contenu en entier....
c est plus clair ?
car j ai remarque en surfant sur le net que seulement quelques sites (pros souvent) possedent cette technique
j ai lu aussi que les sites en flash (mais tout en flash c est pas joli a mon gout) s adapte automatiquement a l ecran

Bon en clair c'est ce genre de page >>là<< que tu veux faire ???

Bosses un peu le XHTML et surtout le CSS et tu y arriveras rapidement car ce n'est vraiment pas dur.

Par contre si tu veux un design fluide et sans tableaux, là ce sera un peu plus ardu.

Bon courage !!!

Liens utiles :
- Alsacreations
- Openweb
- Martius Web

Pour te rendre compte de la puissance des CSS un seul lien :
- Zen garden CSS

la pluspart des sites s'adaptent a la resolution d'ecran, meme les plus pourris (skyblog, ...)

les skyblogs sont loins d'être pourris. Le contenu peut-être, mais le code qui les gère est pas mal du tout.

pas tres beau mais effectivement apres verification valide xhtml 1.1 et css 2!
pour le systeme je peux pas dire...

je parlais surtout du contenu adoblog qui est tres bas

bouffé par la pub, dommage. Les webmasters pourraient être mieux utilisés ailleurs que pour des blogs remplis de connerie... M'enfin
En effet c'est du code valide, pourtant à la vue de la mise en page on dirait pas

Bonjour bonjour !

Voila j'avais posté sur ce topic une demande mais bon je viens de comprendre que ce n'est pas possible pour moi d'adapter le contenu de mon site aux résolutions ! En fait tout mon site va être réalisé à partir de photoshop donc en élément graphique ! Et on ne peut adapter la résolution sans étirer un élément graphique ! Je vais donc réaliser mon site à l'ancienne un coté pour le 1024 et un autre pour le 1200 ! En tout cas merci de votre aide quand même

si justement les % sont faits pour ça, si tu choisis les bonnes valeurs, l'image ne sera pas déformée.

Là tu réduis l'affichage de ton site à certaines résolutions.. Moi qui suit en 1280*1024 si je vois tout écrasé dans un coin je quitte direct.
Tout le monde fait ça, ceux qui utilsent des écrans plats <17' sont souvent en 1280*1024, leur nombre s'agrandit, tu ne peux pas les ignorer ...

Bonjour

Ben je ne sais pas trop je suis tres sceptique a vrai dire ! Je veux bien avec les % qu'on adapte pas mal de chose. Mais lorsque que comme moi le seul contenu de la page est un bloc graphique pur et dur sortit tout droit de photoshop je vois pas comment les % peuvent adapter sa taille ( ça sort de photoshop en 1024X768 ) a la page http://oclean.free.fr/1024.htm vous pouvez voir mon bloc graphique ce que vous voyez à cette adresse n'est qu'un seul fichier JPEG généré en 1024X768 par photoshop ! Je le vois mal s'adapter en 1280X1024 !

il se répète ( je suis en 1280*1024 ) sinon centre la avec un effet de fondu sur les cotés

Tu peux avec du code Javascript forcer la taille de la fenêtre du navigateur (si le navigateur le permet - Netscape peux empêcher ce genre de code, et je suppose que tout Mozilla aussi) - voir les liens plus haut.

Tu as mentionné un x-repeat ?

Nan mais là non seulement c'est lourd et en plus c'est foireux

oui firefox permet de donner la regle a javascript de ne pas redimensionner les fenetre