Nota: Este documento es parte de una traducción al castellano de la Recomendación del W3C "HTML 4.01 Specification" (más información). Puede consultar la versión original del mismo. Para cualquier comentario o corrección acerca de la traducción póngase en contacto con el traductor en jrpozo[arroba]conclase.net. Gracias por su colaboración.
Véase el Aviso de copyright de la traducción.
Contenidos
Un documento HTML 4 se compone de tres partes:
Puede aparecer espacio en blanco (espacios, saltos de línea, tabulaciones y comentarios) antes y después de cada sección. Las secciones 2 y 3 deberían estar delimitadas por el elemento HTML.
Aquí tenemos un ejemplo de un documento HTML sencillo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Mi primer documento HTML</TITLE>
</HEAD>
<BODY>
<P>¡Hola mundo!
</BODY>
</HTML>
Un documento HTML válido declara qué versión de HTML se utiliza en el documento. La declaración del tipo de documento especifica la definición del tipo de documento (DTD) que se usa en el documento (ver [ISO8879]).
HTML 4.01 especifica tres DTDs, de modo que los autores deben incluir una de las siguientes declaraciones del tipo de documento en sus documentos. Los DTDs varían en cuanto a los elementos que soportan.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
El URI que aparece en la declaración del tipo de documento permite a los agentes de usuario descargar el DTD y los conjuntos de entidades que sean necesarios. Los siguientes URIs (relativos) se refieren a los DTDs y conjuntos de entidades de HTML 4:
La vinculación entre identificadores públicos y ficheros puede especificarse utilizando un fichero de catálogo según el formato recomendado por el Oasis Open Consortium (ver [OASISOPEN]. Al comienzo de la sección sobre la referencia SGML de HTML 4.01 se incluye un fichero de catálogo de muestra para HTML 4.01. Las dos últimas letras de la declaración indican el idioma del DTD. Para HTML, éste es siempre inglés ("EN").
Nota. En lo que concierne a la versión de HTML 4.01 del 24 de diciembre, el Grupo de Trabajo HTML se compromete a la siguiente política:
Esto significa que en una declaración del tipo de documento, los autores pueden utilizar con seguridad un identificador de sistema que se refiera a la última versión de un DTD HTML 4. Los autores también pueden optar por usar un identificador de sistema que se refiera a una version específica (antigua) de un DTD HTML 4 cuando sea necesaria la validación con respecto a ese DTD en particular. El W3C hará todo lo posible para que los documentos archivados estén siempre disponibles en sus direcciones originales y en su forma original.
<!ENTITY % html.content "HEAD, BODY"> <!ELEMENT HTML O O (%html.content;) -- elemento raíz del documento --> <!ATTLIST HTML %i18n; -- lang, dir -- >
Etiqueta inicial: opcional, Etiqueta final: opcional
Definiciones de atributos
Atributos definidos en otros lugares
Después de la declaración del tipo de documento, el resto de un documento HTML está contenido en el elemento HTML. Así, un documento HTML típico tiene esta estructura:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> ...La cabecera, el cuerpo, etc. van aquí... </HTML>
<!-- %head.misc; definido previamente como "SCRIPT|STYLE|META|LINK|OBJECT" --> <!ENTITY % head.content "TITLE & BASE?"> <!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- cabecera del documento --> <!ATTLIST HEAD %i18n; -- lang, dir -- profile %URI; #IMPLIED -- diccionario de metainformación con nombre -- >
Etiqueta inicial: opcional, Etiqueta final: opcional
Definiciones de atributos
Atributos definidos en otros lugares
El elemento HEAD contiene información sobre el documento actual, como el título, palabras clave que pueden ser de utilidad para motores de búsqueda, y otros datos que no se consideran parte del contenido del documento. En general, los agentes de usuario no representan los elementos que aparecen como contenido del HEAD. Sin embargo, pueden poner la información del HEAD a disposición de los usuarios a través de otros mecanismos.
<!-- El elemento TITLE no se considera parte del flujo de texto.
Debería ser mostrado, por ejemplo, como el encabezado de la página
o como el título de la ventana. Se requiere exactamente un título
por documento.
-->
<!ELEMENT TITLE - - (#PCDATA) -(%head.misc;) -- título del documento -->
<!ATTLIST TITLE %i18n>
Etiqueta inicial: obligatoria, Etiqueta final: obligatoria
Atributos definidos en otros lugares
Todos los documentos HTML deben tener un elemento TITLE en la sección HEAD.
Los autores deberían utilizar el elemento TITLE para identificar los contenidos de un documento. Debido a que los usuarios a menudo consultan documentos fuera de contexto, los autores deberían proporcionar títulos ricos en contexto. Así, en vez de usar un título como "Introducción", que no proporciona mucha información acerca del contexto, los autores deberían poner en su lugar un título del estilo "Introducción a la apicultura medieval".
Por razones de accesibilidad, los agentes de usuario siempre deben poner el contenido del elemento TITLE a disposición de los usuarios (incluyendo los elementos TITLE que aparezcan en marcos). El mecanismo para ello depende del agente de usuario (p.ej., como un título, hablado).
Los títulos pueden contener entidades de caracteres (para caracteres acentuados, caracteres especiales, etc.), pero no pueden contener código (incluyendo comentarios). Aquí tenemos un ejemplo de título de documento:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>Un estudio sobre la dinámica de la población</TITLE> ... otros elementos de cabecera... </HEAD> <BODY> ... cuerpo del documento... </BODY> </HTML>
Definiciones de atributos
A diferencia del elemento TITLE, que proporciona información sobre un documento entero y que sólo puede aparecer una vez, el atributo title puede anotar cualquier número de elementos. Para saber si un elemento soporta este atributo consulte la definición del elemento.
Los valores del atributo title pueden ser representados por los agentes de usuario de diferentes maneras. Por ejemplo, los navegadores visuales suelen representar el título como un "tool tip" (un mensaje corto que aparece cuando el dispositivo apuntador se detiene sobre un objeto). Los agentes de usuario de voz pueden pronunciar la información del título en un contexto similar. Por ejemplo, al establecer el atributo en un vínculo, los agentes de usuario (visuales y no visuales) pueden decir a los usuarios la naturaleza del recurso vinculado:
...texto... Aquí hay una foto mía <A href="http://algunsitio.com/cosascheveres.gif" title="Yo haciendo submarinismo"> haciendo submarinismo el verano pasado </A> ...más texto...
El atributo title tiene un papel adicional cuando se utiliza con el elemento LINK para designar una hoja de estilo externa. Consulte la sección sobre vínculos y hojas de estilo para más detalles.
Nota. Para mejorar la calidad de la síntesis de voz en los casos en que las técnicas estándar logran malos resultados, las versiones futuras de HTML podrían incluir un atributo para codificar información fonémica y prosódica.
Nota. El Marco de Descripción de Recursos (Resource Description Framework) del W3C (ver [RDF10]) se convirtió en Recomendación del W3C en febrero de 1999. El RDF permite a los autores especificar metadatos legibles por máquina sobre documentos HTML y otros recursos accesibles por la red.
El HTML permite a los autores especificar metadatos -- información sobre un documento más que contenido del propio documento -- de diferentes de maneras.
Por ejemplo, para especificar el autor de un documento, puede utilizarse el elemento META como sigue:
<META name="Author" content="Dave Raggett">
El elemento META especifica una propiedad (aquí "Author") y le asigna un valor (aquí "Dave Raggett").
Esta especificación no define un conjunto de propiedades legales de metadatos. El significado de una propiedad y el conjunto de valores legales para esa propiedad debería estar definida en un diccionario de referencia llamado perfil. Por ejemplo, un perfil diseñado para ayudar a los motores de búsqueda a indexar documentos podría definir propiedades tales como "author", "copyright", "keywords", etc.
En general, la especificación de metadatos implica dos pasos:
Obsérvese que al estar definido un perfil por el elemento HEAD, se aplica el mismo perfil a todos los elementos META y LINK de la cabecera del documento.
Los agentes de usuario no necesitan soportar los mecanismos de metadatos. Para aquellos que opten por soportar metadatos, esta especificación no define cómo deberían interpretarse los metadatos.
<!ELEMENT META - O EMPTY -- metainformación genérica --> <!ATTLIST META %i18n; -- lang, dir, para usar con content -- http-equiv NAME #IMPLIED -- nombre de encabezado de respuesta HTTP -- name NAME #IMPLIED -- nombre de la metainformación -- content CDATA #REQUIRED -- información asociada -- scheme CDATA #IMPLIED -- seleccionar forma de contenido -- >
Etiqueta inicial: obligatoria, Etiqueta final: prohibida
Definiciones de atributos
Para los siguientes atributos, los valores permitidos y su interpretación depende del perfil:
Atributos definidos en otros lugares
El elemento META puede utilizarse para identificar propiedades de un documento (p.ej., el autor, la fecha de caducidad, una lista de palabras clave, etc.) y para asignar valores a esas propiedades. Esta especificación no define un conjunto normativo de propiedades.
Cada elemento META especifica una pareja propiedad/valor. El atributo name identifica la propiedad y el atributo content especifica el valor de la propiedad.
Por ejemplo, la siguiente declaración establece un valor para la propiedad Author:
<META name="Author" content="Dave Raggett">
Puede utilizarse el atributo lang de META para especificar el idioma del valor del atributo content. Esto permite a los sintetizadores de voz aplicar reglas de pronunciación dependientes del idioma.
En este ejemplo, se declara que el nombre del autor está en francés:
<META name="Author" lang="fr" content="Arnaud Le Hors">
Nota. El elemento META es un mecanismo genérico para la especificación de metadatos. Sin embargo, hay algunos elementos y atributos HTML que ya manejan determinados metadatos y que pueden ser utilizados por los autores en lugar de META para especificar dichos metadatos: el elemento TITLE, el elemento ADDRESS, los elementos INS y DEL, el atributo title, y el atributo cite.
Nota. Cuando una propiedad especificada mediante un elemento META toma un valor que es un URI, algunos autores prefieren especificar los metadatos mediante el elemento LINK. Así, la siguiente declaración de metadatos:
<META name="DC.identifier"
content="http://www.ietf.org/rfc/rfc1866.txt">
también podría haberse escrito así:
<LINK rel="DC.identifier"
type="text/plain"
href="http://www.ietf.org/rfc/rfc1866.txt">
El atributo http-equiv puede utilizarse en lugar del atributo name, lo cual tiene un significado especial cuando los documentos se obtienen mediante el Protocolo de Transferencia de Hipertexto (HTTP). Los servidores HTTP pueden usar el nombre de la propiedad especificada por el atributo http-equiv para crear un encabezado al estilo [RFC822] en la respuesta HTTP. Vea la especificación HTTP ([RFC2616]) para más detalles sobre encabezados HTTP válidos.
La siguiente declaración META de ejemplo:
<META http-equiv="Expires" content="Tue, 20 Aug 1996 14:25:27 GMT">
resultará en el encabezado HTTP:
Expires: Tue, 20 Aug 1996 14:25:27 GMT
Esto lo pueden utilizar las cachés para determinar cuándo obtener una nueva copia del documento asociado.
Nota. Algunos agentes de usuario soportan el uso de META para refrescar la página actual después de un número especificado de segundos, con la opción de reemplazarla con un URI diferente. Los autores no deberían utilizar esta técnica para dirigir a los usuarios a páginas diferentes, ya que esto hace la página inaccesible para algunos usuarios. En lugar de eso, la redirección automática de páginas debería realizarse usando redirección en el lado del servidor.
Un uso común de META es especificar palabras clave que pueden usar los motores de búsqueda para mejorar la calidad de los resultados de una búsqueda. Cuando se proporcionen varios elementos META con información para varios idiomas, los motores de búsqueda pueden utilizar el atributo lang como filtro para mostrar los resultados de la búsqueda usando las preferencias de idioma del usuario. Por ejemplo,
<!-- Para hablantes de inglés americano -->
<META name="keywords" lang="en-us"
content="vacation, Greece, sunshine">
<!-- Para hablantes de inglés británico -->
<META name="keywords" lang="en"
content="holiday, Greece, sunshine">
<!-- Para hablantes de español -->
<META name="keywords" lang="es"
content="vacaciones, Grecia, sol">
También puede incrementarse la efectividad de los motores de búsqueda usando el elemento LINK para especificar vínculos a traducciones del documento en otros idiomas, vínculos a versiones del documento en otros medios (p.ej., PDF), y, cuando el documento es parte de una colección, vínculos a un punto apropiado de partida para examinar la colección completa.
Se puede encontrar más ayuda en la sección sobre cómo ayudar a los motores de búsqueda a indexar su sitio Web.
La Plataforma para la Selección de Contenido en Internet (PICS, especificada en [PICS]) es una infraestructura para asociar etiquetas (metadatos) con contenido de Internet. Diseñada originalmente para ayudar a los padres y a las escuelas a controlar los lugares a los que pueden acceder los niños en Internet, también facilita otros usos para las etiquetas, incluyendo firmas de código, privacidad, y gestión de los derechos de la propiedad intelectual.
Este ejemplo ilustra cómo puede usarse una declaración META para incluir una etiqueta PICS 1.1:
<HEAD>
<META http-equiv="PICS-Label" content='
(PICS-1.1 "http://www.gcf.org/v2.5"
labels on "1994.11.05T08:15-0500"
until "1995.12.31T23:59-0000"
for "http://w3.org/PICS/Overview.html"
ratings (suds 0.5 density 0 color/hue 1))
'>
<TITLE>... título del documento ...</TITLE>
</HEAD>
El elemento META puede utilizarse para especificar la información por defecto de un documento en los aspectos siguientes:
El siguiente ejemplo especifica que la codificación de caracteres de un documento es la ISO-8859-5
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-5">
Este ejemplo hace referencia a un perfil hipotético que define propiedades útiles para indexar documentos. A las propiedades definidas en este perfil -- incluyendo "author", "copyright", "keywords" (palabras clave) y "date" (fecha) -- se les asignan valores mediante declaraciones META subsiguientes.
<HEAD profile="http://www.acme.com/profiles/core"> <TITLE>Cómo completar portadas de Memoranda</TITLE> <META name="author" content="José Pérez"> <META name="copyright" content="© 1997 Acme Corp."> <META name="keywords" content="empresarial,instrucciones,catálogos"> <META name="date" content="1994-11-06T08:49:37+00:00"> </HEAD>
En el momento de escribir esta especificación, la práctica común es usar los formatos de fechas descritos en [RFC2616], sección 3.3. Como estos formatos son relativamente complicados de procesar, recomendamos que los autores utilicen el formato de fechas [ISO8601]. Para más información, véanse las secciones sobre los elementos INS y DEL.
El atributo scheme permite a los autores proporcionar a los agentes de usuario más contexto para la interpretación correcta de los metadatos. A veces, esta información adicional puede ser crítica, por ejemplo cuando los metadatos pueden ser especificados según formatos diferentes. Por ejemplo, un autor podría especificar una fecha en el formato (ambiguo) "10-9-97"; ¿significa esto 9 de octubre de 1997 o 10 de septiembre de 1997? El valor "Mes-Día-Año" para el atributo scheme eliminaría la ambigüedad de este valor de fecha.
En otras ocasiones, el atributo scheme puede proporcionar información útil aunque no crítica a los agentes de usuario.
Por ejemplo, la siguiente declaración scheme podría ayudar a un agente de usuario a determinar que el valor de la propiedad "identificador" es un número de código ISBN:
<META scheme="ISBN" name="identificador" content="0-8230-2355-9">
Los valores del atributo scheme dependen de la propiedad name y del profile asociado.
Nota. Un ejemplo de perfil es el Dublin Core (ver [DCORE]). Este perfil define un conjunto de propiedades recomendadas para descripciones bibliográficas electrónicas, y su objetivo es promover la interoperabilidad entre modelos descriptivos dispares.
<!ELEMENT BODY O O (%block;|SCRIPT)+ +(INS|DEL) -- cuerpo del documento --> <!ATTLIST BODY %attrs; -- %coreattrs, %i18n, %events -- onload %Script; #IMPLIED -- el documento ha sido cargado -- onunload %Script; #IMPLIED -- el documento ha sido quitado -- >
Etiqueta inicial: opcional, Etiqueta final: opcional
Definiciones de atributos
Atributos definidos en otros lugares
El cuerpo de un documento contiene el contenido del documento. El contenido puede ser presentado por un agente de usuario de distintas maneras. Por ejemplo, para los navegadores visuales, se puede imaginar el cuerpo como un lienzo sobre el que aparece el contenido: texto, imágenes, colores, gráficos, etc. Para agentes de usuario por voz, el mismo contenido podría ser pronunciado. Debido a que ahora el método preferido de especificar la presentación de un documento son las hojas de estilo, los atributos presentacionales del elemento BODY han sido desaprobados.
EJEMPLO DESAPROBADO:
El siguiente fragmento HTML ilustra el uso de los atributos desaprobados. Establece el color de fondo del
lienzo en blanco, el color de primer plano del texto en negro, y el color de
los hipervínculos en rojo inicialmente, fucsia cuando son activados y marrón una
vez que han sido visitados.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <TITLE>Un estudio sobre la dinámica de la población</TITLE> </HEAD> <BODY bgcolor="white" text="black" link="red" alink="fuchsia" vlink="maroon"> ... cuerpo del documento ... </BODY> </HTML>
Usando hojas de estilo, se podría conseguir el mismo efecto de la siguiente manera:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Un estudio sobre la dinámica de la población</TITLE>
<STYLE type="text/css">
BODY { background: white; color: black }
A:link { color: red }
A:visited { color: maroon }
A:active { color: fuchsia }
</STYLE>
</HEAD>
<BODY>
... cuerpo del documento ...
</BODY>
</HTML>
El usar hojas de estilo externas (vinculadas) nos da flexibilidad para cambiar la presentación sin tener que revisar el documento fuente HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <TITLE>Un estudio sobre la dinámica de la población</TITLE> <LINK rel="stylesheet" type="text/css" href="estilolisto.css"> </HEAD> <BODY> ... cuerpo del documento ... </BODY> </HTML>
Marcos y cuerpos HTML. Los documentos que contienen marcos reemplazan el elemento BODY con el elemento FRAMESET. Consulte la sección sobre marcos para más información.
Definiciones de atributos
<P id="miparrafo"> Esto es un párrafo con un nombre único.</P> <P id="tuparrafo"> Esto también es un párrafo con un nombre único.</P>
El atributo id tiene varios papeles en HTML:
El atributo class, por otra parte, asigna uno o más nombres de clase a un elemento; se puede decir que el elemento pertenece a estas clases. Varios elementos pueden compartir el mismo nombre de clase. El atributo class tiene varios papeles en HTML:
En el siguiente ejemplo, el elemento SPAN se utiliza junto con los atributos id y class para codificar mensajes informativos. Los mensajes aparecen tanto en inglés como en español.
<!-- Mensajes en inglés --> <P><SPAN id="msg1" class="info" lang="en">Variable declared twice</SPAN> <P><SPAN id="msg2" class="advertencia" lang="en">Undeclared variable</SPAN> <P><SPAN id="msg3" class="error" lang="en">Bad syntax for variable name</SPAN>
<!-- Mensajes en español --> <P><SPAN id="msg1" class="info" lang="es">Variable declarada dos veces</SPAN> <P><SPAN id="msg2" class="advertencia" lang="es">Variable no declarada</SPAN> <P><SPAN id="msg3" class="error" lang="es">Sintaxis incorrecta para el nombre de la variable</SPAN>
Las siguientes reglas de estilo CSS dirían a los agentes de usuario visuales que representaran los mensajes informativos en verde, los mensajes de advertencia en amarillo, y los mensajes de error en rojo:
SPAN.info { color: green }
SPAN.advertencia { color: yellow }
SPAN.error { color: red }
Obsérvese que el "msg1" español y el "msg1" inglés no pueden aparecer en el mismo documento, ya que ambos comparten el mismo valor de id. Los autores pueden hacer un uso mayor del atributo id para refinar la presentación de mensajes individuales, hacerlos vínculos destino, etc.
Se les puede asignar información de identificador y clase a casi todos los elementos HTML.
Supongamos, por ejemplo, que estamos escribiendo un documento sobre un lenguaje de programación. El documento debe incluir un número de ejemplos preformateados. Usamos el elemento PRE para formatear los ejemplos. También asignamos un color de fondo (verde) a todos los ejemplares del elemento PRE que pertenezcan a la clase "ejemplo".
<HEAD>
<TITLE>... título del documento ...</TITLE>
<STYLE type="text/css">
PRE.ejemplo { background : green }
</STYLE>
</HEAD>
<BODY>
<PRE class="ejemplo" id="ejemplo-1">
...código del ejemplo...
</PRE>
</BODY>
Al establecer el atributo id para este ejemplo, podemos (1) crear un hipervínculo a él y (2) sustituir la información de estilo de la clase por información de estilo propia.
Nota. El atributo id comparte el mismo espacio de nombres que el atributo name cuando se usa para nombres de vínculos. Consulte la sección sobre vínculos con id para más información.
Algunos de los elementos HTML que pueden aparecer en BODY se llaman elementos "en bloque" (o también "a nivel de bloque") mientras que otros son elementos "en línea" (o "a nivel de texto"). Esta distinción se basa en varios aspectos:
Las hojas de estilo proporcionan medios para especificar la representación de elementos arbitrarios, incluyendo la representación como elemento en bloque o en línea. En algunos casos, como por ejemplo para información en línea para objetos de lista, esto puede ser apropiado, pero en general no es aconsejable que los autores invaliden la interpretación convencional de los elementos HTML de este modo.
La alteración del estilo de presentación tradicional de los elementos en bloque y en línea también influye en el algoritmo de texto bidireccional. Vea la sección sobre el efecto de las hojas de estilo en la bidireccionalidad para más información.
<!ELEMENT DIV - - (%flow;)* -- contenedor genérico de idioma/estilo --> <!ATTLIST DIV %attrs; -- %coreattrs, %i18n, %events -- > <!ELEMENT SPAN - - (%inline;)* -- contenedor genérico de idioma/estilo --> <!ATTLIST SPAN %attrs; -- %coreattrs, %i18n, %events -- >
Etiqueta inicial: obligatoria, Etiqueta final: obligatoria
Atributos definidos en otros lugares
Los elementos DIV y SPAN, junto con los atributos id y class, ofrecen un mecanismo genérico para añadir estructura a los documentos. Estos elementos especifican si su contenido es en línea (SPAN) o en bloque (DIV) pero no imponen ningún otro estilo de presentación al contenido. Así, los autores pueden usar estos elementos junto con hojas de estilo, el atributo lang, etc., para adaptar el HTML a sus propios gustos y necesidades.
Supongamos, por ejemplo, que quisiéramos generar un documento HTML basado en una base de datos de información sobre clientes. Como HTML no incluye elementos que identifiquen objetos tales como "cliente", "número de teléfono", "dirección de correo electrónico", etc., utilizamos DIV y SPAN para lograr los efectos estructurales y presentacionales deseados. Podríamos usar el elemento TABLE del modo siguiente para estructurar la información:
<!-- Ejemplo de registro de la base de datos de clientes: --> <!-- Nombre: Stephane Boyera, Tel: (212) 555-1212, Email: sb[arroba]foo.org --> <DIV id="cliente-boyera" class="cliente"> <P><SPAN class="cliente-titulo">Información sobre el cliente:</SPAN> <TABLE class="cliente-datos"> <TR><TH>Apellido:<TD>Boyera</TR> <TR><TH>Nombre:<TD>Stephane</TR> <TR><TH>Tel:<TD>(212) 555-1212</TR> <TR><TH>Email:<TD>sb[arroba]foo.org</TR> </TABLE> </DIV> <DIV id="cliente-lafon" class="cliente"> <P><SPAN class="cliente-titulo">Información sobre el cliente:</SPAN> <TABLE class="cliente-datos"> <TR><TH>Apellido:<TD>Lafon</TR> <TR><TH>Nombre:<TD>Yves</TR> <TR><TH>Tel:<TD>(617) 555-1212</TR> <TR><TH>Email:<TD>yves[arroba]coucou.com</TR> </TABLE> </DIV>
A continuación, podemos añadir fácilmente declaraciones a la hoja de estilo para ajustar la presentación de estas entradas de la base de datos.
Para otro ejemplo de uso, consulte el ejemplo de la sección sobre los atributos class e id.
En general los agentes de usuario visuales colocan un salto de línea antes y otro después de los elementos DIV, por ejemplo:
<P>aaaaaaaaa<DIV>bbbbbbbbb</DIV><DIV>ccccc<P>ccccc</DIV>
que normalmente se representa como:
aaaaaaaaa bbbbbbbbb ccccc ccccc
<!ENTITY % heading "H1|H2|H3|H4|H5|H6"> <!-- Hay seis niveles de encabezados, desde H1 (el más importante) hasta H6 (el menos importante). --> <!ELEMENT (%heading;) - - (%inline;)* -- encabezado --> <!ATTLIST (%heading;) %attrs; -- %coreattrs, %i18n, %events -- >
Etiqueta inicial: obligatoria, Etiqueta final: obligatoria
Atributos definidos en otros lugares
Un encabezado describe brevemente el tema de la sección que introduce. La información de encabezado puede ser utilizada por los agentes de usuario, por ejemplo, para construir una tabla de contenidos de un documento automáticamente.
Hay seis niveles de encabezados en HTML, siendo H1 el más importante y H6 el menos importante. Los navegadores visuales pueden representar los encabezados más importantes con fuentes más grandes que los menos importantes.
El siguiente ejemplo muestra cómo usar el elemento DIV para asociar un encabezado con la sección del documento que le sigue. Esto nos permite definir un estilo para la sección (color del fondo, fuente del texto, etc.) con hojas de estilo.
<DIV class="seccion" id="elefantes-de-la-selva"> <H1>Elefantes de la selva</H1> <P>En esta sección descubriremos a esos grandes desconocidos: los elefantes de la selva. ...la sección continúa... <DIV class="subseccion" id="habitat-de-la-jungla"> <H2>Hábitat</H2> <P>Los elefantes de la selva no viven en los árboles, sino entre ellos. ...la subsección continúa... </DIV> </DIV>
Podemos decorar esta estructura con información de estilo tal como ésta:
<HEAD>
<TITLE>... título del documento ...</TITLE>
<STYLE type="text/css">
DIV.seccion { text-align: justify; font-size: 12pt}
DIV.subseccion { text-indent: 2em }
H1 { font-style: italic; color: green }
H2 { color: green }
</STYLE>
</HEAD>
Secciones numeradas y referencias
HTML no genera por sí mismo números de sección
a partir de los encabezados. Sin embargo esto podría ser ofrecido por
los agentes de usuario. Pronto los lenguajes de hojas de estilo como CSS
permitirán a los autores controlar la generación de números de sección (muy
útiles para hacer referencias de documentos impresos, como en "Ver la sección 7.2").
Algunas personas consideran que saltarse niveles de encabezado es mala práctica. Aceptan H1 H2 H1 pero no aceptan H1 H3 H1 ya que se salta el nivel de encabezado H2.
<!ELEMENT ADDRESS - - (%inline;)* -- información sobre el autor --> <!ATTLIST ADDRESS %attrs; -- %coreattrs, %i18n, %events -- >
Etiqueta inicial: obligatoria, Etiqueta final: obligatoria
Atributos definidos en otros lugares
El elemento ADDRESS puede ser utilizado por los autores para proporcionar información de contacto en un documento o en una parte de un documento, como por ejemplo un formulario. Este elemento suele aparecer el principio de un documento.
Por ejemplo, una página del sitio web del W3C relacionada con HTML podría incluir la siguiente información de contacto:
<ADDRESS> <A href="../People/Raggett/">Dave Raggett</A>, <A href="../People/Arnaud/">Arnaud Le Hors</A>, personas de contacto del <A href="Activity">W3C HTML Activity</A><BR> $Fecha: 1999/12/24 23:07:14 $ </ADDRESS>