Version complète: sur le forum Webmaster Hub : problème pour optimiser un site pour tout écran
Webmaster Hub > Création et exploitation de Sites Internet > Les fondations d'un site > Le Webdesign
silvanoo
Bonjour à tous!

En fait j'aimerais que mon site soit adapté à toutes les tailles d'écran, mais je ne vois vraiment pas comment faire.
En ce qui concerne l'éditeur html j'utilise front page.
Si quelqu’un pourrait m'expliquer une démarche simple à suivre ( je ne m' y connais pas beaucoup en langage html), ça serait vraiment sympa!
J'ai construit le design du site sur mon ordinateur portable ( 15,4 pouces) et quand je regarde ce que ça donne sur un écran plus petit, là alors j'hallucine car ça fait un truc énorme qui dépasse largement le cadre de l'écran!

A part ça j'ai une deuxième question :

En fait une fois que j'ai construit le design du site sur photoshop, je l'ai découpé avec le système intégré à photoshop. Ceci fait, j'ai amené le tout sur front page. Et le problème c'est que quand je veux créer des liens sur les parties découpées, les images en question sont entourés d’un trait bleu, et tout se décale. J’ai réussi à enlever le trait bleu, mais on voit toujours un espace avec un trait blanc. En fait dès que le lien est crée j’ai l’impression que l’image est légèrement redimensionné par front page ce qui fait que tout le « puzzle » se décale.

Voila j’espère que j’ai été claire dans mes explications !


Merci d'avance pour votre aide!
Phobos
Salut,
laisse tomber FrontPage et aprrend à développer en xhtml css wink.gif
baycris
Alors la tu vas etre confronter a deux clans :
les fous du valid w3c .... et de l'autre. les height="100%" ...
la solution peut etre simple c'est de definir un coté prioritaire du site et mettre le reste en % (pourcentage)...
Amicalement Cris.
silvanoo
Salut Cris! que veux tu dire par " coté prioritaire du site"?

Merci pour ton aide!
baycris
J'ai pris si tu veus mon côté gauche la ou il y a mon menu .... et je l'ai "fixé " avec un align="left" et tout ce qu'il va apres je lui dis a tant de disatance mais en height="100%" ou 80 a toi de voir...;
mais si tu cherche apres a avoir (purement pour la fierté perso ) car w3c sort tout les jours de nouvelles contraintes... (c'est pas une attaque juste une constation lol) mais il est pas mal d'apprendre le xhtml et les css qui sont plus propre et plus rapide a l'afichage...
mais encore faut il avoir le temps et le courage......
Cris.
destroyedlolo
Si tu ne veux pas tapper directement dans le code, je te conseile de laisser tomber M$-FrontPage pour passer a un autre editeurs (genre DreamWaver ...).
Le resultat sera deja plus correcte et aura plus de chance de fonctionner qq soit le navigateur de l'utilisateur ...
plumcake
pour les marges autour des images "linkée" un simple border="0" suffit (quand on est pas dificile)

ou beaucoup mieux dans une feuille de style :
CODE
img{
    border:0px;
}

pour faire plus propre... et en prime toutes les images du site n'ont plus de bordure en une seule fois whistling.gif

pour le tableau : l'attribut height dans une balise <td> ne fonctionne pas... tu peux toujours t'amuser.


wink.gif
davidm
J'ai envie de dire comme Phobos, ça fait longtemps que je code au bloc note mais bon restons réaliste, et ne dégoutons pas les débutants.

Je conseille NVU qui est un éditeur gratuit et assez conforme pour du WYSIWYG.

Mais ton problème n'a rien à voir avec l'éditeur. Il te faut des notions de base.
Il y a deux approches pour un site visibile sous toutes les configurations :

1) Définir une largeur proportionnelle en % ou (plus technique) en em (1 em = une fois la taille de la police utilisée pour le texte). A ce moment là ta marge, tes colonnes sont définies comme prenant une part donnée de l'écran. A utiliser avec précaution, les stats montrent que de plus en plus de gens sont au moins en 1280x1024 (17" plat) et ça rend parfois pas super... je ne parle même pas de ceux qui sont en 1600x1200. La lecture sur le web est plus difficile que sur papier, il faut des colonnes plus étroite pour un confort de lecture optimal.

2) Définir une largeur fixe. Dans ce cas, il faut s'en tenir à la résolution inférieure la plus communément admise soit 800x600. Ca veut dire en tenant compte des barres de défilement un site avec 760px de large. Diverses techniques permettent de centrer le site dans la page quelque soit la résolution. C'est l'option que je préfère, notamment pour des raisons de lisibilité. Mais elle peut poser problème pour surfer sur un tél portable ou une TV (auquel cas il sera bon de prévoir une CSS adaptée).

3) Combiner les deux approches. Ce qui se fait souvent c'est d'avoir les éléments de navigation gauche et droite fixe, avec une partie centrale variable.
thick
Tiens, encore plus facile pour démarrer :
http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS

Des templates de bases (merci Sibelius mon maître smile.gif) que tu peux customiser à souhait.
Tu as des designs en solid ou fluid.
Avec ça pour démarrrer, même pas peur d'attaquer la construction de page aux bloc note wink.gif
davidm
CITATION(thick @ mardi 19 avril 2005, 02h55)
Tiens, encore plus facile pour démarrer :
http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS

Des templates de bases (merci Sibelius mon maître smile.gif) que tu peux customiser à souhait.
Tu as des designs en solid ou fluid.
Avec ça pour démarrrer, même pas peur d'attaquer la construction de page aux bloc note wink.gif
*


C'est vrai, et c'est excellent pour apprendre. On en trouve un peu partout (les mêmes d'ailleurs...). Mais dès que l'on veut faire quelque chose de moins "standard", il faut quand même faire un chtit effort ^_^
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.