HTML

1. INTRODUCCIN Cada vez ms empresas, grandes organizaciones e incluso particulares en general tienen la necesidad de publicar informacin en Internet, dando a conocer sus productos, informando a los clientes, o simplemente presentando nuestras aficiones o quizs el curriculum al resto del mundo. Todos estos tipos de pginas web se pueden realizar mediante HTML, HyperText Markup Language. Es un lenguaje de hipertexto, lo que quiere decir que mediante unas determinadas zonas calientes (texto o grficos) se puede acceder a otras posiciones de la pgina. Se supone que el usuario ya ha usado navegadores como Netscape Navigator o Internet Explorer. Durante todo este manual se intentar explicar lo ms claramente posible algunas de las caractersticas ms importantes de HTML, sin pretender hacer un desarrollo completo, sino intentando guiar al lector en sus primeros pasos pudiendo despus ampliar su formacin con otros textos. Se expondr tambin gran cantidad de ejemplos, tanto el cdigo como la visin final en alguno de los navegadores del mercado. Si desea comprobar el funcionamiento de los mismos, modificarlos con sus propias pruebas, etc., slo tendr que escribir el cdigo tal cual en un editor de texto ascii puro, como puede ser el comando EDIT de MS-DOS o el bloc de notas de Windows. A continuacin grabarlo en un fichero con extensin .HTM o .HTML (en caso que el sistema operativo admita nombres largos). Para visualizar el resultado en su navegador habitual, ejectelo, vaya al men Archivo/Abrir pgina y busque el fichero con el cdigo HTML que se ha creado. El navegador interpretar las etiquetas del fichero .HTML y sacar el resultado por pantalla. No hace falta compilador alguno, es decir, el lenguaje HTML es interpretado y el intrprete es el navegador, por lo que para desarrollar pginas web slo necesitamos un editor de texto ascii (por ejemplo en Notepad) y un navegador para poder ver el resultado de lo que estamos haciendo. 2. VERSIONES DE HTML

HTML 2.0
Internet, en sus comienzos, prcticamente slo era usada para la difusin de proyectos de investigacin en las Universidades y para usos en que primaba el contenido y no el aspecto visual de stos, por lo que no se mir tanto por los detalles estticos, sino que lo ms importante de las pginas web era la informacin que contenan. Por esta razn las primeras versiones de HTML, cuando lleg el verdadero desarrollo de Internet, no tenan un control demasiado avanzado de los documentos.

 HTML 3.0
La compaa del navegador Netscape comenz a ampliar las funcionalidades de este lenguaje, pero sin seguir ningn estndar, por lo que el IETF (organismo que decida los estndares de Internet) decidi elaborar la versin 3.0. Pero sta result ser demasiado compleja para la poca, por que no tuvo la aceptacin esperada en el mercado.

HTML 3.2
Las empresas lderes en el mercado del momento (Netscape, Sun, Microsoft, etc...) crearon un nuevo comit para la realizacin de estndares para las posteriores versiones de HTML. Este comit se llam W3C, que en la actualidad sigue validando las nuevas versiones.

HTML 4.0
El 17 de septiembre de 1997 se aprob la versin 4.0 en la que se introdujeron cosas como los marcos (frames), los scripts, las hojas de estilo, etc.

Notas sobre las versiones

Estar al da en las versiones de HTML no es demasiado difcil, ya que siempre tenemos a nuestra disposicin gratuitamente todos los manuales de las versiones que van apareciendo en algunas pginas web. No podemos pasar por alto el resto de lenguajes que siguieron apareciendo a raz del HTML y que en unos casos le complementan y en otros le sustituyen por completo, como son HTML Dinmico, JavaScript, Java, XML, VBScript, etc., pero estos se salen del campo de este seminario.

3. PRIMEROS PASOS

Las etiquetas
Para comenzar, se ver que el HTML es un lenguaje que se basa en SGML (estndar internacional para la definicin de mtodos de representacin de texto en forma electrnica no ligados a ningn sistema ni a ningn dispositivo), lo que quiere decir que todo ir encerrado entre dos etiquetas, normalmente, una que indica el comienzo de algn elemento del documento y otra que indica el final del mismo. Estas son de la forma:
<ETIQUETA parmetros> </ETIQUETA>

Cada una va entre los signos de menor que (<) y mayor que (>). Como podemos ver, para cerrar el elemento ir una barra (/) despus de la indicacin de comienzo de una etiqueta. Al principio y final del texto tenemos la etiqueta HTML, que indica que estamos ante una pgina web programada en HTML.
<HTML> Indica el comienzo de un documento en formato HTML. </HTML> Indica el final del documento.

Estas dos etiquetas siempre aparecern en los ficheros programados en HTML para indicarle al navegador que lo que est interpretando es lenguaje HTML.

El interior de un documento.
Como se ha comentado en el apartado anterior, toda pgina en HTML tendr al principio la etiqueta <HTML> y al final </HTML>. El interior del documento se compone de una cabecera y un cuerpo. En la cabecera se pondr la informacin relativa a la pgina y en el cuerpo, el contenido de sta. Cada una de estas partes tiene su etiqueta de comienzo y fin (ver ejemplo 1). Dentro de la cabecera se puede poner el ttulo de la pgina de la siguiente forma:
<TITLE> Ttulo de nuestra pgina web </TITLE>

Ms adelante, cuando se tengan los conocimientos bsicos, ser comentaran algunas cosas ms que se pueden hacer con las cabeceras. En el cuerpo ir la informacin que se ver en la pantalla del navegador y por lo tanto, la mayora de las etiquetas que veremos en el resto del seminario.

<HTML> <HEAD> <TITLE> Titulo de mi pagina</TITLE> </HEAD> <BODY> Esta podria ser mi primera pagina Web, creada en lenguaje HTML. </BODY> </HTML>

Visto en el navegador:

4. ETIQUETAS BSICAS Para dar formato al texto y grficos que aparecen en el cuerpo, se tiene una serie de etiquetas bsicas:
<BR> Salto de lnea. Es para obligar al navegador a meter un salto de lnea despus de esta etiqueta. No hay que cerrarla. Si no se pone esta etiqueta y el texto rebasa el tamao de la ventana del navegador, los saltos de lnea se producen automticamente. Por tanto esta etiqueta se usa para obligar a que se produzcan estos saltos en sitios determinados. <HR> Barra horizontal. Introduce una lnea horizontal que cruza la pantalla. Tampoco hay que cerrarla. Adems a esta etiqueta sae le pueden poner atributos que modifiquen el aspecto de esta barra, como son WIDTH (para el tamao de izquierda a derecha) y SIZE (para el espesor, de arriba abajo). Ya veremos un ejemplo de cmo se hace esto. <CENTER></CENTER> Centrar. Todo lo que tenga entre la apertura y cierre de la etiqueta

quedar perfectamente centrado en la pantalla.

<!---> Comentario. Todo lo que aparezca entre estas seales no lo tendr en cuenta el navegador. Hay una excepcin en caso del JavaScript, pero no entra en las expectativas de este seminario.

Se va a utilizar todo lo aprendido hasta ahora en un ejemplo:

<HTML> <HEAD> <TITLE> Mi segunda pagina web </TITLE> </HEAD> <BODY> Ejemplo numero 2:<BR>Comprobamos el funcionamiento de las etiquetas aprendidas hasta ahora. Veamos como se formatea el texto en el navegador.<BR><BR> <HR <HR <HR <HR WIDTH="100" SIZE="5"> WIDTH="75" SIZE="5"> WIDTH="50" SIZE="5"> WIDTH="25" SIZE="5">

<BR> <CENTER>Texto Centrado</CENTER> <BR> <!-- Este es un comentario, por lo que no aparecer en el navegador --> <HR <HR <HR <HR WIDTH="25%" SIZE="2"> WIDTH="50%" SIZE="3"> WIDTH="75%" SIZE="4"> WIDTH="100%" SIZE="5">

</BODY> </HTML>

Visto en el navegador:

Es recomendable que el alumno haga modificaciones sobre los ejemplos y visualice el resultado en algn navegador.