Go to main content
Bypass navigation bar Referencia HTML Tags HTML Tutoriales HTML
Bypass language selection
Bypass location bar

Location: Inicio > Tutoriales HTML > La estructura de un documento HTML > La estructura de un documento HTML (página 2)

Bypass main content

La estructura de un documento HTML (página 2)

Páginas:<12
Bypass main content

El cuerpo del documento

El cuerpo es el contenedor para la parte visual del documento. Todas las cosas escritas aquí (excepto por casos especiales) serán mostradas cuando el documento sea finalmente representado. La mayoría de los tags en HTML pueden ser insertados en la sección del cuerpo (dentro del elemento HTML body) y dar´na forma al aspecto visial del documento.

Práctica

Para este tutorial construiremos una estructura básica de documento que será útil para el desarrollo de las siguientes prácticas.

Para comenzar, estableceremos la primera cosa que todo documento debería tener para encajar en los estándares: La declaración del tipo de documento (DTD). En este ejemplo, y porque creo es la mejor elección (la última versión que involucra menores complicaciones de compatibilidad), construiremos un documento compatible con XHTML. Para ello, primero revisamos la referencia para el tag HTML !DOCTYPE, de donde escogeremos la declaración adecuada.

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

La declaración precedente establecerá qué podemos y qué no podemos hacer en nuestro documento.

El próximo paso en nuestra práctica es definir el elemento html dentro del cual se encerrará a todo el documento. Con este tag, también estableceremos dos parámetros: el nombre de espacio XML, a través del atributo "xmlns", y el lenguaje del documeto a través de los atributos "xml:lang" y "lang" (nota que otros lenguajes no compatibles con XML, como HTML 4.01, usarían únicamente el atributo "lang", mientras que XHTML 1.1 usaría únicamente el "xml:lang"). El valor para estos atributos puede obtenerse de esta lista del códigos de lenguaje.

Código
<!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="es" lang="es">
</html>

ahora agregaremos dos partes importantes de cualquier documento: el encabezado y el cuerpo. Ambos elementos, el elemento HTML head y el elemento HTML body, serán insertados en ese orden, como contenido del elemento html. Aún cuando los dos elementos tiene atributos disponibles, no utilizaremos ninguno de ellos ya que no son necesarios en este ejemplo (así como en la mayoría de los documentos básicos). Para ahorras algunos pasos agregaremos ambos al mismo tiempo.

Código
<!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="es" lang="es">
<head>
</head>
<body>
</body>
</html>

Ahora sólo emplazaremos el título en el encabezado; el contenido del cuerpo será reservado para futuros tutoriales.

Recuerda que el título debe describir de manera concisa el contenido del documento. emplazaremos el título con el elemento HTML title.

Código
<!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="es" lang="es">
<head>
<title>Ejemlpo básico de documento</title>
</head>
<body>
</body>
</html>

Eso es todo. La estructura principal para un documento básico ha sido establecida. Este "marco" puede ser reutilizado para construir otros documentos, y de hecho será utilizada en tutoriales próximos. Prepárate!

Páginas:<12

Diseño y desarrollo: Latitud29.com

Vínculos y logos|Contacto|Más allá de HTML|Herramientas y recursos|Mapa del sitio|Webmaster|Dona