html -> Xhtml

Calli · 19 Septembre 2006

Salut voici le code de ma page HTML je souhaite la passer en XHTML et donc avoir vos conseil pour le pas faire de boulettes


<HTML>

<HEAD>
<TITLE>Mon titre</TITLE>


<LINK title="feuille de style" href="/style.css" type="text/css" rel="stylesheet">

<script LANGUAGE="JavaScript">
image1 = new Image();
image1.src = "/includes/includes_images/sommaire/accueil02.gif";
image2 = new Image();
image2.src = "/includes/includes_images/sommaire/agence02.gif";
image3 = new Image();
image3.src = "/includes/includes_images/sommaire/contact02.gif";
image4 = new Image();
image4.src = "/includes/includes_images/sommaire/dossiers02.gif";
image5 = new Image();
image5.src = "/includes/includes_images/sommaire/projets02.gif";
</SCRIPT>

</HEAD>


<BODY BGCOLOR=#ffffff>

<TABLE WIDTH=100% HEIGHT=100% CELLSPACING=0 CELLPADDING=0 BORDER=0>

<TR>
<TD WIDTH=50% BACKGROUND="/includes/includes_images/background/fond.gif"></TD>

<TD WIDTH=14 VALIGN="top" BACKGROUND="/includes/includes_images/background/fond-01.gif">
<IMG src="/includes/includes_images/background/fond-01.gif"></TD>




<!-- SOMMAIRE -->
<TD WIDTH=150 BACKGROUND="/includes/includes_images/fond.gif" VALIGN="top">

<TABLE WIDTH=150 CELLSPACING=0 CELLPADDING=0 BORDER=0>

<TR><TD WIDTH=150 HEIGHT=150>
<IMG src="/includes/includes_images/sommaire/logo.gif" WIDTH=150 HEIGHT=150 TITLE="" BORDER=0></TD></TR>

<TR><TD WIDTH=150 HEIGHT=32>
<IMG src="/includes/includes_images/sommaire/archi.gif" WIDTH=150 HEIGHT=32 TITLE="" BORDER=0></TD></TR>

</TABLE><BR>



<TABLE WIDTH=150 CELLSPACING=0 CELLPADDING=0 BORDER=0>

<TR><TD WIDTH=20 HEIGHT=10></TD><TD></TD></TR>
<TR><TD WIDTH=20></TD>
<TD WIDTH=130 HEIGHT=30>
<A HREF="/accueil/" onmouseover="image1.src='/includes/includes_images/sommaire/accueil02.gif';"
onmouseout="image1.src='/includes/includes_images/sommaire/accueil01.gif';">

<IMG name="image1" src="/includes/includes_images/sommaire/accueil01.gif" WIDTH=130 HEIGHT=30 TITLE="" BORDER=0></A></TD></TR>

<TR><TD WIDTH=20 HEIGHT=10></TD><TD></TD></TR>
<TR><TD WIDTH=20></TD>
<TD WIDTH=130 HEIGHT=30>
<A HREF="/agence/" onmouseover="image2.src='/includes/includes_images/sommaire/agence02.gif';"
onmouseout="image2.src='/includes/includes_images/sommaire/agence01.gif';">

<IMG name="image2" src="/includes/includes_images/sommaire/agence01.gif" WIDTH=130 HEIGHT=30 TITLE="" BORDER=0></A></TD></TR>

<TR><TD WIDTH=20 HEIGHT=10></TD><TD></TD></TR>
<TR><TD WIDTH=20></TD>
<TD WIDTH=130 HEIGHT=30>
<A HREF="/contact/" onmouseover="image3.src='/includes/includes_images/sommaire/contact02.gif';"
onmouseout="image3.src='/includes/includes_images/sommaire/contact01.gif';">

<IMG name="image3" src="/includes/includes_images/sommaire/contact01.gif" WIDTH=130 HEIGHT=30 TITLE="" BORDER=0></A></TD></TR>

<TR><TD WIDTH=20 HEIGHT=10></TD><TD></TD></TR>
<TR><TD WIDTH=20></TD>
<TD WIDTH=130 HEIGHT=30>
<A HREF="/dossiers/" onmouseover="image4.src='/includes/includes_images/sommaire/dossiers02.gif';"
onmouseout="image4.src='/includes/includes_images/sommaire/dossiers01.gif';">

<IMG name="image4" src="/includes/includes_images/sommaire/dossiers01.gif" WIDTH=130 HEIGHT=30 TITLE="" BORDER=0></A></TD></TR>

<TR><TD WIDTH=20 HEIGHT=10></TD><TD></TD></TR>
<TR><TD WIDTH=20></TD>
<TD WIDTH=130 HEIGHT=30>
<A HREF="/projets/" onmouseover="image5.src='/includes/includes_images/sommaire/projets02.gif';"
onmouseout="image5.src='/includes/includes_images/sommaire/projets01.gif';">

<IMG name="image5" src="/includes/includes_images/sommaire/projets01.gif" WIDTH=130 HEIGHT=30 TITLE="" BORDER=0></A></TD></TR>

</TABLE><BR>



<TABLE WIDTH=150 CELLSPACING=0 CELLPADDING=0 BORDER=0>

<TR><TD WIDTH=150 HEIGHT=10></TD></TR>
<TR><TD WIDTH=150 HEIGHT=18><CENTER>
<IMG src="/includes/includes_images/sommaire/info.gif" WIDTH=136 HEIGHT=18 TITLE="" BORDER=0></CENTER></TD></TR>

<TR><TD WIDTH=150 HEIGHT=10></TD></TR>
<TR><TD WIDTH=150 HEIGHT=30><CENTER>
<A HREF="/contact/mail.php">
<IMG src="/includes/includes_images/sommaire/lettre.gif" WIDTH=30 HEIGHT=30 TITLE="" BORDER=0></A></CENTER></TD></TR>

</TABLE><BR>

</TD>

<TD WIDTH=600 VALIGN=top>



<TABLE WIDTH=600 CELLSPACING=0 CELLPADDING=0 BORDER=0 CLASS=texte>
<TR><TD HEIGHT=10></TD></TR>

<TR><TD>
<IMG src="/accueil/accueil_images/accueil.gif" WIDTH=580 HEIGHT=80 TITLE="" BORDER=0></TD></TR>

<TR><TD HEIGHT=20></TD></TR>
</TABLE>

<TABLE WIDTH=100% CELLSPACING=0 CELLPADDING=0 BORDER=0 CLASS=texte>
<TR><TD WIDTH=70></TD>

<TD>
Blabla
<B>Mot important</B>, blabla ligne 1. <BR>blabla ligne2
<BR><BR>
<CENTER>
<IMG src="/accueil/accueil_images/sport.gif" WIDTH=190 HEIGHT=110 TITLE="" BORDER=0></CENTER>

<BR>
Blabla ligne1.
<BR><BR>
<IMG src="/includes/includes_images/puce02.gif" WIDTH=15 HEIGHT=15 TITLE="" BORDER=0>
<B> Mot important</B> blabla <B>mot imporatnt</B> blabla <B>mot important.</B>
<BR><BR>

</TD>

<TD WIDTH=70></TD></TR>
</TABLE>



<BR><BR>
<CENTER><A HREF="/" CLASS="copyright">www.monsite.com ©</A></CENTER><BR>
</TD>

<TD WIDTH=14 VALIGN="top" BACKGROUND="/includes/includes_images/background/fond-02.gif">
<IMG src="/includes/includes_images/background/fond-02.gif"></TD>

<TD WIDTH=50% BACKGROUND="/includes/includes_images/background/fond.gif"></TD>

</TR></TABLE>
</BODY>
</HTML>

Dans l'idée ma page se presente comme cela

________________________________________________________
|					 |			  |								  |						|	 
|  background  |   menu   |	  corps de texte		|	background   |  
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
|					 |			  |								  |						| 
_________________________________________________________

Donc il faut que je rajoutre

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

que je passe toutes mes balises en minuscules

que je remplace le <BR> par <br />

et

par

mais la ou cela se complique c'est pour la gestion des BLOCK surtout qu'il semble faloir éviter les <div> qui ne sont pas des balises sémentiques...

Avant de pouvoir travailler sur les CSS il faudrait que j'arrive a avoir un code XHTML bien structuré

xpatval · 19 Septembre 2006

Le "strict" et les balises <br /> ne s'apprécient pas, idem pour les majuscules (<BR />)...

Avant même d'essayer de passer en xhtml (strict ou transitionnel), il serait bon que tu valides déjà ton code, et corrige les éventuelles erreurs.

Quel besoin as-tu de vouloir passer en xhtml ?

xpatval

Calli · 19 Septembre 2006

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">


<head>
<title>Mon titre</title>


<link title="feuille de style" href="/style.css" type="text/css" rel="stylesheet" />

<script LANGUAGE="JavaScript">
image1 = new Image();
image1.src = "/includes/includes_images/sommaire/accueil02.gif";
image2 = new Image();
image2.src = "/includes/includes_images/sommaire/agence02.gif";
image3 = new Image();
image3.src = "/includes/includes_images/sommaire/contact02.gif";
image4 = new Image();
image4.src = "/includes/includes_images/sommaire/dossiers02.gif";
image5 = new Image();
image5.src = "/includes/includes_images/sommaire/projets02.gif";
</SCRIPT>

</head>


<body bgcolor="#ffffff">

<table width="100%"...

apres ca sert a rien que je rectifis tout le code au niveau des <tr> <td> ... puisque le but du Xhtml est d'eviter les tableaux afin d'avoir une mise en page uniquement liée au CSS

Le but de passer au Xhtml est bien de différencier le contenue du contenant et pourvoir faire une mise en page grace au CSS et non plus par des tableaux.

Modifié 19 Septembre 2006 par Calli

Raphael · 19 Septembre 2006

... puisque le but du Xhtml est d'eviter les tableaux afin d'avoir une mise en page uniquement liée au CSS

Le but de passer au Xhtml est bien de différencier le contenue du contenant et pourvoir faire une mise en page grace au CSS et non plus par des tableaux.

Hello,

Voilà certainement la grosse confusion des années actuelles :

* le but du XHTML n'est pas d'éviter les tableaux (les tableaux sont et resteront des balises tout à fait valides et utiles)

* les tableaux de mise en page ne sont pas prohibés, mais seulement déconseillés lorsqu'ils sont imbriqués (comme peuvent l'être des <div> imbriqués)

* le but du XHTML n'est pas d'avoir une page uniquement liée aux CSS : les feuilles de styles existent et cohabitent depuis HTML et n'ont rien de spécifique à XHTML

* le but de XHTML n'est pas de dissocier le contenu du contenant : là aussi, HTML le faisait très bien avant. Pour rappel, seules les versions strictes (de HTML ou XHTML) exigent cette séparation

Pour rappel, les seules différences entre HTML et XHTML sont de l'ordre de la rigueur dans les balises (fermeture, etc.) et n'a strictement rien à voir avec les tableaux ou les CSS.

C'est en général le choix d'un doctype (strict ou transitionnel) qui va orienter la décision d'employer CSS ou non, mais pas le choix du langage.

Je vais copier ce message car je crois qu'il va me servir souvent

Calli · 19 Septembre 2006

ok message bien recu

donc je souhaite transformer ma page HTML avec mise en page unique qui comporte des imbrications de tableau

en une page HTML dont la mise en page se fait par la gestion de BLOCK grace a une CSS

Connexion

html -> Xhtml

Sujets conseillés

Calli

Lien vers le commentaire

Partager sur d’autres sites

xpatval

Lien vers le commentaire

Partager sur d’autres sites

Calli

Lien vers le commentaire

Partager sur d’autres sites

Raphael

Lien vers le commentaire

Partager sur d’autres sites

Calli

Lien vers le commentaire

Partager sur d’autres sites

Veuillez vous connecter pour commenter

Parcourir

Activité