Cabecera HTML

Deiv · #1 12-03-2007

Hola,
Trabajo con DreamWeaver y al crear un nuevo documento existe una serie de opciones TIPO DE DOCUMENTO (DTD) que presenta el programa como cabecera del mismo. Al elegir una de ellas, dependiendo, esta es la presentación:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">

¿Qué significan cada uno de ellos? y ¿Cuando utilizar uno del otro? ¿Cómo diferenciarlos? ¿Qué pasa si quitamos esa línea de la Cabecera?
En este momento no recuerdo, pero me ha ocurrido un par de veces que algunos Scripts no me funcionan, o algunos Menues (descargados de la RED) tampoco según tengan esa línea de cabecera que les comento arriba, inclusive me pasó con el 2do ejemplo que si quito el http y lo pongo así:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

influye en algunos códigos Scripts, en fin me gustaría que me orienten por favor ¿Cual la razón de esta cabecera y por qué algunos Scripts no funcionan si se los cambia o se los quita?

Ñuño Martínez · #2 12-03-2007

Esa cabecera sirve para indicar al navegador las características del lenguaje que se utiliza en el documento. Si se la quitas no suele pasar nada, ya que la mayor parte de los navegadores web pueden interpretarlo correctamente, pero no es recomendable eliminarla ya que forma parte del lenguaje SGML y algunos programas pueden despistarse.

Las dos primeras cabeceras indican que se utilizará el lenguaje HTML versión 4.0 y se recomienda no utilizarlo en nuevos documentos, ya que el lenguaje HTML ha sido sustituído por el XHTML, que es más moderno.

Los tres siguientes indican que se utilizará XHTML 1.x. Lo mejor es utilizar el Transitional ya que el Strict es más "estricto" (más posibilidades de error).

El último caso se utiliza en formato "móvil" (teléfonos celulares, PDA's, videoconsolas, etc.). En teoría es más lijero y simple, pero tengo mis dudas.

Para información adicional, consulta el sitio de la W3C. Está en inglés, pero puede resolverte dudas.

roman · #3 12-03-2007

Cita:

Empezado por Ñuño Martínez

Las dos primeras cabeceras indican que se utilizará el lenguaje HTML versión 4.0 y se recomienda no utilizarlo en nuevos documentos, ya que el lenguaje HTML ha sido sustituído por el XHTML, que es más moderno.

¿En dónde se recomienda esto?

// Saludos

Ñuño Martínez · #4 12-03-2007

Cita:

Empezado por roman

¿En dónde se recomienda esto?

// Saludos

En principio es una recomendación implícita, es decir, cuando sale una nueva versión del lenguaje se recomienda implicitamente no utilizar la versión anterior. En este caso XHTML 1.0 es la versión que sigue a HTML 4.0. Sin embargo hay veces que lo hacen explícitamente en la descripción del lenguaje. Ojo, esta recomendación es para los diseñadores web no para los diseñadores de aplicaciones que interpretan páginas web. Para estos últimos las recomendaciones son distintas. Ahora mismo, por ejemplo, se les recomienda que interpreten desde HTML 2.0 hasta XHTML 1.1 BASIC.

Cita:

Empezado por W3C

W3C recommends that user agents and authors (and in particular, authoring tools) produce HTML 4.01 documents rather than HTML 4.0 documents. W3C recommends that authors produce HTML 4 documents instead of HTML 3.2 documents. For reasons of backward compatibility, W3C also recommends that tools interpreting HTML 4 continue to support HTML 3.2 and HTML 2.0 as well.

[p.s.] Estoy intentando encontrar el documento donde habla de esta recomendación implícita pero no lo encuentro. Y ahora que lo leo con más detenimiento, en el documento que describe XHTML 1.0 no dice nada... A ver si he metido la pata.

roman · #5 12-03-2007

Hola, no creo que hayas metido la pata, en el sitio de la W3C que enlazaste pone a xhtml como primera recomendación, pero, hoy por hoy, ¿cuál es la ventaja de uno sobre otro? Por ejemplo, en el FAQ menciona:

Cita:

We could also take advantage of the redesign to clean up some of the more untidy parts of HTML, and add some new needed functionality, like better forms.

¿Tenemos ya mejores formularios?

Me parece que, en efecto, hay una especificación xhtml para formularios pero, ¿ya la manejan los navegadores?

Aclaro, que no pregunto por polemizar, es sólo que a veces me da la impresión de que el xhtml es una buena promesa que aún no se cumple

EDITO:

Lo que quisiera es saber cuál es la razón de peso para tener que poner los </p>

// Saludos

Ñuño Martínez · #6 13-03-2007

Cita:

Empezado por roman

Lo que quisiera es saber cuál es la razón de peso para tener que poner los </p>

La principal razón, por lo que he leído, es que la especificación SGML (en la que se basa HTML) es demasiado laxa mientras que XML (basada en SGML y de la que se basa XHTML) es más robusta y coherente. Es decir, que es más fácil encontrar errores de diseño en XHTML que en HTML.

Cita:

Empezado por roman

¿Tenemos ya mejores formularios?

Me parece que, en efecto, hay una especificación xhtml para formularios pero, ¿ya la manejan los navegadores?

He hecho pruebas con Firefox 2, Opera 10 e Internet Explorer 7 y parece que sí lo soportan. Si quieres verlo con tus propios ojos puedes echarle un ojo a esta plantilla XHTML.

roman · #7 13-03-2007

Hola Ñuño,

Le he echado un ojo a la página, pero no veo a qué te refieres. Los formularios que ahí aparecen son los mismos salvo- como todo en xhtml -los / finales:

<input bla bla bla />

¿Estoy viendo mal?

Yo estaba pensando más bien en los xforms que se supone permitirán una mejor o completa separación entre la presentación y el contenido.

// Saludos

Ñuño Martínez · #8 13-03-2007

Que yo sepa, hay algunas cosas nuevas como el marco 'fieldset' y el 'button'. Ahora no recuerdo si las versiones anteriores a HTML 4 soportaban el 'label'.

De todas formas, creo que es más un cambio hacia XML que otra cosa (utilizar sólo minúsculas, la barra al final de las etiquetas únicas, etc).

roman · #9 13-03-2007

Cita:

Empezado por Ñuño Martínez

(utilizar sólo minúsculas, la barra al final de las etiquetas únicas, etc).

¡Exacto! Y a eso es a lo que me refiero. Tal parece que la única diferencia entre HTML 4 y XHTML es la notación xml, lo cual puede ser bueno en un futuro, pero hoy por hoy, no parece representar ninguna ventaja sustancial y sólo nos hace escribir los engorrosos / finales.

// Saludos

Deiv · #10 31-12-2007

Me ha interesado cómo obtuvieron fijar un logo inamovible en esta página:

Código PHP:


			
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<style type="text/css">
#logo {
 Z-INDEX: 1; LEFT: 0px; MARGIN: 0px; COLOR: white; POSITION: absolute; TOP: 0px
}
[id]#logo {
 POSITION: fixed
}
</style>
<body>
<P id=logo><A title=Home href="http://coding.derkeiler.com/"><IMG title=Home 
height=308 alt=derkeiler.com src="logo.png" width=77 border=0></A></P>
</body>
</html>

PRIMERO.-
El código trabaja muy bien en IE7 pero:
1.- En IE6 no funciona ¿Por qué?
2.- En IE7 si de la cabecera le quito: "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
y solamente le dejo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
Tampoco funciona ¿Por qué?

SEGUNDO.-
El Script de abajo que encontre de tantos ejemplos en la Red:

Código PHP:


			
if (document.all) {
yourLogo = "Mouse Orbital - "; 
logoFont = "Arial";
logoColor = "FFFFFF";
yourLogo = yourLogo.split(''); 
L = yourLogo.length; 
TrigSplit = 360 / L; 
Sz = new Array()
logoWidth = 60; 
logoHeight = -30; 
ypos = 0; 
xpos = 0; 
step = 0.03; 
currStep = 0; 
document.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < L; i++) {
 document.write('<div id="ie" style="position:absolute;top:0px;left:0px;'
 +'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'
 +'color:'+logoColor+';text-align:center">'+yourLogo[i]+'</div>');
}
document.write('</div></div>');
function Mouse() {
ypos = event.y;   
xpos = event.x - 5;  
}
document.onmousemove=Mouse;
function animateLogo() {
 outer.style.pixelTop = document.body.scrollTop;  
 for (i = 0; i < L; i++) {  
  ie[i].style.top = ypos + logoHeight * Math.sin(currStep + i * TrigSplit * Math.PI / 180);
  ie[i].style.left = xpos + logoWidth * Math.cos(currStep + i * TrigSplit * Math.PI / 180);
  Sz[i] = ie[i].style.pixelTop - ypos; 
  if (Sz[i] < 5) 
   Sz[i] = 5; 
  ie[i].style.fontSize = Sz[i] / 1.7; 
 }
 currStep -= step; 
 setTimeout('animateLogo()', 20); 
}
window.onload = animateLogo;
}

Si coloco en la Cabececera:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
Este interesante efecto funciona siguiendo al Mouse pero.... cuando se hace Scroll de la Página con la rueda Central del Mouse: El EFECTO del Script NO SIGUE al Mouse ¿Por qué?

Sin embargo si QUITO toda la cabecera, o sea borro todo el:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
¡Funciona perfectamente!! ¿Por qué?. El efecto sigue al mouse, y con el scroll tampoco se hace problemas.

Entonces resumiendo:
Nuevamente ¿Cómo entender esto de las Cabeceras? ¿Cómo darse cuenta para los ejemplos que menciono: ¿Cuando utilizar uno de otro?
En la primera pregunta estoy suponiendo que el IE6 no tiene esa capacidad para mantener fijo el logo?
Pero ¿por qué al borrar como mencioné UNA PARTE de la cabecera tampoco funciona en IE7?
En la segunda pregunta mas extraño aún, si quito toda, pero toda la cabecera, funciona muy bien el Script, y ¿Por qué NO así con cabecera?
Feliz Año nuevo a todo los amigos del Foro!

Deiv · #11 10-01-2008

Hola amigos,
No existe alguna orientación sobre mi último post?
Saludos

jachguate · #12 11-01-2008

Cita:

Empezado por Deiv

Nuevamente [i]¿Cómo entender esto de las Cabeceras?

Creo que lo primero que debes preguntarte es para que sirve la cabecera. Dicho en pocas palabras, es una indicación al Web Browser de cómo interpretar el contenido de la página. Si la cabecera no está, el WebBrowser usará la convención que él mismo determine.
Esto responde automáticamente la pregunta que has hecho:

Cita:

Empezado por Deiv

En la segunda pregunta mas extraño aún, si quito toda, pero toda la cabecera, funciona muy bien el Script, y ¿Por qué NO así con cabecera?

Porque al no estar la cabecera, un determinado navegador está suponiendo que tu documento cumple con determinado estándar. Al estar la cabecera, quien está indicando cuál es ese estandar sos vos.

Cita:

Empezado por Deiv

¿Cómo darse cuenta para los ejemplos que menciono: ¿Cuando utilizar uno de otro?

No creo que exista un método estándar para esto. Debes leer, conocer y entender las especificaciones, debes también leer sobre saber cómo funcionan los navegadores, ya que hay algunos (como el IE) que en muchos casos se pasán el estándar por el forro... y finalmente, aplicar el método de prueba y error.

Triste, pero cierto.

Hasta luego.

Temas Similares
Tema	Autor	Foro	Respuestas	Último mensaje
publicidad y cabecera	Camila	Internet	2	16-07-2006 09:19:52
Cabecera-líneas	Asshole	Conexión con bases de datos	0	09-06-2005 18:56:58
Cabecera DataGrid	mamen	.NET	4	26-10-2004 13:16:51
Cabecera-lineas	Asshole	Impresión	1	27-05-2004 04:40:39
Cabecera en SubDeails	buitrago	Impresión	0	25-11-2003 19:29:47