Création site Internet - Problème de mise en page

[couette007]

Bonjour,
J'ai créé un site Internet avec Dreamweaver.
Je me suis aidée d'un des modèles que proposait le logiciel.
Le soucis c'est que un fois le site mis en ligne, la mise en page est complétement modifiée... Alors que sur mon PC, la mise en page est parfaite !
Sur Internet, tout est décalé : les textes, les logos, les images...
Je ne comprends pas pourquoi ? Qu'elle étape ai-je manqué pour que ma mise en forme soit toute modifiée ?
Je suis novice dans la création de site Web... et le language technique n'est pas mon fort ! lol Donc, si vous avez la solution à mon problème, merci de bien vouloir me l'expliquer de la manière la plus simple possible
Je vous donne l'adresse du site pour que vous puissiez mieux visualiser le soucis : www.plie-limoges.fr
Merci pour votre aide.
A bientôt.
Couette007

[Neroptik]

couette007,

Je crains qu'il n'y ai pas de solution toute faites. Tu viens tout juste de mettre le doigt sur le point faible du WYSIWYG : quand tu ne sais pas comment ca fonctionne dèrrière, ca donne nimporte quoi .
Et oui.... le developpement web ce n'est pas comme faire ton CV sous WORD : c'est surtout un métier .

Tu a trois solutions qui s'offrent à toi.

• Soit tu apprend les bases du CSS et du xHTML.
• Soit tu bidouille des heures sur DW et au bout d'un moment (qui peut durer plusieurs semaines) tu arrivera à tes fins. Utilise l'aide de DW elle est très complète.
• Soit tu ne veux pas apprendre les rouages du web et encore moins galérer des heures sur DW et tu choisis une solution plus pratique et qui ne demande aucune notion de programmation style : Joomla ou encore Zwook.

La meilleur solution à mes yeux est bien sur la première. c'est la seule et unique manière d'obtenir des compétences en developpement web, ça va te permettre d'aller aussi beaucoup plus loin qu'avec les Wizzards de DW, de faire du travail plus propre, et d'ajouter à ton panel de savoir les langages web.

Perso je travail sous DW comme toi mais je suis en mode codeur en permanence le seul interet de ce logiciel à mes yeux est la coloration syntaxique qui (a mon gout) est particulièrement bien conçue, et surtout et principalement l'autocomplétion et l'aide au developpement que je n'ai retrouvés jusqu'ici dans aucun autre logiciel. (ce qui te permet de ne pas faire d'erreure de syntaxe etc...). Par concequant je ne peut pas trop t'aider car les assistants de DW me sont inconnus.

Pour faire du joli et du fonctionnel il faut bannir le WYSIWYG de ses habitudes.

Désolé de n'apporter aucune solution concrète a ton problème. J'éspère juste que mes remarques t'aideront dans l'avenir. Et si tu souhaite te lancer dans le developpement proprement dit je serai volontier de ceux qui t'aideront.

Cordialement,
Neroptik

[Aspic]

C'est un problème récurrent, il faut respecter les normes W3C et valider ses pages au validateur pour vérifier que le code est correcte. Ca t'évitera ce genre d'ennuies ! Sinon utilise le CSS pour les styles et dissocie la partie CSS et (X)HTML de tes pages Web.

Bonne chance

[Neroptik]

Je viens de verifier, meme si elle corrige le code pour qui soit valide W3C les problemes de disposition et les décalages resterons....

En fait le vrai soucis c'est la qualité du code :

Voila un bout de la source ...

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<table width="391" height="363" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td width="391" height="26" class="pageName"><div align="center" class="Style8">LES PLIE EN FRANCE </div></td>
        </tr>

        <tr>
          <td height="299" class="bodyText Style7"><div align="justify" class="Style18"> I<span class="Style15">ssus de la loi du 29 juillet 1998 d'orientation relative &agrave; la lutte contre les   exclusions et r&eacute;gis par la circulaire DGEFP 99/40 du 21 d&eacute;cembre 1999, les PLIE, Plan Locaux pour l&rsquo;Insertion et l&rsquo;Emploi,   constituent des programmes de mise en coh&eacute;rence des interventions publiques au   plan local afin de favoriser l'acc&egrave;s ou le retour &agrave; l'emploi des personnes les   plus en difficult&eacute;s. Les PLIE constituent des dispositifs  originaux et innovants, aussi bien dans les parcours qu&rsquo;ils mettent en place  pour les personnes en difficult&eacute;s que dans les partenariats qu&rsquo;ils mobilisent. Les PLIE d&eacute;veloppent une approche globale de la personne, de ses  difficult&eacute;s, et proposent des actions &agrave; la fois sociales et professionnelles,  pour lever tous les obstacles &agrave; l&rsquo;emploi. Gr&acirc;ce &agrave; une m&eacute;thode partenariale, ils tissent des liens  avec l&rsquo;&Eacute;tat, garant des actions conduites au regard des orientations du Fonds  Social Europ&eacute;en, la R&eacute;gion  et le D&eacute;partement. Il noue des partenariats avec l&rsquo;ANPE, la Mission Locale, les  entreprises du bassin d&rsquo;emploi, les partenaires sociaux ainsi que les  structures associatives qui oeuvrent pour le d&eacute;veloppement de l&rsquo;emploi et la  lutte contre le ch&ocirc;mage. Il fa&ccedil;onne de ce fait, sur son territoire, une  strat&eacute;gie coh&eacute;rente pour l&rsquo;emploi et l&rsquo;insertion.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div></td>
        </tr>
      </table>
     
    <div id="Layer7"><a href="http://www.travail.gouv.fr/FSE/" target="_blank"><img src="Logo et doc/nouveau logo europe.jpg" width="89" height="73" /></a><a href="http://www.service-public.fr/" target="_blank"><img src="Logo et doc/R&eacute;publique fran&ccedil;aise.JPG" width="68" height="48" border="0" /></a><a href="http://www.agglo-limoges.fr/" target="_blank"><img src="Logo et doc/CALM.JPG" width="81" height="71" border="0" /></a><a href="http://www.ville-limoges.fr/" target="_blank"><img src="Logo et doc/Ville de limoges.jpg" width="57" height="65" border="0" /></a></div>
    <div id="Layer8">
      <p align="center"><a href="http://www.cr-limousin.fr/" target="_blank"><img src="Logo et doc/logo conseil r&eacute;gional.JPG" width="53" height="44" border="0" /></a><span class="Style12"> CONSEIL REGIONAL</span></p>
      </div>

ou encore :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<td width="252" height="388" class="smallText"><p><strong><span class="Style21">&nbsp;&raquo; <a href="Pages annexes/Edito.html" class="Style21">&Eacute;DITO</a></span></strong></p>
         <p>&nbsp;</p>
         <div id="Layer11"><img src="Logo et doc/Etoile 2 petite.jpg" width="55" height="40" /></div>
         <p><strong> &nbsp; <span class="Style21">&raquo; <a href="Pages annexes/Actualit&eacute;s.html" class="Style21">ACTUALIT&Eacute;S</a></span></strong></p>
         <p>&nbsp;</p>
         <p>&nbsp; <span class="pageName Style9"><strong>&raquo;<u>QUELQUES CHIFFRES</u></strong></span></p>
         <p align="left"><span class="Style3">&nbsp;&nbsp;&nbsp;&nbsp; Au 1er janvier 2007, le PLIE c'est : </span><br />
           &nbsp;&nbsp;&nbsp;&nbsp; <span class="Style18">• Plus de 750 personnes accompagn&eacute;es dans leurs<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; d&eacute;marches, </span><br />
<span class="Style18">&nbsp;&nbsp;&nbsp;</span> <span class="Style18">• D&eacute;j&agrave; plus de 350 personnes qui ont retrouv&eacute; un <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
emploi durable.</span><br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a name="Quelques_chriffres" id="Quelques_chriffres"></a><span class="Style23">&gt;&gt;</span> <em><a href="Pages annexes/Quelques chiffres.html">En savoir plus... </a></em></p>         </td>
       </tr>
    </table>    </td>

Cela se passe de commentaires....

EDIT : il n'y a que 15 erreures de syntaxe (W3C) et ce sont principalement l'absence du parametre "alt" des images qui en soit ne gène en rien.

[Aspic]

Oulalala c'est clair que le code est mauvais

La bonne vielle méthode avec les tableaux est désuée maitenant mieux vaut utiliser les balises DIV (ou bloc)

[N1bus]

Bonjour,

Le probleme viens plutôt des liens vers tes fichiers non?

Code :

1
2
3
4
 
background="file:///C|/Program%20Files/Macromedia/Dreamweaver%208/Configuration/BuiltIn/StarterPages/mm_dashed_line.gif">
 
<link rel="stylesheet" href="file:///C|/Program%20Files/Macromedia/Dreamweaver%208/Configuration/BuiltIn/StarterPages/mm_health_nutr.css" type="text/css" />

Il faut que tu mettes des liens (relatifs ou absolus) vers les fichiers de ton site . Ici les liens vers tes images ou de ton fichier de style pointent sur ton PC (chez toi) . Ils ne peuvent êtres accessibles par le serveur Web où tu as hébergé ton site . Ton fichier de style n'est pas chargé, tes images ne sont pas affichées.


Tu as également des problèmes avec la syntaxe des lien href ou des noms de fichiers :

Code :

1
2
3
 
<a href="L'acc&egrave;s employeur.html" class="navText">L'ACC&Egrave;S EMPLOYEURS</a>
<a href="Pages annexes/Contact PLIE.html" class="Style24">CONTACT</a>

Plusieurs règles à connaitre pour les liens href ( donc les noms de fichiers) :

• tout en minuscule
• pas d'accent
• pas d'espace (à remplacer par - ou _ )

Ainsi tu seras sûre que les liens fonctionneront sur n'importe quel serveur.
A moins que tu utilises UrlRewriting mais je ne pense pas que ce soit le cas.

Envoyé par Neroptik

La meilleur solution à mes yeux est bien sur la première. c'est la seule et unique manière d'obtenir des compétences en developpement web, ça va te permettre d'aller aussi beaucoup plus loin qu'avec les Wizzards de DW, de faire du travail plus propre, et d'ajouter à ton panel de savoir les langages web.

Obtenir des compétences ? Travail plus propre ? Beaucoup plus loin ?
Sur quoi te bases-tu pour dire des trucs comme ça ?
C'est pas parcequ'un developpeur utilise DW qu'il est forcément une brelle ou qu'il fait du travail "sale" .

Envoyé par Neroptik

Pour faire du joli et du fonctionnel il faut bannir le WYSIWYG de ses habitudes.

Idem . Voir ci-dessus.
Pour les débutants, les assisstants (WIZARDS) et le WYSIWYG sont pourtant trés pratique pour se familiariser avec le logiciel. C'est aprés quelques (nombreuses) heures de WYSIWYG qu'on entre dans le dur et qu'on peut mettre les mains dans le code.


Quant à la validation W3C, elle a bon dos !
A croire que si le site n'est pas validé on commet l'irréparable en osant le mettre en ligne. L'essentiel n'est il pas que le site s'affiche et fonctionne correctement sur plusieurs navigateurs ? Tous les navigateurs respectent-ils W3C ?

C'est récurrent dans les forums les interventions du genre "Ouaip, ton site est même pas valide, bla bla bla .." . Mais ça n'aide pas le posteur qui demande de l'aide.

Note : Je n'ai rien contre W3C et je trouve plutôt bien qu'on essaye de standardiser le Web mais je trouve l'argument un peu facile ... C'est la mode en ce moment ...

[Neroptik]

Envoyé par N1bus

Bonjour,
btenir des compétences ? Travail plus propre ? Beaucoup plus loin ?
Sur quoi te bases-tu pour dire des trucs comme ça ?
C'est pas parcequ'un developpeur utilise DW qu'il est forcément une brelle ou qu'il fait du travail "sale" .


Citation:
Envoyé par Neroptik
Pour faire du joli et du fonctionnel il faut bannir le WYSIWYG de ses habitudes.

Idem . Voir ci-dessus.
Pour les débutants, les assisstants (WIZARDS) et le WYSIWYG sont pourtant trés pratique pour se familiariser avec le logiciel. C'est aprés quelques (nombreuses) heures de WYSIWYG qu'on entre dans le dur et qu'on peut mettre les mains dans le code.

Sur quoi je me base ? on peut faire le test ... le code que j'ai pu voir n'est pas développé a la main il est générer par les assistants. ce qui creer du code un peu (voir meme beaucoup) fouillis.

Je suis désolé mais si on ne sais pas que pour centrer une div dans une page (par exemple) il faut lui appliquer margin-left et margin-right en Auto, ce n'est pas l'assistant de DW qui le fera a ta place conclusion -> Il faut bien un minimum de connaissances.

La preuve en est : tu viens de rappeler les règles de base pour avoir une syntaxe qui fonctionne bien avec tous les serveurs. Considère tu alors que notre amis ne connais pas les bases ?

Oui les assistants aident beaucoup surtout quand on est novice mais il y a un minimum a connaitre. Et quand je dit cela, ce n'est pas un reproche.... loin de là...
Et personellement (ca n'engage que moi) je pense que le NotePad est la meilleur école.

Quant à la validation W3C, elle a bon dos !
A croire que si le site n'est pas validé on commet l'irréparable en osant le mettre en ligne. L'essentiel n'est il pas que le site s'affiche et fonctionne correctement sur plusieurs navigateurs ? Tous les navigateurs respectent-ils W3C ?

C'est récurrent dans les forums les interventions du genre "Ouaip, ton site est même pas valide, bla bla bla .." . Mais ça n'aide pas le posteur qui demande de l'aide.

Note : Je n'ai rien contre W3C et je trouve plutôt bien qu'on essaye de standardiser le Web mais je trouve l'argument un peu facile ... C'est la mode en ce moment ...

Là dessus je suis assez daccord... mais perso je m'eforce(m'impose) de la respecter.

Cordialement.

EDIT :

C'est pas parcequ'un developpeur utilise DW qu'il est forcément une brelle ou qu'il fait du travail "sale" .

Si tu avait pris la peine de lire mon poste en entier tu verrai que ce n'est pas dutout ce que j'ai dit ni ce que je pense.