| |
|
Voir le sujet précédent :: Voir le sujet suivant
|
| Auteur |
Message |
| |
|
Monky
WRInaute discret
Inscrit le: 02 Avr 2006
Messages: 93
|
 Posté le : Mer Nov 22, 2006 20:29 Sujet du message: Nettoyage du code |
|
|
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"> </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"> </td>
</tr>
<tr>
<td width="20" valign="top" rowspan="3"> </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 > 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"> </td>
</tr>
<tr>
<td height="35" valign="top"> </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"> </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? |
|
| |
|
 |
medium69
WRInaute accro
Inscrit le: 07 Mai 2005
Messages: 2151
Localisation: Je sais pas trop ;)
|
| Posté le : Mer Nov 22, 2006 20:36 Sujet du message: Re: Nettoyage du code |
|
|
| Monky a écrit: |
| Autre petite question sur les balises <h>, est ce que H2 peut précéder H1? |
Pour être honnête, à cette heure-ci, j'ai la flemme de lire ton code.
Pour la question des hn, oui mais non 
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 |
|
| |
|
|
yazerty
WRInaute accro
Inscrit le: 19 Juin 2005
Messages: 1682
|
| Posté le : Mer Nov 22, 2006 23:14 Sujet du message: Nettoyage du code |
|
|
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  . |
|
| |
|
|
Monky
WRInaute discret
Inscrit le: 02 Avr 2006
Messages: 93
|
| Posté le : Ven Nov 24, 2006 11:42 Sujet du message: Nettoyage du code |
|
|
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/deroulant/menu-vertical.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? |
|
| |
|
|
Xou
WRInaute occasionnel
Inscrit le: 02 Juin 2006
Messages: 187
Localisation: Tours, France
|
| Posté le : Ven Nov 24, 2006 14:33 Sujet du message: Nettoyage du code |
|
|
il ne faut pas bannir les tableaux mais les utiliser uniquement lorsque c'est nécessaire.
| Monky a écrit: |
- en quoi construire sont site avec les <div> apporte-t-il un avantage pour le référencement?
|
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).
| Monky a écrit: |
- est ce que je dois nommer mes <div id="..."> avec des mot clés?
|
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. |
|
| |
|
|
Marina_Kha
Nouveau WRInaute
Inscrit le: 13 Nov 2006
Messages: 9
|
| Posté le : Ven Nov 24, 2006 15:52 Sujet du message: Nettoyage du code |
|
|
| Monky a écrit: |
- en quoi construire sont site avec les <div> apporte-t-il un avantage pour le référencement?
|
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 |
|
| |
|
|
Leonick
WRInaute accro
Inscrit le: 08 Aoû 2004
Messages: 9181
Localisation: Val de Marne
|
| Posté le : Jeu Nov 30, 2006 1:22 Sujet du message: Nettoyage du code |
|
|
| Monky a écrit: |
| 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. |
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
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> |
|
| |
|
|
| |
|
|
|
|
Autres sujets de discussion :
|
|
