Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1871 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML] interface avec des tables : qu'en pense le w3c ?

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[HTML] interface avec des tables : qu'en pense le w3c ?

n°307790
parappa
taliblanc
Posté le 12-02-2003 à 18:06:22  profilanswer
 

J'ai terminé une maquette de site sous toshop, je l'ai passée dans ImageReady pour la découper proprement et l'exporter. Je voudrais savoir ce que vous pensez du code généré.
 

Code :
  1. <html>
  2. <head>
  3. <title>menu5</title>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. </head>
  6. <body bgcolor=#FFFFFF leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
  7. <table width=750 border=0 cellpadding=0 cellspacing=0>
  8. <tr>
  9.  <td width=200 height=195 colspan=5>
  10.   <img src="images/index_01.gif" width=200 height=195 alt="" /></td>
  11.  <td width=550 height=345 colspan=8 rowspan=3>
  12.   <img src="images/index_02.gif" width=550 height=345 alt="" /></td>
  13.  <td width=0 height=195 nowrap></td>
  14. </tr>
  15. <tr>
  16.  <td width=200 height=24 colspan=5>
  17.   <img src="images/index_03.gif" width=200 height=24 alt="" /></td>
  18.  <td width=0 height=24 nowrap></td>
  19. </tr>
  20. <tr>
  21.  <td width=200 height=221 colspan=5 rowspan=3>
  22.   <img src="images/index_04.gif" width=200 height=221 alt="" /></td>
  23.  <td width=0 height=126 nowrap></td>
  24. </tr>
  25. <tr>
  26.  <td width=70 height=95 rowspan=2>
  27.   <img src="images/index_05.gif" width=70 height=95 alt="" /></td>
  28.  <td width=65 height=95 rowspan=2>
  29.   <img src="images/index_06.gif" width=65 height=95 alt="" /></td>
  30.  <td width=25 height=95 rowspan=2>
  31.   <img src="images/index_07.gif" width=25 height=95 alt="" /></td>
  32.  <td width=85 height=95 rowspan=2>
  33.   <img src="images/index_08.gif" width=85 height=95 alt="" /></td>
  34.  <td width=25 height=95 rowspan=2>
  35.   <img src="images/index_09.gif" width=25 height=95 alt="" /></td>
  36.  <td width=90 height=95 rowspan=2>
  37.   <img src="images/index_10.gif" width=90 height=95 alt="" /></td>
  38.  <td width=70 height=95 rowspan=2>
  39.   <img src="images/index_11.gif" width=70 height=95 alt="" /></td>
  40.  <td width=120 height=65>
  41.   <img src="images/index_12.gif" width=120 height=65 alt="" /></td>
  42.  <td width=0 height=65 nowrap></td>
  43. </tr>
  44. <tr>
  45.  <td width=120 height=30>
  46.   <img src="images/index_13.gif" width=120 height=30 alt="" /></td>
  47.  <td width=0 height=30 nowrap></td>
  48. </tr>
  49. <tr>
  50.  <td width=750 height=15 colspan=13>
  51.   <img src="images/index_14.gif" width=750 height=15 alt="" /></td>
  52.  <td width=0 height=15 nowrap></td>
  53. </tr>
  54. <tr>
  55.  <td width=50 height=145 rowspan=4>
  56.   <img src="images/index_15.gif" width=50 height=145 alt="" /></td>
  57.  <td width=104 height=53 colspan=2>
  58.   <img src="images/index_16.gif" width=104 height=53 alt="" /></td>
  59.  <td width=36 height=53>
  60.   <img src="images/index_17.gif" width=36 height=53 alt="" /></td>
  61.  <td width=560 height=145 colspan=9 rowspan=4>
  62.   <img src="images/index_18.gif" width=560 height=145 alt="" /></td>
  63.  <td width=0 height=53 nowrap></td>
  64. </tr>
  65. <tr>
  66.  <td width=140 height=12 colspan=3>
  67.   <img src="images/index_19.gif" width=140 height=12 alt="" /></td>
  68.  <td width=0 height=12 nowrap></td>
  69. </tr>
  70. <tr>
  71.  <td width=19 height=36>
  72.   <img src="images/index_20.gif" width=19 height=36 alt="" /></td>
  73.  <td width=121 height=36 colspan=2>
  74.   <img src="images/index_21.gif" width=121 height=36 alt="" /></td>
  75.  <td width=0 height=36 nowrap></td>
  76. </tr>
  77. <tr>
  78.  <td width=140 height=44 colspan=3>
  79.   <img src="images/index_22.gif" width=140 height=44 alt="" /></td>
  80.  <td width=0 height=44 nowrap></td>
  81. </tr>
  82. <tr>
  83.  <td width=50 height=0 nowrap></td>
  84.  <td width=19 height=0 nowrap></td>
  85.  <td width=85 height=0 nowrap></td>
  86.  <td width=36 height=0 nowrap></td>
  87.  <td width=10 height=0 nowrap></td>
  88.  <td width=70 height=0 nowrap></td>
  89.  <td width=65 height=0 nowrap></td>
  90.  <td width=25 height=0 nowrap></td>
  91.  <td width=85 height=0 nowrap></td>
  92.  <td width=25 height=0 nowrap></td>
  93.  <td width=90 height=0 nowrap></td>
  94.  <td width=70 height=0 nowrap></td>
  95.  <td width=120 height=0 nowrap></td>
  96.  <td width=0 height=0></td>
  97. </tr>
  98. </table>
  99. </body>
  100. </html>


 
(Je remplirai les ALT plus tard.)
 
L'interface finale sera peut-être conçue en css, mais je risque de ne pas avoir le temps de m'y plonger. Quelques questions donc : ce code passe-t-il le validateur (et puis comment tester ça d'ailleurs) ? La page s'affichera-t-elle correctement sur tous les navigateurs ?
 
Merci. :)

mood
Publicité
Posté le 12-02-2003 à 18:06:22  profilanswer
 

n°307799
Kristoph
Posté le 12-02-2003 à 18:15:18  profilanswer
 
n°307802
anakn
Posté le 12-02-2003 à 18:17:00  profilanswer
 

tu t'en fous du validateur  ;)  
ça peut très bien passer partout même s'il te sort des erreurs
 
par contre le code n'est pas parfait
notamment la série des <td> vides vers la fin et parce que les attributs sont définis par width=140  et pas par width="140" (quotes)
mais ça passera quand même...

n°307806
Hermes le ​Messager
Breton Quiétiste
Posté le 12-02-2003 à 18:21:26  profilanswer
 

Anakn a écrit :

tu t'en fous du validateur  ;)  
ça peut très bien passer partout même s'il te sort des erreurs
 
par contre le code n'est pas parfait
notamment la série des <td> vides vers la fin et parce que les attributs sont définis par width=140  et pas par width="140" (quotes)
mais ça passera quand même...


 
Tu es sûr que tu ne t'es pas perdu ici ? Tu n'aurais pas cliqué sur prog à la place de graphisme toi par hasard ?  :D  
 
Je dis ça, mais c'est pour ton bien...  [:totozzz]

n°307812
parappa
taliblanc
Posté le 12-02-2003 à 18:27:03  profilanswer
 


 
Ok merci.
 

Anakn a écrit :

tu t'en fous du validateur  ;)  
ça peut très bien passer partout même s'il te sort des erreurs
 
par contre le code n'est pas parfait
notamment la série des <td> vides vers la fin et parce que les attributs sont définis par width=140  et pas par width="140" (quotes)
mais ça passera quand même...


 
Effectivement c'est pas tant le validateur que la compatibilité avec les brouteurs existant qui m'intéresse, mais si on peut faire d'une pierre 2 coups hein... ;)
Je vais voir si on peut rajouter par défaut des guillemets partout, j'imagine (j'espère...) que oui.

n°307815
Hermes le ​Messager
Breton Quiétiste
Posté le 12-02-2003 à 18:30:12  profilanswer
 

parappa a écrit :


 
Ok merci.
 
 
 
Effectivement c'est pas tant le validateur que la compatibilité avec les brouteurs existant qui m'intéresse, mais si on peut faire d'une pierre 2 coups hein... ;)
Je vais voir si on peut rajouter par défaut des guillemets partout, j'imagine (j'espère...) que oui.


 
Et bien écoutes, si tu as envie de tester ton site avec tous les brouteurs existants plutôt que de respecter un standard, c'est ton problème, mais ça risque d'être long...  :D  
 
Tandis que si tu respectes les standards, tu as déjà plus de chance de passer moins de temps à débugger ce que tu as écrit.

n°307817
parappa
taliblanc
Posté le 12-02-2003 à 18:34:13  profilanswer
 

HotShot a écrit :

Parappa : tu reviendras quand il y aura du contenu stp, passque là on peut pas te dire grand chose... [:mlc]  


 
Oui oui j'ai bien compris merci.

n°307819
parappa
taliblanc
Posté le 12-02-2003 à 18:41:27  profilanswer
 

J'ai tout un tas de doctype possibles, lequel est-ce que je dois utiliser ?

n°307824
parappa
taliblanc
Posté le 12-02-2003 à 18:49:55  profilanswer
 

Si je ne met pas de doctype je peux pas essayer le validateur. Là j'ai mis le premier de la liste, "HTML 4.01 Transitional".
 
Apparemment il aime pas les attributs du body.
 
<body bgcolor=#FFFFFF leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
 
Y a une alternative à ça ?

n°307828
parappa
taliblanc
Posté le 12-02-2003 à 18:56:09  profilanswer
 

HotShot a écrit :

déjà, prends l'habitude de mettre des guillemets aux attributs... et ca devrait aller un peu mieux (si tu ne veux pas utiliser de CSS)


 
Si si, je vais en utiliser (de toute façon pour faire des "iframe" convenables je suis obligé, et puis pour tous les textes, les liens etc.), là c'était simplement pour tester l'export direct d'ImageReady. J'en avais entendu beaucoup de mal, mais apparemment ça fonctionne relativement bien. Enfin j'ai rien trouvé pour lui faire mettre des guillemets, ça c'est chiant. (Edit : Ah bah si en fait c'est bon.)
 
Edit : avec des guillemets il ne me prend toujours pas mon body et ses attributs.


Message édité par parappa le 12-02-2003 à 18:59:40
mood
Publicité
Posté le 12-02-2003 à 18:56:09  profilanswer
 

n°307829
parappa
taliblanc
Posté le 12-02-2003 à 19:08:55  profilanswer
 

1: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2:  "http://www.w3.org/TR/html4/loose.dtd">
   3: <html>
   4: <head>
   5: <title>menu5</title>
   6: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   7: </head>
   8: <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
   9: <table width="750" border="0" cellpadding="0" cellspacing="0">
  10:  <tr>
  11:   <td width="200" height="195" colspan="5">
  12:    <img src="images/index_01.gif" width="200" height="195" alt="" /></td>
  13:   <td width="550" height="345" colspan="8" rowspan="3">
  14:    <img src="images/index_02.gif" width="550" height="345" alt="" /></td>
  15:   <td width="0" height="195" nowrap></td>
  16:  </tr>
  17:  <tr>
  18:   <td width="200" height="24" colspan="5">
  19:    <img src="images/index_03.gif" width="200" height="24" alt="" /></td>
  20:   <td width="0" height="24" nowrap></td>
  21:  </tr>
  22:  <tr>
  23:   <td width="200" height="221" colspan="5" rowspan="3">
  24:    <img src="images/index_04.gif" width="200" height="221" alt="" /></td>
  25:   <td width="0" height="126" nowrap></td>
  26:  </tr>
  27:  <tr>
  28:   <td width="70" height="95" rowspan="2">
  29:    <img src="images/index_05.gif" width="70" height="95" alt="" /></td>
  30:   <td width="65" height="95" rowspan="2">
  31:    <img src="images/index_06.gif" width="65" height="95" alt="" /></td>
  32:   <td width="25" height="95" rowspan="2">
  33:    <img src="images/index_07.gif" width="25" height="95" alt="" /></td>
  34:   <td width="85" height="95" rowspan="2">
  35:    <img src="images/index_08.gif" width="85" height="95" alt="" /></td>
  36:   <td width="25" height="95" rowspan="2">
  37:    <img src="images/index_09.gif" width="25" height="95" alt="" /></td>
  38:   <td width="90" height="95" rowspan="2">
  39:    <img src="images/index_10.gif" width="90" height="95" alt="" /></td>
  40:   <td width="70" height="95" rowspan="2">
  41:    <img src="images/index_11.gif" width="70" height="95" alt="" /></td>
  42:   <td width="120" height="65">
  43:    <img src="images/index_12.gif" width="120" height="65" alt="" /></td>
  44:   <td width="0" height="65" nowrap></td>
  45:  </tr>
  46:  <tr>
  47:   <td width="120" height="30">
  48:    <img src="images/index_13.gif" width="120" height="30" alt="" /></td>
  49:   <td width="0" height="30" nowrap></td>
  50:  </tr>
  51:  <tr>
  52:   <td width="750" height="15" colspan="13">
  53:    <img src="images/index_14.gif" width="750" height="15" alt="" /></td>
  54:   <td width="0" height="15" nowrap></td>
  55:  </tr>
  56:  <tr>
  57:   <td width="50" height="145" rowspan="4">
  58:    <img src="images/index_15.gif" width="50" height="145" alt="" /></td>
  59:   <td width="104" height="53" colspan="2">
  60:    <img src="images/index_16.gif" width="104" height="53" alt="" /></td>
  61:   <td width="36" height="53">
  62:    <img src="images/index_17.gif" width="36" height="53" alt="" /></td>
  63:   <td width="560" height="145" colspan="9" rowspan="4">
  64:    <img src="images/index_18.gif" width="560" height="145" alt="" /></td>
  65:   <td width="0" height="53" nowrap></td>
  66:  </tr>
  67:  <tr>
  68:   <td width="140" height="12" colspan="3">
  69:    <img src="images/index_19.gif" width="140" height="12" alt="" /></td>
  70:   <td width="0" height="12" nowrap></td>
  71:  </tr>
  72:  <tr>
  73:   <td width="19" height="36">
  74:    <img src="images/index_20.gif" width="19" height="36" alt="" /></td>
  75:   <td width="121" height="36" colspan="2">
  76:    <img src="images/index_21.gif" width="121" height="36" alt="" /></td>
  77:   <td width="0" height="36" nowrap></td>
  78:  </tr>
  79:  <tr>
  80:   <td width="140" height="44" colspan="3">
  81:    <img src="images/index_22.gif" width="140" height="44" alt="" /></td>
  82:   <td width="0" height="44" nowrap></td>
  83:  </tr>
  84:  <tr>
  85:   <td width="50" height="0" nowrap></td>
  86:   <td width="19" height="0" nowrap></td>
  87:   <td width="85" height="0" nowrap></td>
  88:   <td width="36" height="0" nowrap></td>
  89:   <td width="10" height="0" nowrap></td>
  90:   <td width="70" height="0" nowrap></td>
  91:   <td width="65" height="0" nowrap></td>
  92:   <td width="25" height="0" nowrap></td>
  93:   <td width="85" height="0" nowrap></td>
  94:   <td width="25" height="0" nowrap></td>
  95:   <td width="90" height="0" nowrap></td>
  96:   <td width="70" height="0" nowrap></td>
  97:   <td width="120" height="0" nowrap></td>
  98:   <td width="0" height="0"></td>
  99:  </tr>
 100: </table>
 101: </body>
 102: </html>


 

Line 7, column 6: end tag for element "HEAD" which is not open (explain...).  
  </head>
        ^


 
Pourquoi il me dit ça :??:

n°307842
marmotte.t​ranquille
Posté le 12-02-2003 à 19:29:14  profilanswer
 

parappa a écrit :

[fixed]
   4: <head>
   5: <title>menu5</title>
   6: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   7: </head>


 
J'y connais rien, mais je pense qu'il faut rajouter des guillemets :
 
   6: <meta http-equiv="Content-Type" content="text/html"; charset="iso-8859-1" />

n°307848
gm_superst​ar
Appelez-moi Super
Posté le 12-02-2003 à 19:41:59  profilanswer
 

parappa a écrit :

Si je ne met pas de doctype je peux pas essayer le validateur. Là j'ai mis le premier de la liste, "HTML 4.01 Transitional".
 
Apparemment il aime pas les attributs du body.
 
<body bgcolor=#FFFFFF leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
 
Y a une alternative à ça ?


Les CSS comme d'hab. Il faut en prendre l'habitude ;)


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°307851
parappa
taliblanc
Posté le 12-02-2003 à 19:45:06  profilanswer
 

gm_superstar a écrit :


Les CSS comme d'hab. Il faut en prendre l'habitude ;)


 
Ok pas de soucis. Une idée pour l'erreur sur le </head> ?

n°307852
gm_superst​ar
Appelez-moi Super
Posté le 12-02-2003 à 19:45:40  profilanswer
 

parappa a écrit :

Pourquoi il me dit ça :??:


Parce que tu ne fais pas du XHTML ;)
Or ta balise <meta> est écrite comme en XHTML.


Message édité par gm_superstar le 12-02-2003 à 19:46:01

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°307853
marmotte.t​ranquille
Posté le 12-02-2003 à 19:46:25  profilanswer
 

HotShot a écrit :

nope, la syntaxe est bien content="machin; charset=machin" />


 
Autant pour moi, désolé ;)

n°307901
parappa
taliblanc
Posté le 12-02-2003 à 20:52:07  profilanswer
 

gm_superstar a écrit :


Parce que tu ne fais pas du XHTML ;)
Or ta balise <meta> est écrite comme en XHTML.


 
Merci.

n°307940
parappa
taliblanc
Posté le 12-02-2003 à 22:08:45  profilanswer
 

Comment est-ce qu'on fait pour laisser une case vide dans un tableau ? 'me semble que le   ne fonctionne pas toujours. :??:

n°307954
parappa
taliblanc
Posté le 12-02-2003 à 22:27:50  profilanswer
 

'me semblait avoir lu que le   n'était pas invisible sur certains navigateurs (netscape 4 de mémoire, mais je peux me tromper - enfin si c'est que netscape 4 à la rigueur spatropgrave, mais qu'en pensera le validateur ? [:boidleau]).

n°307958
parappa
taliblanc
Posté le 12-02-2003 à 22:30:15  profilanswer
 

Ok je dois me tromper alors. Merci.

n°307972
kadreg
profil: Utilisateur
Posté le 12-02-2003 à 22:47:01  profilanswer
 

parappa a écrit :

'me semblait avoir lu que le   n'était pas invisible sur certains navigateurs


 
Non, c'est juste qu'il y avait un éditeur qui écrivait   (sans le ; après) donc forcément ça s'affichait avec NS4.


---------------
brisez les rêves des gens, il en restera toujours quelque chose...  -- laissez moi troller sur discu !
n°307975
parappa
taliblanc
Posté le 12-02-2003 à 22:51:52  profilanswer
 

Ok. Par défaut Imageready ne met rien par contre.

n°308295
Flyman30
Posté le 13-02-2003 à 12:38:56  profilanswer
 

parappa a écrit :

Ok. Par défaut Imageready ne met rien par contre.


 
Sisi il mets une images vide  :wahoo:

n°308309
axey
http://www.00f.net
Posté le 13-02-2003 à 13:06:08  profilanswer
 

Juste un truc : ImageReady peut aussi créer du code avec des calques positionnés en absolu au lieu de ces immondes tableaux.  
 
Il y a juste à cocher l'option "Generate CSS inline" (ou "Generate CSS in external file", ou un truc du genre) .

n°308346
parappa
taliblanc
Posté le 13-02-2003 à 13:28:49  profilanswer
 

Tu veux dire générer une feuille de style ? Oui j'ai vu, mais j'ai pas encore essayé.

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML] interface avec des tables : qu'en pense le w3c ?

 

Sujets relatifs
[HTML] Comment créer un bouton Précédent ?Page web sur les balises html: commen faire pour qu'elles s'affichent?
[HTML] Pb avec tableau : largeur de cellulesValidateur W3C + Probleme lors de son installation
[html] alignement vertical au milieu marche pas a l'aide urgentissime![HTML] comment traduire un espace en html ?
[JS] resizer une frame htmlremplacer les é,è... par le codage correspondant en HTML
[HTML] Désactiver les balises dans le bodyJ'ai besoin d'aide pour un lien en HTML
Plus de sujets relatifs à : [HTML] interface avec des tables : qu'en pense le w3c ?


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR