Capítulo 2.
Directivas y estructura de un documento HTML
A pesar de que existen montones de programas para crear páginas web de un
modo super automatizado, nosotros nos vamos a valer de nuestro procesador
de textos preferidos para crear los documentos html, o lo que es lo mismo,
los archivos .htm que los distintos navegadores entienden y son capaces
de interpretar.Una vez que nos encontremos frente a nuestro procesador de textos ya podemos
empezar a darle a la tecla.
Bien, aquí vamos a ver la estructura que debe de tener todo documento HTML
que creemos, de esta forma, siempre partiremos de un esqueleto básico, al que
tan sólo tendremos que añadir comandos y textos para hacer que se adapte
a lo que nostros queramos.
Antes de comentaros las tres zonas básicas en las que se divide un documento
HTML, os diré qué son las directivas. Durante la creación de cualquier
documento HTML es necesario utilizar las directivas, marcas o tags, dichas
directivas, van entre los símbolos de mayor y menor, esto es, van entre
< y >. Para indicar a qué es a lo que afectan las directivas, lo que
se hace es poner una directiva al comienzo de lo que se quiere afectar y
otra al final, con la peculiaridad de que esta última tendrá también la
barra /. De esta forma, el esquema de una directiva sería:
<directiva> Zona del documento afectada </directiva>
Una vez entendida esta tontería pasamos a describir las 3 zonas de un
documento HTML.
Todo documento HTML tiene o dispone de tres zonas claramente diferenciadas,
estas son:
1. Zona Cabecera.
En esta zona es la que indica el comienzo de nuestro documento HTML, la
verdad es que es algo tan chorra como tener que poner la directivas
<HTML> y <HTML/> en el documento. La primera de ellas sirve
para indicar que empezamos ahí, mientras que la última (la que tiene
/) indica que terminaremos ahí (todo esto ya os lo conté más arriba).
Cabe decir que es indiferente (y esto se va a aplicar a todo lo que veamos) que se escriban las directivas HTML
en mayúsculas o en minúsculas.
Otra de las directivas que se puede considerar dentro de la zona de cabecera
y que va dentro de la directiva HTML (todo el documento va dentro de la
directiva HTML) es la de HEAD. Esta directiva, indica el comienzo de la
zona en donde podemos poner el título de nuestra página WEB, es decir, el
título de la ventana del navegador cuando carge nuestra página WEB. Para
ello basta utilizar, dentro de HEAD, la directiva TITLE que nos permite
escribir el título.
Un ejemplo de todo lo visto hasta ahora podría ser el siguiente:
<HTML>
<HEAD>
<TITLE>Macedonia Magazine</TITLE>
</HEAD>
</HTML>
Si metieramos esto en un archivo de texto normal y corriente con la extensión
htm y lo cargaramos en nuestro navegador favorito, veríamos que en la zona
de títulos de la ventana se leería Macedonia Magazine.
2. Cuerpo del Documento.
En esta zona escriberemos la mayor parte de nuestra página WEB, ya que mediante
las directiva <BODY> podemos escribir texto para que
aparezca en la página o también podemos incluir otras directivas que nos
permitan poner gráficos, enlaces, música, en definitiva, todo lo que nos
ofrece la amplia gama de directivas del HTML. De esta forma, si queremos
escribir algo sólo tenemos que ponerlo entre la directiva de BODY.
3. Zona final.
En esta zona, deberán de estar las directivas de cierre, esto es, las que
llevan incluido la barra /. Asegurate que al final del documento encuentras
las directivas </BODY> y </HTML>.
Resumen de todo lo visto.
1. Siempre hay que acordarse que hay que comenzar la escritura de una página
WEB con <HTML>.
2. Si deseamos que aparezca algo en la ventana del navegador al cargarse
nuestra página, deberemos de incluir la cabecera del documento y en
su interior poner el título. Esto se conseguía con <HEAD><TITLE>
Título de la página</TITLE></HTML>.
3. Todo lo que queremos contar, los gráficos, el sonido, los enlaces, todo
eso, ha de ir entre dos directivas, estas son <BODY> y </BODY>.
4. Debemos de asegurarnos que al final de la página leemos el cierre de
la directiva HTML, esto es, que leemos </HTML>.
Un ejemplo para aclarar todo
A continuación teneis un ejemplo que si lo meteeis en un archivo .htm y
lo cargais en vuestro navegador leereis "Se supone que tengo que salir
en pantalla.", como podeis
comprobar es una chorrada.
<HTML>
<HEAD>
<TITLE>Ejemplo de HTML</TITLE>
<BODY>
Se supone que tengo que salir en pantalla.
</BODY>
</HEAD>
</HTML>
En el siguiente capítulo veremos como sacar el texto más bonito ;-).