Nettoyage du code

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Monky, 22 Novembre 2006.

  1. Monky
    Monky WRInaute discret
    Inscrit:
    2 Avril 2006
    Messages:
    77
    J'aime reçus:
    0
    Bonsoir,
    Je ne suis pas très fortiche en design mais je souhaiterais le réaliser moi même... J'utilise dreamweaver et remarque que mon code a l'air absolument affreux!!
    Ce serait génial si quelqu'un pourrait m'aider à corriger cette page "modèle" tout en donnant quelques tuyaux afin de palier aux encarts de dreamweaver!
    Merci !

    Code:
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/phpl; charset=iso-8859-1">
    <LINK href="monsite.net/css/page.css" type=text/css rel=stylesheet>
    <LINK href="monsite.net/css/menu.css" rel=stylesheet type="text/css">
    <script language="Javascript" type="text/javascript" src="monsite.net/scripts/menu.js"></script> 
    <SCRIPT LANGUAGE=JavaScript>
    
    function ejs_img_fx(img){	
    	if(img && img.filters && img.filters[0]){
    		img.filters[0].apply();
    		img.filters[0].play();
    	}
    }
    </SCRIPT>
    </head>
    
    <body >
    <center>
    
      <table width="994" border="0" cellpadding="0" cellspacing="0">
        <!--DWLayoutTable-->
        <tr> 
          <td height="201" colspan="3" valign="top"> 
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
              <!--DWLayoutTable-->
              <tr> 
                <td width="994" height="201" valign="top"><img src="monsite.net/design/topbanner.jpg" width="994" height="201"></td>
              </tr>
            </table>
          </td>
        </tr>
        <tr> 
          <td width="202" valign="top" height="696"> 
            <table width="100%" style="BACKGROUND-REPEAT: no-repeat" background="monsite.net/design/leftmenu.jpg" cellpadding="0" cellspacing="0">
              <!--DWLayoutTable-->
              <tr> 
                <td width="198" height="160" valign="top">&nbsp;</td>
              </tr>
              <tr> 
                <td valign="middle" height="1" align="center"> 
                  <div align="center"><IMG height=1 
                      src="monsite.net/design/news-spacer.jpg" 
                      width=198></div>
                </td>
              </tr>
              <tr> 
                <td height="18" valign="top"> 
                  <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr> 
                      <td width="200" height="18" valign="top" align="center"> 
                        <div class="colonneGauche"> 
                          <?php 
      include('../scripts/menu.php');  // Nous appelons l'entete du site
    ?>
                        </div>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr> 
                <td height="192" valign="top"> 
                  <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr> 
                      <td width="200" height="82" valign="top"> 
                        <div align="center"><IMG height=1 
                      src="monsite.net/design/news-spacer.jpg" 
                      width=198></div>
                        <div align="center"><br>
                          <script type="text/javascript"><!--
    google_ad_client = "pub-32284";
    google_ad_width = 120;
    google_ad_height = 240;
    google_ad_format = "120x240_as";
    google_ad_type = "text_image";
    google_ad_channel ="";
    google_color_border = "B29E78";
    google_color_bg = "000000";
    google_color_link = "B29E78";
    google_color_url = "D7CCB9.phpl";
    google_color_text = "B29E78";
    //--></script>
                          <script type="text/javascript"
      src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
    </script>
                        </div>
                      </td>
                    </tr>
                    <tr> 
                      <td height="108"></td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr> 
                <td height="323"></td>
              </tr>
            </table>
          </td>
          <td width="591" rowspan="2" valign="top"> 
            <table width="100%" border="0" cellpadding="0" cellspacing="0">
              <tr> 
                <td colspan="3" height="19" valign="top">&nbsp;</td>
              </tr>
              <tr> 
                <td width="20" valign="top" rowspan="3">&nbsp;</td>
                <td width="550" height="74" valign="top"> 
                  <table width="550" border="0" cellspacing="0" cellpadding="0" align="left">
                    <tr> 
                      <td colspan="3"><img src="monsite.net/design/news-top.jpg" width="400" height="1"></td>
                    </tr>
                    <tr> 
                      <td valign="top" align="left" width="1"><img src="monsite.net/design/news-left.jpg" width="1" height="39"></td>
                      <td width="548"> 
                        <h1>Titre &gt; Sous titre</h1>
                      </td>
                      <td valign="bottom" align="right" width="1"><img src="monsite.net/design/news-right.jpg" width="1" height="39"></td>
                    </tr>
                    <tr align="right" valign="top"> 
                      <td colspan="3"><img src="monsite.net/design/news-bottom.jpg" width="400" height="1"></td>
                    </tr>
                  </table>
                </td>
                <td width="21" rowspan="3" valign="top">&nbsp;</td>
              </tr>
              <tr> 
                <td height="35" valign="top">&nbsp;</td>
              </tr>
              <tr> 
                <td height="1110" valign="top"> 
                  <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr> 
                      <td width="550" height="1110"></td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
          <td width="201" valign="top"> 
            <table width="100%" style="BACKGROUND-REPEAT: no-repeat" background="design/rigphpenu.jpg" cellpadding="0" cellspacing="0">
              <!--DWLayoutTable-->
              <tr> 
                <td width="197" height="152" valign="bottom" align="center"><img src="design/flag_en.jpg" width="31" height="18"></td>
              </tr>
              <tr> 
                <td height="12" valign="top">&nbsp;</td>
              </tr>
              <tr> 
                <td height="12" valign="top"> 
                  <div align="center"><img src="design/news-spacer.jpg" width="195" height="1"></div>
                </td>
              </tr>
              <tr> 
                <td height="181" valign="top"> 
                  <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tr> 
                      <td width="199" height="18" valign="middle" align="center"> 
                        <div class="colonneDroite"> 
                          <?php 
      include('scripts/1.php');  // Nous appelons l'entete du site
    ?>
                        </div>
                      </td>
                    </tr>
                    <tr> 
                      <td width="199" height="18" valign="middle" align="center"> 
                        <div class="colonneDroite"> 
                          <?php 
      include('scripts/2.php');  // Nous appelons l'entete du site
    ?>
                        </div>
                      </td>
                    </tr>
                    <tr> 
                      <td width="199" height="18" valign="middle" align="center"> 
                        <div class="colonneDroite"> 
                          <?php 
      include('scripts/3.php');  // Nous appelons l'entete du site
    ?>
                        </div>
                      </td>
                    </tr>
                    <tr> 
                      <td height="163">
                        <h2>+ LIEN RETOUR PAGE MENU</h2>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
              <tr> 
                <td height="40"></td>
              </tr>
            </table>
          </td>
        </tr>
        <tr> 
          <td height="502"></td>
          <td></td>
        </tr>
      </table>
    </center>
    
    </body>
    </html>
    


    Autre petite question sur les balises <h>, est ce que H2 peut précéder H1?
     
  2. medium69
    medium69 WRInaute passionné
    Inscrit:
    7 Mai 2005
    Messages:
    1 940
    J'aime reçus:
    3
    Pour être honnête, à cette heure-ci, j'ai la flemme de lire ton code.

    Pour la question des hn, oui mais non :wink:

    Oui car rien ne t'en empêche, et tu ne sera pas pénalisé pour autant.

    Non car tu va gêné la navigation des aveugles entres autres qui se servent d'un navigateur vocal par exemple.

    Et non car sémantiquement ce n'est pas correct
     
  3. yazerty
    yazerty WRInaute passionné
    Inscrit:
    19 Juin 2005
    Messages:
    1 230
    J'aime reçus:
    0
    Arg, ça ressemble à une orgie de tableaux alors que ça doit pouvoir se faire en css simplement.
    Si tu ne maitrises pas le css cherche des layout déjà pret à utiliser et/ou adapte :).
     
  4. Monky
    Monky WRInaute discret
    Inscrit:
    2 Avril 2006
    Messages:
    77
    J'aime reçus:
    0
    J'ai mis ma journée de hier pour faire le modèle de ma page en CSS et je pense que je vais continuer ainsi... par contre je devrais tout de même laisser quelques tableaux, nottament pour les pages "gallery" comprenant beaucoup de minuatures.
    Je recherche maintenant un menu en CSS vertical avec déroulement aussi vertical (genre un peu trre-menu), comme celui d' mais plus fluide et plus graphique http://tutorials.alsacreations.com/dero ... rtical.htm


    Juste quelques petites questions au sujet des CSS :
    - en quoi construire sont site avec les <div> apporte-t-il un avantage pour le référencement?
    - est ce que je dois nommer mes <div id="..."> avec des mot clés?
     
  5. Xou
    Xou WRInaute discret
    Inscrit:
    2 Juin 2006
    Messages:
    172
    J'aime reçus:
    0
    il ne faut pas bannir les tableaux mais les utiliser uniquement lorsque c'est nécessaire.

    A l'heure actuelle cette notion reste assez subjective, mais à l'avenir il se pourrait bien que les sites se confortant aux derniers standards du web soient avantagés par les moteurs.
    Aujourd'hui tout le monde essaye d'avoir un site valide mais bien peu se préoccupent réellement de la sémantique de leur page, qui, combinée à une mise en page en conteneurs (div) propose une page plus facilement compréhensible autant pour les hommes (les développeurs qui mettent le nez dedans) que les machines (les robots qui lisent les pages web).

    Cela ne rentre pas en compte dans le référencement de ton site et donc c'est à toi de définir une convention de nommage de tes éléments de page, uniquement pour en faciliter le développement et la maintenance.
     
  6. Marina_Kha
    Marina_Kha Nouveau WRInaute
    Inscrit:
    13 Novembre 2006
    Messages:
    9
    J'aime reçus:
    0
    Cela apporte surtout de la clarté dans l'exploitation ultérieure que tu feras de ton code, par exemple dans la maintenance des contenus ou si tu souhaites renforçer la présence de mots-clés à tel ou tel endroit de ta page.

    L'avantage du CSS est de mettre à part tout ce qui concerne l'organisation des données dans la page. Quand tu veux modifier le contenu de celle-ci (et tu le feras peut-être plus d'une fois pour améliorer tes classements) tu n'as plus qu'à traiter une page HTML remplie de contenu (la chair de la page), le CSS étant l'exo-squelette. Là, ton squelette est dans ton code, sous forme de tableaux... Pas très pratiques :)
     
  7. Leonick
    Leonick WRInaute accro
    Inscrit:
    8 Août 2004
    Messages:
    19 274
    J'aime reçus:
    0
    Ben non, justement c'est là où les CSS se justifient : par exemple 4 miniatures par ligne sur un 800x600, mais 6 sur un 1280 :wink:
    C'est tout l'intérêt des CSS et de l'utilisation des DIV en place et lieu des table.
    Sauf que j'ai des pages full table, car elles présentent des résultats, et là, ça justifie pleinement les <table>
     
Chargement...
Similar Threads - Nettoyage code Forum Date
Nettoyage du code HTML Débuter en référencement 23 Août 2006
WordPress Nettoyage BL spammy NSEO Netlinking, backlinks, liens et redirections 9 Novembre 2021
Nettoyage de requètes externes de Google, comment faire? Administration d'un site Web 24 Octobre 2020
GSC nettoyage couverture de l'index Débuter en référencement 29 Janvier 2020
Après un piratage et un nettoyage, que faire des mauvais backlinks persistants? Problèmes de référencement spécifiques à vos sites 26 Novembre 2019
Nettoyage d'un forum vieux de 15 ans ! Référencement Google 21 Février 2018
site hacké : conseil nettoyage google webmastertool Demandes d'avis et de conseils sur vos sites 6 Janvier 2017
Page nettoyage impossible de faire son referencement sur Google Référencement Google 26 Novembre 2016
Nettoyage champs formulaire Développement d'un site Web ou d'une appli mobile 13 Octobre 2016
Nettoyage htaccess au karcher URL Rewriting et .htaccess 19 Novembre 2015
Site de nettoyage industriel Demandes d'avis et de conseils sur vos sites 9 Mars 2015
Nettoyage de fichier : quels clients conserver ? Administration d'un site Web 21 Septembre 2012
Nettoyage de base et vérification SMTP de la validité d'un email Administration d'un site Web 2 Septembre 2010
Votre avis sur mon annauire de nettoyage cryogénique Demandes d'avis et de conseils sur vos sites 30 Novembre 2009
preg_replace nettoyage extrème Développement d'un site Web ou d'une appli mobile 25 Mars 2009
Problème nettoyage referer Développement d'un site Web ou d'une appli mobile 14 Septembre 2007
Nettoyage d'une liste de diffusion Développement d'un site Web ou d'une appli mobile 14 Septembre 2007
Nettoyage d'un serveur. Administration d'un site Web 17 Novembre 2006
Nettoyage Html sous Dreamweaver 8 Débuter en référencement 7 Octobre 2006
Besoin d'un grand nettoyage Référencement Google 9 Février 2006