2. ESTRUCTURA DEL DOCUMENTO
2.1.cabecera
La instrucción <HEAD></HEAD> delimita la cabecera del documento. Dentro de ella pueden incluirse otras instrucciones importantes: La instrucción cerrada <TITLE> donde se incluirá el titulo de la página web:
<TITLE>Pagina de ejemplo</TITLE>
Y la instrucción <META> que es abierta, sirve para indicar el contenido y las palabras clave de la web y es muy importante dado que la mayoria de los buscadores existentes en internet utilizan el contenido de esta instrucción para incluir la página en sus bases de datos. Esta instrucción cuenta entre otros con los parámetros name y content.
Los parámetros pueden indicarse o no, sino se establecen el navegador entenderá que debe usar los designados por defecto. Si en una instrucción se incluyen parámetros estos deben colocarse junto a la palabra clave de inicio y antes del simbolo >. Los valores específicos de cada parámetro van encerrados entre comillas y detrás del signo =.
<META name="Pagina de prueba" content="Página creada para aprender a construir un documento HTML que contendrá todo lo que se aprenda en este tutorial">
El ejemplo anterior indica el nombre que le hemos dado a la página y contiene un breve resumen definiendo su contenido
<META name="keywords" content="color texto listas tablas enlaces imagenes">
Este ejemplo indicará a los buscadores las palabras clave de la web (keywords), es decir sus contenidos, las cuales deben ir en el parámetro content separadas entre ellas por un espacio.
Antes de continuar, añadiremos lo aprendido a nuestra pagina index.htm:
| <HTML> <HEAD> <TITLE>Pagina de ejemplo</TITLE> <META name="Pagina de prueba" content="Página creada para aprender a construir un documento HTML que contendrá todo lo que se aprenda en este tutorial"> <META name="keywords" content="color texto listas tablas enlaces imagenes"> </HEAD> <BODY> </BODY> </HTML> |
NOTA: Siempre debes guardar la primera página de tu web con el nombre "index.htm", pues los navegadores tienen establecido que la primera pagína a abrir de una web es la que tiene este nombre.
2.2.Cuerpo
Dentro de la instrucción cerrada <BODY> es donde va a ir todo el contenido que queramos que tenga nuestra página web. En primer lugar veamos los parámetros que tiene esta instrucción y para que sirven:
background="nombre del fichero".
Si queremos que el fondo del documento sea alguna imagen este es
el parámetro que debe utilizarse, en el espacio entre comillas
debe ir el nombre del fichero. Si no esta en el mismo directorio
debe ir con la dirección. Ten en cuenta que si la imagen es
pequeña y no rellena todo el fondo del documento, se
reproducirá tantas veces como sea necesario para rellenarlo. Es
como en los fondos del escritorio en windows.
bgcolor="código del color".
Si no utilizaste el parámetro anterior para insertar algún
archivo de fondo, con este podrás ponerle un color. Aúnque
pongas un color no se verá si has utilizado el parámetro background
con algún archivo.
text="código de color".
Indica un color para el texto que incluyamos en nuestro
documento. Por defecto es negro.
link="código de color".
Indica el color de los textos que dan acceso a un hiperenlace.
Por defecto es azul
vlink="código de color".
Indica el color de los textos que dan acceso a un hiperenlace que
ya hemos visitado con el navegador. Por defecto es púrpura.
alink="código de color".
Indica el color de los textos que dan acceso a un hiperenlace que
está activo. Por defecto es rojo.
Los codigos de color son números hexadecimales compuestos por tres pares de cifras que indican la proporción de los colores primarios: rojo, verde y azul. El código se antecede del simbolo#. Asi los colores variarán desde" #000000" que es el negro hasta el "#FFFFFF" que es el blanco. Entre ellos, por citar alguno, tienes el rojo "#FF0000" o el azul "#0000FF".
El primer par de cifras indican la proporción de color rojo, el segundo par de cifras la proporción de color verde y las dos últimas la proporción de color azul. Cada par de cifras hexadecimales nos permite un rango de 0 a 255. Combinando las proporciones de cada color primario obtendremos los diferentes colores.
En HTML existe la posibilidad de incluir comentarios que no serán mostrados por el visor y son útiles para realizar anotaciones que nos indiquen lo que estamos haciendo en una determinada parte del documento. Esto puede resultar importante a medida que la página contenga más cosas y tenga un código muy extenso.
Para incluir comentarios en la página Web se utiliza la instrucción <!-- -->:
<!-- Esto es un comentario-->
Vamos a poner titulo, color de fondo amarillo, texto negro y un comentario a nuestra página portada.htm:
| <HTML> <HEAD> <TITLE>Portada</TITLE> </HEAD> <!-- A continuación se pone fondo amarillo y texto en negro--> <BODY bgcolor ="#FFFF00" text"#000000"> </BODY> </HTML> |