Foros del Web » Creando para Internet » HTML »

XHTML bien estructurado

Estas en el tema de XHTML bien estructurado en el foro de HTML en Foros del Web. Resulta que estoy programando un POrtal y quiero que el mismo cumpla con los estandares de la w3c para XHTML 1.0 Strict. Entonces cuando uso ...
  #1 (permalink)  
Antiguo 10/09/2005, 12:25
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
XHTML bien estructurado

Resulta que estoy programando un POrtal y quiero que el mismo cumpla con los estandares de la w3c para XHTML 1.0 Strict. Entonces cuando uso la extension Tidy existente para Mozilla Firefox para validar el HTML obtenido y mostrado en el navegador me salen esta serie de warnings:
Cita:
line 101 column 6 - Warning: <embed> is not approved by W3C
line 178 column 93 - Warning: unescaped & or unknown entity "&IDC"
line 324 column 45 - Warning: discarding unexpected </td>
line 144 column 67 - Warning: <img> proprietary attribute value "absmiddle"
line 379 column 7 - Warning: <form> attribute "action" lacks value
como puedo solucionar estos warnings para que la pagina queede 100% en XHTML con estandar de la W3C??

Salu2
__________________
Ing. Reynier Pérez Mira
  #2 (permalink)  
Antiguo 10/09/2005, 12:33
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Hola Reynier

facil:

line 101 column 6 - Warning: <embed> is not approved by W3C
Usa object en vez de embed


line 178 column 93 - Warning: unescaped & or unknown entity "&IDC"
usa & a m p ; en vez de &


line 324 column 45 - Warning: discarding unexpected </td>
Creo que ahí te indica que no va ese cierre de celda. O bien por que no lo abriste o porque está mal ubicado


line 144 column 67 - Warning: <img> proprietary attribute value "absmiddle"
No uses absmiddle para la alineación de una imagen pues no es standard. Usa middle, o usa css para hacer lo mismo


line 379 column 7 - Warning: <form> attribute "action" lacks value
Dale un valor al atributo action del form, o quítale el atributo

Un saludo
  #3 (permalink)  
Antiguo 10/09/2005, 17:36
Avatar de ramm  
Fecha de Ingreso: junio-2004
Ubicación: Guadalajara
Mensajes: 207
Antigüedad: 13 años, 5 meses
Puntos: 0
Si quieres mejorar la validacion de tu pagina de esa forma, te recomiendo considerar hacerla sin tablas, maquetar con divs y CSS y haciendo una estructura semantica se te hara mas facil validar, ademas que tendras una web bien estructurada en general.
  #4 (permalink)  
Antiguo 11/09/2005, 09:04
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Pero ...

Hola:
Gracias a ambos por responder.
ramm: Quisiera formar mi sitio a base de DIV y CSS pero tengo una pequeña duda: Si mi página está hecha para mostrarse en una resolución de 800x600 y de momento el usuario que la esta viendo tiene su resolucion en 1024x800 entonces no se me deformaría la web ???

tunait:
Cita:
line 101 column 6 - Warning: <embed> is not approved by W3C
Usa object en vez de embed
donde encuentro la sintaxis completa de object

Cita:
line 178 column 93 - Warning: unescaped & or unknown entity "&IDC"
usa & a m p ; en vez de &
si te das cuenta el simbolo "&" es para pasar variables a scripts PHP mediante la URL u otros entonces no me traería esto problemas si yo cambiará todos los "&" por "& a m p ;" ??

Cita:
line 324 column 45 - Warning: discarding unexpected </td>
Creo que ahí te indica que no va ese cierre de celda. O bien por que no lo abriste o porque está mal ubicado
Existe alguna herramienta que me permita validar los TAGS abiertos y/o cerrados esten correctos? De verás que tengo bastante código y como uso Smarty entonces tengo el código dividido en pedazos lo que hace que se me haga mucho más dificultosa la busqueda de TAGS.

Cita:
line 144 column 67 - Warning: <img> proprietary attribute value "absmiddle"
No uses absmiddle para la alineación de una imagen pues no es standard. Usa middle, o usa css para hacer lo mismo
Y como sería con CSS ??


Salu2 y gracias a los dos
__________________
Ing. Reynier Pérez Mira
  #5 (permalink)  
Antiguo 11/09/2005, 10:33
Avatar de FuLaNo_  
Fecha de Ingreso: mayo-2003
Ubicación: Don Torcuato, Buenos Aires, Argentina
Mensajes: 1.250
Antigüedad: 14 años, 6 meses
Puntos: 2
La ultima es asi
<img src="..." style="vertical-align:middle" alt="" />

Tambien podes cambiar "middle" por top, bottom o un porsentaje.

Sobre el simbolo &. te comento que no importa que sea en una URL o no, siempre debes escribirlo en codigo HTML para validarlo correctamente (esto no difiere a poner directamente el &, ya que cuando se ejecuta es lo mismo).

La primer pregunta: NO, si haces bien la estructura con div's deberia verse igual que con tablas (es decir que no se deformaria), aúnque personalmente aún tengo problemas para trabajar solo con divs.

Y, por ultimo, aca tenes sobre <object>:
http://html.conclase.net/w3c/html401...ts.html#h-13.3

Saludos.
__________________
I Love Programming...
  #6 (permalink)  
Antiguo 11/09/2005, 11:24
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Hola de nuevo

Hola Fulano:
Ante todo gracias por responderme.

Cita:
La primer pregunta: NO, si haces bien la estructura con div's deberia verse igual que con tablas (es decir que no se deformaria), aúnque personalmente aún tengo problemas para trabajar solo con divs.
Como podría hacer una web a base de DIV y saber si esta bien estrucurada o no ??

Y lo otro es como pasar de el elemento EMBED al elemento OBJECT (este es el código que tengo puesto para el elemento FLash):
Código PHP:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="198" height="97">
              <
param name="movie" value="themes/images/jccegranma_1.swf">
              <
param name="quality" value="high">
              <
embed src="themes/images/jccegranma_1.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="198" height="97"></embed>
            </
object
Salu2
__________________
Ing. Reynier Pérez Mira
  #7 (permalink)  
Antiguo 12/09/2005, 03:16
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Buenas,

para el tema del uso de object para flash te dejo un link que trata sobre la forma de hacerlo usando los estándares http://www.alistapart.com/articles/flashsatay/

Un saludo
  #8 (permalink)  
Antiguo 12/09/2005, 09:43
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Gracias

Muchas gracias Tunait, muy buen artículo ese que me dejas. Los que no lo han leído deberían hacerlo puesto que con esto he logrado estandarizar mi animación Flash. Otra cosa si les quedo alguna duda después de leerlo entonces pregunten aquí para responderles.

Salu2
__________________
Ing. Reynier Pérez Mira
  #9 (permalink)  
Antiguo 12/09/2005, 20:01
Avatar de ramm  
Fecha de Ingreso: junio-2004
Ubicación: Guadalajara
Mensajes: 207
Antigüedad: 13 años, 5 meses
Puntos: 0
Cita:
Iniciado por Reynier
Hola Fulano:
Ante todo gracias por responderme.

Como podría hacer una web a base de DIV y saber si esta bien estrucurada o no ??
Para esto, te recomiendo primero leer estos articulos, estan muy buenos.
http://www.disenorama.com/tutoriales...con_codigo.htm
http://www.disenorama.com/articulos/...co_el_medi.htm
http://www.disenorama.com/tutoriales...oblemas_en.htm

En cuanto a lo de cambiar las etiquetas, casi todos los editores wb tienen una herramienta para buscar/reemplazar (dreamweaver lo tiene) lo que te hace muy facil hacer esos cambios. Ademas en DW puedes abrir cualquier tipo de archivo y cambiarle eso sin problemas, siempre y cuando lo abras en la vista de codigo.
  #10 (permalink)  
Antiguo 12/10/2005, 08:45
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Pues ...

Como que todavía no logro validar completamente mi sitio para que quede bien estrcuturado con XHTML 1.0. Los errores que permanecen son los siguientes:
Cita:
line 93 column 17 - Warning: <embed> is not approved by W3C
line 98 column 590 - Warning: unescaped & or unknown entity "&cual"
line 180 column 47 - Warning: discarding unexpected </td>
line 181 column 21 - Warning: discarding unexpected </tr>
line 188 column 21 - Warning: missing <tr>
line 194 column 49 - Warning: discarding unexpected </td>
line 234 column 7 - Warning: <form> lacks "action" attribute
Ahora les explico lo que he estado haciendo y que todavía no doy con su solución.
1) line 93 column 17 - Warning: <embed> is not approved by W3C: Por más que leo la documentación que me dejaron y pruebo las cosas no me salen bien.
2) line 98 column 590 - Warning: unescaped & or unknown entity "&cual": Esto no me traería problemas con PHP ?? O sea si le pongo " &amp; " ??
3) line 180 column 47 - Warning: discarding unexpected </td>: Estos errores referidos a tablas no se de donde salen. Si fuese cierto? No se me deformaría el sitio en caso de que abriera y no cerrase los tags ??
4) line 234 column 7 - Warning: <form> lacks "action" attribute: Quite el action del form puesto que no debe ir a ningun lado solo lo tengo por un elemento select pero me da ese error ??

Salu2
__________________
Ing. Reynier Pérez Mira
  #11 (permalink)  
Antiguo 12/10/2005, 09:31
Avatar de FuLaNo_  
Fecha de Ingreso: mayo-2003
Ubicación: Don Torcuato, Buenos Aires, Argentina
Mensajes: 1.250
Antigüedad: 14 años, 6 meses
Puntos: 2
Al form ponele action="" y listo

El tema de las tablas, debes estar cerrandolas y abriendolas mal (cruzadas o algo asi)

El & cambialo por "& a m p ;" (todo junto y sin comillas)

La etiqueta <embed> se reemplaza con object, si estas usando flash, por ejemplo, seria algo asi:

Código:
          <object type="application/x-shockwave-flash" data="img/loader.swf" width="760" height="147">
            <param name="movie" value="img/loader.swf" />
            <param name="Menu" value="0" />
          </object>
Por otra parte, W3 no valida la estructura de tu sitio, si no el codigo del mismo, para que este bien estructurado tienes que darle coherencia al codigo y, del "vamos", utilizar tablas solo si corresponde (con datos tubulares), mientras que debes "maquetar" el sitio con Div's y CSS...
__________________
I Love Programming...
  #12 (permalink)  
Antiguo 12/10/2005, 09:52
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Gracias

Gracias por responder Fulano:
1) El problema del action del form ya lo probe en esa forma que me dices y me da el mismo error. No se porque.
2) El & cambiado por "& a m p ;" no me traería problemas con PHP? Si mas no recuerdo la vez que lo cambie me metio ruido en el sistema pues me ponia &amp en la direccion de la URL.
3) Sobre el tema de los DIV tengo que estudiar bastante todavia. No me creo capaz de maquetar una buena web usando DIV.

Salu2

PD: Estoy usando para la validacion la extension TidyValidator de Mozilla Firefox.
__________________
Ing. Reynier Pérez Mira
  #13 (permalink)  
Antiguo 12/10/2005, 10:53
Avatar de FuLaNo_  
Fecha de Ingreso: mayo-2003
Ubicación: Don Torcuato, Buenos Aires, Argentina
Mensajes: 1.250
Antigüedad: 14 años, 6 meses
Puntos: 2
no tiene porque traerte problemas el reemplazo de & por su codigo HTML... yo utilizo siempre & amp; y nunca he tenido problemas.

El tema del form, me parece raro... tendrás que probar otras cosas
__________________
I Love Programming...
  #14 (permalink)  
Antiguo 12/10/2005, 13:50
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Cita:
2) El & cambiado por "& a m p ;" no me traería problemas con PHP? Si mas no recuerdo la vez que lo cambie me metio ruido en el sistema pues me ponia &amp en la direccion de la URL.
No te dará problemas dentro del código html. Donde no debes usarlo es dentro del propio código php (lo que no le llegará al navegador), por ejemplo no uses esa sintaxis en un redirect pero en html es totalmente correcto

respecto a la acción del form ¿por qué no tiene una asignada? ¿estás enviándolo con javascript?
  #15 (permalink)  
Antiguo 12/10/2005, 17:06
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
porque no muestras tu código, pa verlo y no seguir especulando tanto.

Saludos
__________________
Al final del día hablar es gratis, codificar no lo es
  #16 (permalink)  
Antiguo 13/10/2005, 21:17
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Gracias por responder

Hola:
Gracias a todos por responder. Luego de una intensa busqueda por todo mi código y siguiendo sus comentarios he podido arreglar los siguientes errores:
1) Solucionado el problema del "&" porque el mismo no tiene nada que ver con código PHP, excepto en algunos casos que lo uso con la función header() de PHP. Pero en la mayoría de los casos el mismo está generado por Smarty usando HTML como código base. Miren la solución debajo:
Código PHP:
<a href="noticias.php?opt=mostrar&amp;IDC={$noticia.IDC}&amp;IDN={$noticia.IDN}"><img src="{#IMG_DIR#}amp_noticia.gif" alt="{#MOSTRAR_CONTENIDO_NOTICIA#|escape:"htmlall"}" border="0" class="img align" />{#MOSTRAR_CONTENIDO_NOTICIA#|escape:"htmlall"}</a> 
2) Solucionado el problema de la animación Flash. Aquí el código de ejemplo.
Código PHP:
<object data="themes/images/fla_1.swf" width="198" height="97">
 <
param name="movie" value="themes/images/fla_1.swf" />
 <
param name="Menu" value="0" />
 <
param name="quality" value="high">
</
object
pero me queda una duda. Que pasa si el usuario no tiene instalado el plugin de Flash en su PC o su navegador no soporta animaciones SWF ??

No solucionado aún:
1) El problema del formulario y el parametro "action". Como bien dice Tunait lo envio a traves de JavaScript. Miren el código del formulario y la funcion JavaScript que se invoca al hacer clic en el boton.
municipios.tpl
Código PHP:
<table border="0" cellspacing="2" cellpadding="2"
    <
tr>
        <
td class="centeralign"><img src="themes/images/nuestros_municipios.gif" border="0" /></td>
    </
tr>
    <
tr>
        <
td align="center">
            <
form name="municipios" id="municipios" method="post" action="">
                <
select id="municipio" name="municipio">
                    {
html_options values=$avalores output=$amunicipios|escape:"htmlall"}
                </
select>
                <
img src="{#IMG_DIR#}ir.gif" border="0" onclick="Skip();" class="cursor" />
            </
form>
        </
td>
    </
tr>
</
table
Funcion JS:
Código PHP:
function Skip(){
    var 
tickit=document.municipios;
    
newwindow=window.open("");
newwindow.location=tickit.municipio.options[tickit.municipio.selectedIndex].value;

2) Por mas que busco los TD y TR que me dan error no los encuentro. Existe alguna herramienta que sea capaz de buscar estos errores??

Fulano: Tendré en cuenta la creación o maquetación del Portal con DIV para la versión 2.0 pero para ello tengo primero que estudiarme bien las cosas y probar con ejemplos.

Esperando por sus nuevas respuestas.
El sitio puede ser visitado en la siguiente dirección: http://www.jovenclub.cu/grm/index.php por si quieren ver los errores Uds. mismos.

Salu2 y gracias a todos por responder
__________________
Ing. Reynier Pérez Mira
  #17 (permalink)  
Antiguo 13/10/2005, 22:33
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Correcion

He solucionado el problema del Flash para Firefox pero en Internet Explorer me sale un cuadro como si fuera un TEXTAREA. Saben que es eso ??

Salu2
__________________
Ing. Reynier Pérez Mira
  #18 (permalink)  
Antiguo 13/10/2005, 23:10
Avatar de FuLaNo_  
Fecha de Ingreso: mayo-2003
Ubicación: Don Torcuato, Buenos Aires, Argentina
Mensajes: 1.250
Antigüedad: 14 años, 6 meses
Puntos: 2
raro lo que te pasa con el flash... yo utilizo el codigo como te lo pase y funciona en todos los navegadores (fijate www.ftechnology.com.ar, todo el "header" esta en flash... fijate el codigo fuente...)

el tema del form, proba embeber TODA la tabla con el form... es decir

Código PHP:
<form... >
  <
table ...>
    <
tr>
      <
td ...>
      
formulario
      
</td>
    </
tr>
  </
table>
</
form
o intenta poner el mismo archivo en el action (ej: action="form.php")

El tema del onclick, no podes hacerlo con onsubmit.. con este nunca me trajo problemas... (y sacale el border="0", porque deberia darte error en XHTML)

Bueno, no se que mas decirte con respecto a los problemas...

Saludos.

PD: Me gusta el sitio.
__________________
I Love Programming...
  #19 (permalink)  
Antiguo 14/10/2005, 07:02
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 12 años, 10 meses
Puntos: 0
El atributo action del tag form es obligatorio y debe contener una uri válida. Un formulario sin action no sirve, aunque uses JavaScript para procesar los datos. ¿Si no tengo JavaScript qué pasa? Deberías adaptar tu formulario para que funcione aún sin el script.

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #20 (permalink)  
Antiguo 14/10/2005, 08:17
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Gracias nuevamente

Ante todo gracias a ambos por responder.
Fulano: He entrado a tu página con Firefox y no me carga la animación Flash o sea el header de tu sitio (muy buen diseño y con DIV según pude ver en el código), no se la razón porque a mi me pasa al revés. O sea la animación me carga en Firefox pero no en Internet Explorer. Este es el código para el header en Flash:
Código HTML:
<object data="{#IMG_DIR#}fla_1.swf" width="198" height="97">
 <param name="movie" value="{#IMG_DIR#}fla_1.swf" />
 <param name="Menu" value="0" />
 <param name="quality" value="high" />
</object> 
(#IMG_DIR#) es un parámetro porque el sitio está creado con Smarty y estoy utilizando al máximo las potencialidades del mismo. En cuanto al Form estuve haciendo una búsqueda por la W3C y como bien dice thunder.scripts el atributo "action" es obligatorio en los FORM asi que no tengo ni idea de como solucionarlo. Alguna idea??
De todas formas probe tu posible solución y me sigue dando el mismo problema con el formulario. He aquí el texto que me devuelve la extension validadora de Firefox:
Cita:
... attribute ... lacks value
Cause: This is an error show when an attribute contained in a tag does not contain a value and that a value was expected.
Or this can also be due to syntax error in the HTML tag.
Solution: Check the definition of the attribute. Give a value to the tag.
Or correct the wrong/unkown tag.
Sample:
<a> attribute href lacks value
BAD <a href>My Link</a>
GOOD <a href="my_link.html">My Link</a>
References:
http://www.w3.org/TR/html4/index/attributes.html
Salu2

PD: Bueno el sitio lo estoy programando y terminando aún. Todavía tiene muchas incompatibilidades entre navegadores pero ya estoy trabajando en ello y en la estandarización para XHTML 1.1. Tu sitio también está muy bueno.
__________________
Ing. Reynier Pérez Mira
  #21 (permalink)  
Antiguo 14/10/2005, 08:58
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 8 meses
Puntos: 0
hola, no te olvides de poner el type="application/x-shockwave-flash" dentro de la etiqeuta object, y si el usuario no tiene flash puedes poner un contenido alternativo dentro del etiqueta object asi:
<object type="application/x-shockwave-flash" data="{#IMG_DIR#}fla_1.swf" width="198" height="97">
<param name="movie" value="{#IMG_DIR#}fla_1.swf" />
<param name="Menu" value="0" />
<param name="quality" value="high" />

****Contenido Alternativo****

</object>
EL contenido alternativo puede ser el codigo que quieras.
Ahora si aun por alguna extraña razon no te funciona, entonces usa el Flaccess
  #22 (permalink)  
Antiguo 14/10/2005, 09:26
Avatar de Reynier  
Fecha de Ingreso: noviembre-2002
Ubicación: Por ahí en algún sitio
Mensajes: 1.844
Antigüedad: 15 años
Puntos: 1
Gracias

Muchas gracias RoQ, como bien dices me faltaba especificar el tipo de objeto (type="application/x-shockwave-flash") pero de todas formas me estudie el enlace sobre Flaccess y de verás que esta muy bueno. Ya antes había visto Satay y no me había gustado mucho.

Salu2
__________________
Ing. Reynier Pérez Mira
  #23 (permalink)  
Antiguo 14/10/2005, 11:25
 
Fecha de Ingreso: julio-2004
Mensajes: 45
Antigüedad: 13 años, 4 meses
Puntos: 0
El DreamWeaver 8 te ayuda con la validación y te recomiendo los divs, sino tienes mucha experiencia con ellos pasate por http://www.csszengarden.com y vas a ver una gran web hecha con divs en su totalidad.

nos vemos, espero te sirva.
  #24 (permalink)  
Antiguo 14/10/2005, 12:55
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 12 años, 10 meses
Puntos: 9
pasa un pco de los estandares ,y sobre todo con los estrictos, te complican la vida y no dejan de salir nuevas versiones para liar mas la guita. Y si eso fuera poco ,te conviertes en un gran sabio dando la lata todo el dia, para que los demas sigan tambien las recomendaciones del w3.

Lo dicho, saludos.
  #25 (permalink)  
Antiguo 14/10/2005, 15:37
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 8 meses
Puntos: 0
y seguro eso es malo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:48.