MDULO DE APRENDIZAJE

CICLO DE FORMACIN: BSICO COMPONENTE: GENERAL

CUADERNO DE ESTUDIO
VENEZUELA, 2006

PROGRAMACIN EN HTML Y JAVA SCRIPT

REPBLICA BOLIVARIANA DE VENEZUELA MINISTERIO PARA LA ECONOMA POPULAR INSTITUTO NACIONAL DE COOPERACIN EDUCATIVA

REPBLICA BOLIVARIANA DE VENEZUELA MINISTERIO PARA LA ECONOMA POPULAR INSTITUTO NACIONAL DE COOPERACIN EDUCATIVA

Septiembre, 2006

Especialistas en Contenido Edwin Hernndez (T.S.U Informtica - Gerencia Regional INCE Portuguesa) Trascripcin y Diagramacin Birley Carolina Escalona (Analista Productor de Medios Gerencia Regional INCE Portuguesai) Coordinacin Tcnica Estructural Divisin de Recursos para el Aprendizaje Coordinacin General Gerencia General de Formacin Profesional Gerencia de Tecnologa Educativa 1ra Edicin 2006 Copyright INCE

NDICE
INTRODUCCIN.................................................................4 ENCABEZADO DE LA PGINA.......................................3 Ttulo de la Pgina.............................................................3 Descripcin de Servidores.................................................3 ESTRUCTURA DEL CUERPO DE LA PGINA ..............5 Uso de Instrucciones Generales para Prrafos y Textos....5 Estructuras del Cuerpo de la Pgina..................................5 Diagramacin Previa de la Pgina.....................................6 FUENTES..............................................................................7 Tipos de fuentes.................................................................7 Estructuras para la Personalizacin de las Fuentes ...........8 FONDOS ............................................................................10 Tipos de Fondos...............................................................10 TABLAS..............................................................................13 Determinacin del Ancho................................................15 Espaciado entre Celdas....................................................15 Combinacin ...................................................................16 IMGENES ........................................................................18 Estructuras de etiquetas para imgenes...........................19 Atributos..........................................................................19 Formatos a la Imagen......................................................19 Procedimiento Tcnico para la Insercin de imgenes....20 CARACTERES ESPECIALES...........................................22 FORMULARIOS DE CONFIRMACIN Y ENVO.........25 MARQUESINAS................................................................27 Estructuras.......................................................................27 Formatos .........................................................................27 CONTADORES..................................................................29 Cmo Funcionan los Contadores.....................................29 Servicios Pblicos para Contadores................................29 PUBLICACIN DE PGINA WEB..................................31 Seleccin de Proveedor ..................................................31 Publicacin de Pginas....................................................31 ENLACE.............................................................................39

Estructuras de un Enlace..................................................39 TIPOS DE ENLACES.........................................................39 Enlaces de Pgina con Marco..........................................43 Atributos de las Etiquetas (Frameset)..............................43 JAVA SCRIPT....................................................................44 Acceso de un Java Script en el cuerpo de la pgina o a travs de etiquetas............................................................45 Estructuracin de Applets en java script.........................46 REFERENCIAS BIBLIOGRFICAS...............................46

INTRODUCCIN
El Cuaderno de Estudio PROGRAMACIN EN HTML Y JAVA SCRIPT tiene como finalidad que el sujeto de aprendizaje adquiera los conocimientos, necesarios para el desempeo eficiente en este tipo de programacin; teniendo como fin el establecer e

implementar mtodos de trabajo, que faciliten al sujeto su desarrollo en el campo laboral. HTML (HyperText Markup Language) es un lenguaje muy sencillo que permite describir hipertexto, es decir, texto presentado de forma estructurada y agradable, con enlaces (hyperlinks) que conducen a otros documentos o fuentes de informacin

cliente servidor dentro del mbito de Internet. Los programas Java Script, van instalados en el cliente, como puede ser pedir a los datos, documentos HTML y se encargan de realizar acciones confirmaciones, mostrar mensajes, crear animaciones, comprobar campos. Es importante resaltar que el contenido presentado, se ajusta al programa de formacin diseado segn los requerimientos de la Salida Ocupacional, en donde los temas o puntos especficos presentan ilustraciones y que permitirn facilitar referencias bibliogrficas, el aprendizaje. Seria

relacionadas, y con inserciones multimedia (grficos, sonido). La descripcin se basa en especificar en el texto la estructura lgica del contenido (ttulos, prrafos de texto normal, enumeraciones, definiciones, citas), as como los diferentes efectos que se quieren dar (especificar los lugares del documento donde se debe poner cursiva, negrita, o un grfico determinado) y dejar que luego la presentacin final de dicho hipertexto se realice por un programa especializado (como Mosaic, o Netscape). Buscando precisamente la interactividad con el servidor (quien aloja las pginas), es as como nace Java Script como una solucin intermedia, diseado especficamente para el desarrollo e aplicaciones

conveniente que investigue y comparta experiencias con sus compaeros y en otras fuentes de estudio, a fin de consolidar y enriquecer los conocimientos adquiridos.

ENCABEZADO DE LA PGINA
Dentro del encabezamiento hay informacin del documento, que no se ve en la pantalla principal del BROWSER que es utilizado para visualizar el documento HTML, principalmente la informacin encontrada en el encabezamiento es el ttulo del documento, comprendido entre las etiquetas <TITLE> y </TITLE>.

Por ejemplo: <html> <head> <title> Curso de HTML </title> </head> ... </html>

Descripcin de Servidores S una pgina trata sobre Internet, sus palabras claves

Ttulo de la Pgina El ttulo de la pgina es el que aparecer en la parte superior de la ventana del navegador, cuando la pgina est cargada en l. Para asignar un ttulo a una pgina es necesario escribir el texto deseado entre las etiquetas <title> y </title>. Estas etiquetas han de estar dentro de la cabecera, es decir, entre las etiquetas <head> y </head>.

pueden ser internet, computador, computadores, red, net, conexin, etc., y cuando alguien se inscribe a la pgina para que los buscadores la reconozcan, toman estas palabras como las palabras clave. Por ejemplo, si inscribimos nuestra pgina a Altavista las <http://www.altavista.digital.com/>, revisar

palabras claves, que estn dentro de las etiquetas <HEAD> y </HEAD> con la siguiente lnea: <META HTTP-EQUIV="keywords" CONTENT="internet, computador, computadores, red, net, conexin">

Programamacin en HTML y Java Script

Los buscadores son el medio por el cual una persona busca informacin a su gusto y el buscador encuentra pginas por categoras o por diversos otros criterios. Estos buscadores contienen enlaces al web en cualquier tema, por lo que si se necesita saber sobre algo, lo encuentra.

Programacin en HTML y Java Script

correspondiente de cierre). Con ella se obtiene una

ESTRUCTURA DEL CUERPO DE LA PGINA

Uso de Instrucciones Generales para Prrafos y Textos Antes de crear una pgina, se deben tomar algunas consideraciones sobre el texto: Cuando se escribe en el documento el texto que se quiere que aparezca en la pantalla, se observa como ste se acomoda a ella, sin que se tenga que pulsar el retorno del carro. Si se desea separar el texto en distintos prrafos se debe usar la etiqueta <P>, (que no tiene su correspondiente etiqueta de cierre </P>) El texto puede tener unas cabeceras, comprendidas entre las etiquetas <H1> y </H1>, <H2> y </H2>, etc. (hasta el nmero 6), siendo el nmero indicativo del tamao.

raya horizontal tan ancha como la pantalla, y con la apariencia de estar embutida sobre el fondo, como se puede observar a continuacin: Ejemplo prctico: En el procesador de texto copiamos lo siguiente: <HTML> <HEAD> <TITLE> Mi pgina del Web - 1 </TITLE> </HEAD> <BODY> <H1> <CENTER> Primera pagina </CENTER> </H1> <HR> <P> Aqu va un segundo prrafo. </BODY> </HTML>

Estructuras del Cuerpo de la Pgina El tamao mayor es el correspondiente al nmero 1. Tambin estn los separadores (horizontal rules), que se consiguen con la etiqueta <HR> (no existe la
Programamacin en HTML y Java Script 5

Dentro del cuerpo est todo lo que queremos que aparezca en la pantalla principal (texto, imgenes).

La estructura de un documento HTML queda de esta manera: <HTML> <HEAD> <TITLE> Ttulo de la pgina </TITLE> </HEAD> <BODY> [Aqu van las etiquetas que visualizan la pgina] </BODY> </HTML> Diagramacin Previa de la Pgina El principio esencial del lenguaje HTML (HyperText Markup Language) es el uso de las etiquetas (tags). Funcionan de la siguiente manera: <XXX> Este es el inicio de una etiqueta. </XXX> Este es el cierre de una etiqueta. Las letras de la etiqueta pueden estar en maysculas o minsculas, indiferentemente. Por claridad, se usarn en este manual solamente las maysculas. Lo que haya entre ambas etiquetas estar influenciada por ellas. Por ejemplo, todo el documento HTML debe estar entre las etiquetas <HTML> y </HTML>: <HTML> [Todo el documento] </HTML>
6

El documento en s est dividido en dos zonas principales: El encabezamiento, comprendido entre las etiquetas <HEAD> y </HEAD> El cuerpo, comprendido entre las etiquetas <BODY> y </BODY> Dentro del encabezamiento hay informacin del documento, que no se ve en la pantalla principal, principalmente el ttulo del documento, comprendido entre las etiquetas <TITLE> y </TITLE>. El ttulo debe ser breve y descriptivo de su contenido, pues ser lo que vean los dems cuando aadan nuestra pgina a su bookmark (o agenda de direcciones).

Programacin en HTML y Java Script

FUENTES
Es un conjunto de signos, observando todos ellos el mismo motivo bsico de acuerdo al diseo, tamao, apariencia y otros atributos asociados a todo el conjunto, y una asignacin de signos abstractos por cada carcter.

Pero al confeccionar una pgina del Web, su autor puede forzar a que el texto adopte un determinado tipo de fuente, distinto del que tiene configurado el usuario. Pero, para que esto ocurra, el usuario debe tener instalado en su disco duro ese tipo de fuentes (y adems con el mismo nombre). Si no lo tiene instalado, entonces ver el texto con la fuente por defecto de su navegador. Esto se consigue con el atributo FACE="Nombre de la fuente". Por ejemplo, para forzar a que el texto adopte la fuente Verdana, se pondra: <FONT FACE="Verdana">Este texto se ver con la fuente Verdana</FONT> Que resulta: Este texto se ver con la fuente Verdana (quien no tenga instalada esta fuente, no notar nada de particular). Se pueden indicar en el atributo varias fuentes distintas, separadas por una coma. Si falla la primera, entonces el texto adopta la forma de la segunda, y as

Puede usar la etiqueta <FONT> para mejorar an ms el aspecto del texto. Por ejemplo, puede definir el tipo de fuente, tamao y color, todo ello con la etiqueta FONT. <FONT> [Atributos de fuente] </FONT> Tipos de fuentes Los navegadores utilizan por defecto un tipo de fuentes, generalmente Times New Roman, y que el usuario puede cambiar por otro tipo en la configuracin de su navegador. Si as lo hace, todas las pginas que cargue tendrn el texto escrito en esa nueva fuente escogida.

Programamacin en HTML y Java Script

sucesivamente. Si fallan todas, el texto adopta entonces la fuente por defecto. As, por ejemplo: <FONT FACE="Impact, Arial">Este texto se ver con la fuente Impact, o en su defecto con Arial</FONT> Que resulta: Este texto se ver con la fuente Impact, o en su defecto con Arial (quien no tenga instaladas ninguna de las dos fuentes, tampoco notar nada de particular). Es decir, que este atributo no es estndar y que depende adems de las fuentes instaladas en el ordenador del usuario, no es conveniente basar el diseo de una pgina exclusivamente en un tipo de fuente. Hay que tener en cuenta que el tamao de las letras vara mucho de una fuente a otra. Estructuras para la Personalizacin de las Fuentes Para personalizar las fuentes es necesario tener claro que las propiedades del texto pueden modificarse a travs de la etiqueta <font>. Para ello, podemos insertar el texto entre las etiquetas <font> y </font>, especificando algunos de los atributos de la etiqueta:
8

Atributo face color

Significado fuente color del texto

Posibles valores nombre de la fuente, o fuentes nmero hexadecimal o texto predefinido valores del 1 al 7, siendo por defecto el 3, o desplazamiento respecto al tamao por defecto, aadiendo + o - delante del valor

size

tamao del texto

Por ejemplo, para insertar el texto:

Bienvenidos a www.aulaclic.com Habra que escribir: <font color="#993366" size="4" face="Comic Sans MS, Arial, MS Sans Serif">Bienvenidos a www.aulaclic.com</font> Tambin es posible definir una fuente para todo el documento. Para ello, hay que insertar la etiqueta <basefont> despus de la etiqueta <body>. La etiqueta <basefont> no necesita una etiqueta de cierre, y permite modificar los mismos atributos del texto que la etiqueta <font>.

Programacin en HTML y Java Script

Por ejemplo: <body> <basefont color="#006699" size="4" face="Arial"> ... Este cdigo hara que la fuente del documento fuera por defecto de color azul, de tamao 4 y Arial.

Etiqueta <b> <i> <u> <s> <tt> <big> <small>

Significado negrita cursiva subrayado tachado teletipo (mquina de escribir) aumenta el tamao de la fuente disminuye el tamao de la fuente

Si despus de indicar la etiqueta <basefont> o

<font>, el navegador encuentra otra etiqueta <font>, la que prevalece es siempre la ltima que se encuentra. Existen una serie de etiquetas que permiten aplicar diferentes estilos al texto que se encuentra entre ellas, y generalmente se utilizan para resaltarlo. Estos estilos pueden agruparse segn vayan asociados al tipo de letra o a la informacin que represente el texto. No hay que olvidar que todas estas etiquetas necesitan una etiqueta de cierre, y que pueden aplicarse varias etiquetas al mismo texto. A continuacin se muestran algunas etiquetas asociadas al tipo de letra:

A continuacin se muestran algunas etiquetas asociadas al tipo de informacin: Etiqueta <cite> <code> <dfn> <del> <em> <ins> <kbd> <samp> <strong> Significado cita ejemplo de cdigo definicin eliminado nfasis insertado teclado muestra destacado
9

Programamacin en HTML y Java Script

<sub> <sup> <var>

subndice superndice variable

Las etiquetas ms utilizadas son las asociadas al tipo de letra, ya que son ms fciles de recordar, y en muchos casos los resultados son los mismos que los de aplicar una etiqueta diferente. Por ejemplo, el resultado de aplicar las etiquetas <b> y <strong> es el mismo. Incluso a veces algunos estilos asociados al tipo de informacin pueden representarse de forma distinta segn el navegador.

Por ejemplo, para insertar el texto: Bienvenidos a www.aulaclic.com Habra que escribir: <font color="#993366" size="4" face="Comic Sans MS, Arial, MS Sans Serif">Bienvenidos a <b><u><tt>www.aulaclic.com</tt></u></b></font>

FONDOS
Es donde se realiza el diseo que va identificar la pgina o documento. Tipos de Fondos Se puede presentar el fondo de dos maneras distintas: Uniformes

10

Programacin en HTML y Java Script

Se consigue aadiendo el comando BGCOLOR a la etiqueta <BODY> (situada al principio del documento), de la siguiente manera: <BODY BGCOLOR="#XXYYZZ">

#0000FF

Azul

Otros colores son: #FFFFFF #000000 #FFFF00 Blanco Negro Amarillo

XX YY ZZ

Es un nmero indicativo de la cantidad de color rojo Es un nmero indicativo de la cantidad de color verde Es un nmero indicativo de la cantidad de color azul

Para hacer un color ms oscuro, se debe reducir el nmero de su componente, dejando los otros dos invariables. As, el rojo #FF0000 se puede hacer ms oscuro con #AA0000, o an ms oscuro con #550000. Para hacer que un color tenga un tono ms suave (ms pastel), se deben variar los otros dos colores hacindolos ms claros (nmero ms alto), en una cantidad igual. As, se convierte el rojo en rosa con #FF7070. Veamos algunos ejemplos
Valores FF0000 FFFF00 25A7BB Color resultante Valores 00FF00 FF00FF ACB312 Color resultante Valores 0000FF 00FFFF 6047B6 Color resultante

Estos nmeros estn en numeracin hexadecimal. Esta numeracin se caracteriza por tener 16 dgitos (en lugar de los diez de la numeracin decimal habitual). Estos dgitos son: 0123456789ABCDEF Es decir, que en este caso, el nmero menor es el 00 y el mayor el FF. As, por ejemplo, el color rojo es el #FF0000, porque tiene el mximo de rojo y cero de los otro dos colores. Los colores primarios son: #FF0000 #00FF00 Rojo Verde

Con Imgenes
11

Programamacin en HTML y Java Script

texto y los enlaces que no contrastan bien con ese El fondo de una pgina puede ser tambin una imagen, ya sea en formato GIF o JPEG. Esta imagen se repite por toda la pgina, de una manera anloga al tapiz de Windows. La estructura de la etiqueta puede ser: <BODY BACKGROUND="imagen.gif"> <BODY BACKGROUND="imagen.jpg"> No todos los navegadores soportan este formato. Se pueden aadir tambin a esta etiqueta todos los comandos para cambiar los colores del texto y de los enlaces, vistos anteriormente. Esto es imprescindible a veces para conseguir que el texto sea legible, en contraste con el fondo. Hay que prever la posibilidad de que quien acceda a la pgina haya deshabilitado la carga automtica de imgenes, en cuyo caso tampoco cargara la imagen que sirve como fondo y slo vera el fondo estndar de color gris. Esto podra ser muy perjudicial si hemos escogido unos colores para el
12 Programacin en HTML y Java Script

fondo gris. La solucin a este problema es poner dentro de la etiqueta <BODY> los dos comandos BACKGROUND y BGCOLOR (en este orden), teniendo cuidado en escoger un color uniforme de fondo parecido al de la imagen. Por ejemplo, se quiere poner como fondo la imagen nubes.jpg. Entonces se escoge un color de fondo azul claro, quedara as: <BODY BACKGROUND="nubes.jpg" BGCOLOR="#CCFFFF"> Esto tiene la ventaja adicional de que, incluso aunque no se deshabilite la carga automtica de imgenes, al cargar la pgina, lo primero que se ve es ese fondo de color uniforme, que luego es reemplazado por el de la imagen. #CCFFFF. La etiqueta

La etiqueta <TABLE> puede ser una poderosa herramienta de formato. Se puede hacer por ejemplo, no mostrar el borde de una tabla en absoluto. Tambin se puede hacer uso de la etiqueta <TABLE> para ubicar texto e imgenes con precisin, en prcticamente casi cualquier lugar de una pgina. Asimismo, estn formadas por celdas, que son los recuadros que se obtienen como resultado de la interseccin entre una fila y una columna.

TABLAS
Son uno de los recursos ms utilizados en HTML, ya que su uso a la hora de tabular y presentar contenido es fundamental. Asimismo es una poderosa herramienta, y no slo para mostrar infinidad de datos sino tambin para formatear los documentos. Las tablas pueden parecer un modo sencillo de disponer el texto en columnas o quizs de aadir un titular a una ilustracin, pero hay modos de sacar un gran partido de una caracterstica aparentemente sencilla. FILA
Programamacin en HTML y Java Script

Ejemplo:

imagen y texto Texto dentro de una celda

COLUMNA

CELDA
13

Para crear una tabla no basta con especificar el Para crear una tabla hay que insertar las etiquetas <table> y </table>. Entre dichas etiquetas habr que especificar las filas y columnas que formarn la tabla. DEFINICIN DE FILA <TR> Es necesario insertar las etiquetas <tr> y </tr> nmero de filas, es necesario tambin especificar el nmero de columnas. Una celda es el resultado de la interseccin entre una fila y una columna, por lo que podremos especificar el nmero de celdas por fila, que equivale a especificar el nmero de columnas por fila. Es necesario insertar las etiquetas <td> y </td> por cada una de las celdas que compongan cada una de las filas de la tabla. Por lo tanto, habr que insertar esas etiquetas entre las etiquetas <tr> y </tr>. Entre las etiquetas <td> y </td> se podr especificar el contenido de cada una de las celdas. Por ejemplo, para insertar la siguiente tabla: Sbado DEFINICIN DE COLUMNA O CELDA <TD> Curso HTML Domingo Curso Dreamweaver

por cada una de las filas de la tabla. Estas etiquetas debern insertarse entre las etiquetas <table> y </table>. Por ejemplo, para crear una tabla con cinco filas escribiramos: <table> <tr>...</tr> <tr>...</tr> <tr>...</tr> <tr>...</tr> <tr>...</tr> </table>

Curso Frontpage Curso Flash Habra que escribir:

14 Programacin en HTML y Java Script

table border="1"> <tr> <td>Sabado</td> <td>Domingo</td> </tr> <tr> <td>Curso HTML</td> <td>Curso Dreamweaver</td> </tr> <tr> <td>Curso Frontpage</td> <td>Curso Flash</td> </tr> </table> Alineacin Normalmente, el contenido de una celda est alineado a la izquierda. Pero se puede cambiar esto aadiendo dentro de la etiqueta de la celda los siguientes atributos: <TD ALIGN=CENTER> Al centro </TD> <TD ALIGN=RIGHT> A la derecha </TD> <TH ALIGN=LEFT> Cabecera a la izquierda </TH> El alineamiento por defecto en el sentido vertical es en el medio. Tambin se puede cambiar, aadiendo

dentro de la etiqueta de la celda los siguientes atributos: <TD VALIGN=TOP> Arriba </TD> <TD VALIGN=BOTTOM> Abajo </TD> Determinacin del Ancho El navegador se encarga normalmente de

dimensionar el tamao total de la tabla de acuerdo con el nmero de filas, de columnas, por el contenido de las celdas, espesor de los bordes, etc. A veces puede convenir forzarle para que la tabla tenga unas dimensiones totales mayores que las que le corresponden, tanto en anchura como en longitud. Esto se consigue aadiendo dentro de la etiqueta de la tabla los atributos WIDTH y HEIGHT igual a un porcentaje de la dimensin de la pantalla, o a una cifra que equivale al nmero de pixels. Por ejemplo, se coloca: <TABLE WIDTH=60%> O, por ejemplo: <TABLE HEIGHT=200> Espaciado entre Celdas
15

Programamacin en HTML y Java Script

Por defecto, la separacin entre las distintas celdas de una tabla es de dos pixels. Pero se puede variar esto con el atributo CELLSPACING, que se pone dentro de la etiqueta TABLE. Por ejemplo, para obtener una separacin de 20 pixels entre celdas: <TABLE BORDER CELLSPACING=20> A primera vista parece como si esto fuera lo mismo que si se hubiera aumentado el espesor de los bordes. Pero para comprobar que no es as, se hace que, tenga adems unos bordes de 5 de espesor: <TABLE BORDER=5 CELLSPACING=20>

especifica el nmero de filas por las que se extender la celda. Para que quede ms claro, vamos a ver un ejemplo de su uso. Por ejemplo, para insertar la siguiente tabla:

DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE DIFERENCIAS Duracin crecimiento Tiempo de gestacin Duracin de vida del pelo/cabello PERRO PEQUEO GRANDE 10 meses 18 a 24 meses HOMBRE 16 aos 9 meses 2 a 7 aos

Combinacin
Para las etiquetas <td> y <th> existen los atributos colspan y rowspan, que se utilizan para combinar celdas. A travs del atributo colspan se especifica el nmero de columnas por las que se extender la celda, y a travs del atributo rowspan se
16

58 a 63 das 1 ao

Habra que escribir el siguiente cdigo:

<table width="575" border="2" cellspacing="2"> <tr align="center" valign="middle"> <th colspan="4">DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE</th>

Programacin en HTML y Java Script

</tr> <tr align="center" valign="middle"> <th rowspan="2">DIFERENCIAS</th> <th colspan="2">PERRO</th> <th rowspan="2">HOMBRE</th> </tr> <tr align="center" valign="middle"> <th>PEQUE&Ntilde;O</th> <th>GRANDE</th> </tr> <tr align="center" valign="middle"> <td>Duraci&oacute;n crecimiento</td> <td>10 meses</td> <td>18 a 24 meses</td> <td>16 a&ntilde;os</td> </tr> <tr align="center" valign="middle"> <td>Tiempo de gestaci&oacute;n</td> <td colspan="2">58 a 63 d&iacute;as</td> <td>9 meses</td> </tr> <tr align="center" valign="middle"> <td>Duraci&oacute;n de vida del pelo/cabello</td> <td colspan="2">1 a&ntilde;o</td> <td>2 a 7 a&ntilde;os</td> </tr> </table> Vamos a explicar un poco cmo funciona dicho cdigo, aunque sera conveniente que primero intentaras entender el cdigo comparndolo con la tabla que de l se obtiene.

En primer lugar, tenemos que ver el nmero mximo de columnas que ha de tener la tabla. En este caso seran cuatro columnas. Para saber el nmero de columnas total de la tabla, tenemos que fijarnos en el nmero total de celdas que podemos obtener por fila al trazar las lneas verticales que separan las columnas entre s. En la primera fila, la lnea ENTRE <th EL

colspan="4">DIFERENCIAS

PERRO Y EL HOMBRE</th> indica que la celda ocupar cuatro columnas de la tabla (la columna actual y las 3 siguientes). Como la tabla tiene como mucho cuatro columnas y el atributo colspan de la celda vale cuatro, no hay que definir ms celdas para esa misma fila. En la segunda fila, la lnea <th

rowspan="2">DIFERENCIAS</th> indica que la celda ocupar dos filas de la tabla (la actual y la siguiente). Lo mismo ocurre con la lnea <th rowspan="2">HOMBRE</th>. Ya hemos definido dos celdas de la segunda fila. Sabemos que la tabla tiene como mucho

Programamacin en HTML y Java Script

17

cuatro columnas, por lo que como en la lnea <th colspan="2">PERRO</th> el atributo colspan vale dos, ya tenemos las cuatro celdas. En la segunda fila hemos definido dos celdas que se expanden por dos filas, por lo que en la tercera fila habr que definir solamente dos celdas, y no cuatro, ya que dos de sus celdas se corresponden con las definidas en la fila anterior. Las dos nuevas celdas son: <th>PEQUE&Ntilde;O</th> y <th>GRANDE</th>. El uso de los atributos colspan y rowspan puede resultar algo complicado al principio. Es cuestin de prctica. A la hora de crear una pgina Web podemos introducir grficos de forma muy sencilla, slo hay que tener en cuenta que las imgenes deben tener formato Gif o JPEG. La etiqueta que sirve para incluir imgenes en pginas del WEB es muy similar a la de enlaces a otras pginas, antes vistas. La nica diferencia es que, en lugar de indicar al programa navegador el nombre y la localizacin de un documento de texto HTML para que lo cargue, se le indica el nombre y la localizacin de un archivo que contiene una imagen.

IMGENES

18

Programacin en HTML y Java Script

Estructuras de etiquetas para imgenes

La estructura de la etiqueta es: <IMG SRC="imagen.gif"> Con el comando IMG SRC (image source, fuente de la imagen) se indica que se quiere cargar una imagen llamada imagen.gif. (O el nombre que tenga). Dentro de la etiqueta se pueden aadir otros comandos, tal como ALT <IMG SRC="imagen.gif" ALT="descripcin"> Con el comando ALT se introduce una descripcin (una palabra o una frase breve) indicativa de la imagen. Este comando, que en principio se puede omitir, es en beneficio de los que accedan a nuestra pgina con un programa navegador en forma de texto como el lynx. Ya que no son capaces de ver la imagen, por lo menos pueden hacerse una idea sobre ella.

Atributo ALT: Es un texto asociado a la imagen muy conveniente para los que utilizan navegadores en forma texto (Lynx, entre otros), o para los que usando navegadores grficos, han inhabilitado la carga de imgenes para ganar en velocidad. Atributos WIDTH y HEIGHT: Es una indicacin de las dimensiones de la imagen (ancho y alto). Es muy importante ponerlo en todas las etiquetas de las imgenes (incluso de las ms pequeas, iconos), pues facilita mucho la carga de la pgina, ya que primero se carga todo el texto y posteriormente se van rellenando los espacios reservados a las imgenes. Con respecto a los GIFs animados, conviene no abusar de ellos poniendo demasiados en una misma pgina, no solamente por motivos estticos, sino tambin porque esto puede provocar problemas en los ordenadores de algunos usuarios. Formatos a la Imagen

Atributos
Se deben incluir dentro de las etiquetas de las imgenes estos atributos, que aunque son opcionales son muy convenientes:

Programamacin en HTML y Java Script

19

Las imgenes deben estar guardadas en un formato de archivo especial llamado GIF. (Hay tambin otro formato ms avanzado JPG). Este formato GIF almacena las imgenes con un mximo de 256 colores, en forma comprimida. Un aspecto muy importante a tener en cuenta es el tamao de las imgenes, pues una imagen grande supone un archivo grande, y esto puede resultar en un tiempo excesivo de carga, con el consiguiente riesgo de que quien est intentando cargar nuestra pgina se canse de esperar, y desista de ello. Procedimiento Tcnico para la Insercin de imgenes Al insertar una imagen en un documento de Dreamweaver, el programa genera automticamente una referencia al archivo de imagen en el cdigo HTML. Para asegurarse de que esta referencia es correcta, el archivo de imagen deber estar en el sitio actual. Si no lo est, Dreamweaver le preguntar si desea copiar el archivo en el sitio. Asimismo, las imgenes se pueden insertar de forma dinmica. Las imgenes dinmicas son aquellas que cambian con
20

frecuencia. Por ejemplo, en los sistemas de rotacin de rtulos publicitarios es necesario seleccionar de forma aleatoria un nico rtulo de una lista de posibles rtulos y, despus, mostrar dinmicamente la imagen del rtulo seleccionado cuando se solicite una pgina. Para insertar una imagen 1. Coloque el punto de insercin en el lugar de la ventana de documento en el que desea que aparezca la imagen y, a continuacin, siga uno de estos procedimientos:
o

En la categora Comn de la barra haga clic en el icono Imagen.

Insertar,

En la categora Comn de la barra

Insertar, arrastre el icono Imagen a la ventana de documento (o a la ventana de vista Cdigo si est trabajando en el cdigo).
o o

Seleccione Insertar > imagen. Arrastre una imagen desde el panel Activos (Ventana > Activos) hasta la posicin

Programacin en HTML y Java Script

deseada de la ventana de documento. A continuacin, siga con el paso 3.

o

lugar del sitio, Dreamweaver convierte la referencia en una ruta relativa al documento. 4. Haga clic en Aceptar. Aparece el cuadro Atributos de accesibilidad de la etiqueta de imagen si se ha activado el cuadro de dilogo en Preferencias (vase Optimizacin del espacio de trabajo para el diseo de pginas accesibles).

Arrastre una imagen desde el panel Sitio hasta la posicin deseada de la ventana de documento. A continuacin, siga con el paso 3. Arrastre una imagen desde el escritorio hasta la posicin deseada de la ventana de documento. A continuacin, siga con el paso 3.

2. En el cuadro de dilogo que aparece, siga uno de estos procedimientos:

o

Seleccione Sistema de archivos para elegir un archivo grfico. Seleccione Fuente de datos para elegir un origen de imagen dinmica.

3. Busque y seleccione el origen de imagen o contenido que desee insertar. Si est trabajando en un documento que no est guardado, Dreamweaver genera una referencia de archivo: // para el archivo de imagen. Al guardar el documento en cualquier 5. Introduzca los valores en los cuadros de texto alternativo y Descripcin larga y haga clic en Aceptar.
21

Programamacin en HTML y Java Script

6. Para ms informacin, consulte Configuracin de las opciones del cuadro de dilogo Atributos de accesibilidad de la etiqueta de imagen. 7. La imagen aparece en el documento. 8. En el inspector de propiedades (Ventana > Propiedades), establezca las propiedades de la imagen. Para ms informacin, consulte Configuracin de propiedades de imagen. Para editar los atributos de accesibilidad de la imagen, vase Edicin de los atributos de accesibilidad de una imagen.

CARACTERES ESPECIALES
Existen algunas limitaciones para escribir el texto. Una de ellas es debido a que las etiquetas, se forman como un comando escrito entre los smbolos "<" y ">". Por tanto, si se quisieran escribir estos caracteres como parte normal del texto, dara esto lugar a una ambigedad, ya que el programa navegador podra

22

Programacin en HTML y Java Script

interpretarlos como el comienzo o final de una etiqueta, en vez de un carcter ms del texto. Para resolver este problema, existen unos cdigos para poder escribir estos caracteres y otros relacionados con las etiquetas. &lt; &gt; &amp; &quot; para < (less than, menor que) para > (greater than, mayor que) para & (ampersand) para " (double quotation)

&aacute; &eacute; &iacute; &oacute; &uacute; &Aacute; &Eacute; &Iacute; &Oacute; &Uacute;

Para la Para la Para la Para la Para la Para la Para la Para la Para la Para la

Como se ve, estos cdigos empiezan siempre con el signo & y acaban siempre con ; De una manera similar, existen cdigos para escribir letras especficas de distintos idiomas. Hay muchos de ellos, pero, lgicamente, los que ms nos interesan son los propios del castellano (las vocales acentuadas, la y los signos y ). Los cdigos de las vocales acentuadas se forman comenzando con &, seguido de la vocal en cuestin, seguido de la palabra acute (aguda) y terminando con el signo ;. &ntilde; &Ntilde; &uuml; &Uuml; &#191; &#161; Para la Para la Para la Para la Para Para El resto de los cdigos son:

Todo esto, que como se ve es muy laborioso, puede parecer intil ya que si se escribe el texto sin hacer ningn caso de estas convenciones, escribiendo las letras acentuadas y dems signos directamente, es muy posible que el resultado se vea correctamente en

Programamacin en HTML y Java Script

23

dicho navegador, pero nunca se puede estar seguro que le ocurra lo mismo a todos los que accedan a estas pginas con navegadores distintos. Por ejemplo, para insertar el texto: Bienvenidos, esta es mi 1 pgina! Habra que escribir: &iexcl;Bienvenidos, esta es mi&nbsp;&nbsp;&nbsp;1&ordf;&nbsp;&nbsp;&nb sp;p&aacute;gina!

24

Programacin en HTML y Java Script

FORMULARIOS DE CONFIRMACIN Y ENVO

Es un elemento que permite recoger datos

Ejemplo:

introducidos por el usuario. Los formularios se utilizan para conocer las opiniones, dudas, y otra serie de datos sobre los usuarios, para introducir pedidos a travs de la red, tienen multitud de aplicaciones. Un formulario est formado, entre otras cosas, por etiquetas, campos de texto, mens desplegables, y botones. Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando tablas se consigue una mejor distribucin de los elementos del formulario, lo que facilita su comprensin y mejora su apariencia.

Programamacin en HTML y Java Script

25

MARQUESINAS
Una marquesina (en ingls, marquee) es una ventana en la que se desplaza un texto. Slo son vlidas para el Explorer de Microsoft (en el Netscape se ver como texto fijo).

Que resulta como: Esta marquesina ocupa el 50% del ancho de la pantalla y tiene una altura de 60 pixels ALIGN Modifica el alineamiento del texto que rodea a la marquesina, que puede ser TOP (arriba), MIDDLE (en medio) o BOTTOM (abajo). Ejemplo: <MARQUEE WIDTH=50% HEIGHT=60 ALIGN=BOTTOM>La palabra "Hola!" estar alineada con la parte inferior de la marquesina</MARQUEE> Hola! Que resulta como: La palabra "Hola!" estar alineada con la parte inferior de la marquesina Hola!

Estructuras
La etiqueta bsica es: <MARQUEE> Texto que se desplaza </MARQUEE> Que resulta como: Texto que se desplaza

Formatos
WIDHT, HEIGHT Ajustan la anchura y altura, respectivamente, de la marquesina. Pueden ser igual a un nmero de pixels, o a un porcentaje de la pantalla. Ejemplo: <MARQUEE WIDTH=50% HEIGHT=60> Esta

marquesina ocupa el 50% del ancho de la pantalla y tiene una altura de 60 pixels </MARQUEE>
Programamacin en HTML y Java Script 27

CONTADORES
Un contador de visitas no se crea simplemente con una etiqueta del lenguaje HTML, sino que se genera en un programa CGI especial residente en el servidor. Puede tratarse del servidor donde est alojada nuestra pgina si es que tiene instalado un programa de este tipo, o en caso contrario se puede recurrir a otros servidores distintos que den este servicio. Cmo Funcionan los Contadores Si se quiere instalar en la pgina un contador de accesos, se debe colocar en el documento HTML una etiqueta que haga una llamada a un programa instalado en un servidor que suministre este servicio. Estas etiquetas no son un standard del lenguaje HTML, sino que nos la tiene que suministrar quien nos d el servicio, ya que depende del programa que tengan instalado en el servidor. Por ejemplo, la etiqueta para el contador de WebMaestro (instalado en la pgina de la portada de este manual) es la siguiente:

<IMG SRC="http://www.lander.es/cgi/nph-count? link=farocena&width=5"> Servicios Pblicos para Contadores Cuando se carece de un programa de contador, se puede recurrir a otros servidores que dan este servicio de manera generalmente gratuita. El nico inconveniente que puede tener esta solucin es que al cargar el usuario la pgina, al llegar a la etiqueta del contador, la solicitar a este otro servidor, y puede ocurrir que est inaccesible en ese momento, o sea lento en dar la respuesta. A continuacin se sumistra los URLs de algunos de estos servidores. En ellos se pueden encontrar las instrucciones para crear un contador. Servicio de contadores, de Pedro Hurtado (Espaa) Contador de Pginas WWW (Portugal, en portugus) WebCounter (USA). En La Agenda, de Manuel Barbern se puede encontrar ms servidores. En el buscador Yahoo! Se puede encontrar informacin (en ingls) sobre programas para crear contadores.
Programamacin en HTML y Java Script 29

PUBLICACIN DE PGINA WEB Seleccin de Proveedor

Los proveedores comerciales de acceso a Internet, o ISPs (Internet Service a sus Providers) usuarios que un ceden espacio

decir, un ordenador conectado permanentemente con Internet y dotado de un programa especfico, lo que supone una gran inversin econmica y unos elevados conocimientos tcnicos. La solucin es instalarla en un servidor conectado a la WWW (World Wide Web: la telaraa mundial), la red de servidores interconectados entre s que permite acceder a cualquier pgina en cualquier parte del mundo, y navegar a travs de ellas. Los distintos canales para colocar una pgina en la red son: Los servidores de las instituciones oficiales y acadmicas a sus miembros, para la difusin de informacin relacionada con esos organismos.

frecuentemente

determinado en sus servidores, para que puedan

colocar sus pginas personales, bien sea gratuitamente o por una tarifa determinada. Las empresas comerciales que, sin ser proveedores de acceso a Internet, se dedican a alquilar espacio para la colocacin de pginas, de carcter personal o comercial.

Publicacin de Pginas
El propsito que se tiene al confeccionar una pgina del Web es, por supuesto, el de publicarla y ponerla a disposicin de todo el mundo. No puede colocar directamente en la red, pues se necesitara disponer para esto de un servidor, es
Programamacin en HTML y Java Script 31

ENLACE
La caracterstica que ms ha influido en el

TIPOS DE ENLACES Dentro de una Misma Pgina

espectacular xito del WEB ha sido, aparte la de su carcter multimedia, la posibilidad de unir los distintos documentos repartidos por todo el mundo por medio de enlaces hipertexto.

A veces, en el caso de documentos (o pginas) muy extensos, nos puede interesar dar un salto desde una posicin a otra determinada. En este caso, lo que antes se ha llamado XXX, es decir, el destino del enlace, en este caso el sitio dentro de la pgina a donde se quiere saltar, se sustituye por #MARCA (la palabra MARCA puede ser cualquier palabra que se quiera). Lo que se ha llamado antes YYY es la palabra (o palabras) que aparecern en la pantalla en color (en forma de hipertexto). Su estructura es, entonces: <A HREF="#MARCA"> YYY </A> Y en el sitio exacto a donde queremos saltar, debemos poner la siguiente etiqueta: <A NAME="MARCA"> </A>

Estructuras de un Enlace
En general, los enlaces tienen la siguiente estructura: <A HREF="XXX"> YYY </A> Donde XXX es el destino del enlace (Obsrvese las comillas). YYY es el texto indicativo en la pantalla del enlace (con un color especial y generalmente subrayado)

Con otras Pginas

Puede ser que se tenga una sola pgina. Pero lo ms frecuente es que haya varias pginas, una inicial (o
Programamacin en HTML y Java Script 39

principal) y otras conectadas a ella, e incluso entre ellas mismas. Por ejemplo se quiere enlazar con la pgina creada, la cual se ha llamado mipag2.html. En este caso, simplemente se sustituye lo que se ha llamado XXX (el destino del enlace) por el nombre del archivo: <A HREF="mipag2.html"> Ejemplo de la segunda pgina </A> Si se quiere que vaya a un sitio concreto de otra pgina en vez de ir al principio de la pgina, adonde va por defecto, en ese sitio se tiene que colocar una marca (ver la Enlaces dentro de la misma pgina ), y completar el enlace con la referencia a esa marca. Se puede ver con el siguiente ejemplo: <A

Una observacin importante: Pudiera ocurrir que el sitio del WEB estuviera organizado con un directorio principal, y otros subdirectorios auxiliares. Si la pgina a la que se desea accesar est, por ejemplo en el subdirectorio misubdir, entonces en la etiqueta tendra que colocarse "misubdir/mipag2.html". Y a la inversa, si se quiere saltar desde una pgina a otra que est en un directorio anterior, en la etiqueta tendra que haber puesto "./mipag2.html". Esos dos puntos hacen que se dirija al directorio anterior. Obsrvese que se debe utilizar el smbolo / para indicar los subdirectorios, y no este otro \, que es propio nicamente de Windows. Si se desea evitar todas estas complicaciones, se puede tener todo junto en un nico directorio, pero esto tiene el inconveniente de que est todo ms desordenado, y sean ms difciles de hacer las futuras modificaciones.

NAME="MIMARCA"></A> es la marca que se coloca en la pgina, que deseamos accesar desde otra nuestra. Entonces la etiqueta tiene que ser: <A HREF="mipag2.html#MIMARCA"> En mi otra pagina </A>.

40

Programacin en HTML y Java Script

Con otras Direcciones Electrnicas

<A HREF= mailto: direccin de e-mail> Texto del enlace </A> Un ejemplo podra ser: <A HREF= mailto: tzambran@delfos.ucla.edu.ve> Tom Zambrano</A> Hay algunos navegadores que no subrayan el comentario de este tipo de enlace. Una manera recomendable y ms segura para conocer la direccin e-mail seria poner algo as como: Comentarios a Tom Zambrano en <A HREF="mailto: tzambran@delfos.ucla.edu.ve"> tzambran@delfos.ucla.edu.ve </A> Es decir, es conveniente, poner tambin en el texto del enlace la direccin de e-mail. Ejemplo: <HTML> <HEAD> <TITLE> Mi pagina del Web - 3 </TITLE> </HEAD> <BODY> <CENTER> <H1> Mis paginas favoritas </H1> </CENTER> <HR> Estas son mis pginas favoritas:
41

Si lo que se quiere es enlazar con una pgina que est fuera de nuestro sistema (es decir, que est en un servidor distinto al que soporta la pgina), es necesario conocer su direccin completa, o URL (Uniform Resource Locator). El URL podra ser, adems de la direccin de una pgina del WEB, una direccin de FTP, GOPHER, etc. Una vez conocida la direccin (o URL), lo colocamos en vez de lo que hemos llamado anteriormente XXX (el destino del enlace). Si se quiere enlazar por ejemplo con la pgina de Netscape (cuyo URL es: http://home.netscape.com/), la etiqueta sera: <A HREF="http://home.netscape.com/"> Pgina inicial de Netscape </A> Es muy importante pues los copiar estas las direcciones y las s

correctamente minsculas, distinguen).

(respetando

maysculas UNIX

servidores

En este caso, se sustituye lo que se ha llamado antes XXX (el destino del enlace) por mailto: seguido de la direccin de e-mail. La estructura de la etiqueta es:

Programamacin en HTML y Java Script

<P><A HREF="http://home.netscape.com"> Netscape </A> <BR> <A HREF="http://www.microsoft.com"> Microsoft </A> <BR> <A HREF="http://www.yahoo.com"> Yahoo! </A> </BODY> </HTML>

MARCOS (FRAMES)

42

Programacin en HTML y Java Script

Frames (en ingls, marcos o cuadros) es un procedimiento del lenguaje HTML para dividir la pantalla en diferentes zonas, o ventanas, que pueden actuar independientemente unas de otras, como si se trataran de pginas diferentes, pues incluso cada una de ellas pueden tener sus propias barras

TARGET="_top", con lo que al pulsar el enlace la nueva pgina se cargar a pantalla completa.

Atributos de las Etiquetas (Frameset) La etiqueta FRAMESET, es la que define la distribucin, el nmero y tamao de los frames. Tiene dos atributos: COLS (columnas) y ROWS (filas): <FRAMESET COLS=XX, YY, ZZ,"> <FRAMESET ROWS=XX, YY, ZZ,"> Define la distribucin de los frames en columnas o en filas, segn se use uno u otro atributo. Define el nmero de frames que habr, pues, por ejemplo: <FRAMESET COLS=XX, YY> <FRAMESET COLS=XX, YY, ZZ> (habr dos frames en columnas) (habr tres frames en columnas)

deslizaderas. Los navegadores que lo implementan son el Netscape 2.0, y el Explorer 2.0 en adelante. Enlaces de Pgina con Marco A veces encontramos pginas con frames que contienen enlaces a otros sitios del Web que al ser pulsados se cargan dentro del mismo frame. Esto resulta generalmente molesto para el usuario, pues la pgina cargada queda aprisionada dentro del reducido espacio del frame (agravado an ms si la pgina cargada contiene ella misma sus propios frames). Adems, el usuario puede tener la impresin de que el autor de la pgina pretende impedirle que se "escape" a otras pginas. La manera de evitar esto es poner, dentro de las etiquetas de los enlaces en cuestin, el atributo

Define el tamao de los frames, segn el valor que demos a XX, YY, ZZ.... Este valor se puede expresar en:
43

Programamacin en HTML y Java Script

Un porcentaje del ancho del pantalla (para las columnas), o del alto de la pantalla (para las filas). As, por ejemplo: <FRAMESET COLS="%20, %80"> (la columna de la izquierda ocupar el 20% del ancho de la pantalla, y la de la derecha el 80% restante)

los que vamos a ver a continuacin, para que se ajuste el total a la pantalla del usuario Un valor relativo que se consigue poniendo un asterisco (*), en vez de un nmero. Esto se interpreta como que ese frame debe tener el espacio restante. Por ejemplo: <FRAMESET ROWS="100,*,100"> (Habr tres filas, la

<FRAMESET ROWS="%10, %70, %20"> (la fila superior ocupar el 10% del alto de la pantalla, la del medio el 70%, y la inferior el 20%) Un nmero absoluto que representa el nmero de pixels que ocupar cada frame a lo ancho o a lo alto (segn sean filas o columnas). As, por ejemplo: <FRAMESET COLS="40, 600"> (la columna de la izquierda tendr 40 pixels de ancho y la de la derecha 600). Pero es peligroso utilizar slo valores absolutos, pues el tamao de la pantalla vara de un usuario a otro. Si se va a usar algn valor absoluto para un frame, es mejor mezclarlo con alguno relativo, como

superior y la inferior de una altura fija de 100 pixels, y la del medio obtendr el espacio restante).

JAVA SCRIPT
Es un lenguaje de programacin orientado a objetos que ha sido desarrollado por la compaa Sun

44

Programacin en HTML y Java Script

Microsystems, basndose en el lenguaje C++. Aunque es tambin un lenguaje de carcter general, su principal caracterstica es la de ser independiente de cualquier plataforma, lo que le hace ser muy adecuado para ser utilizado en Internet, ya que puede ejecutarse en cualquier ordenador que tenga un navegador compatible con Java. Pero en este caso concreto, falta aadir los parmetros que personalizan el applet a gusto del usuario (sobre todo el texto que se quiere que aparezca). Para ello se aaden etiquetas de este tipo: <PARAM NAME=nombre_del_parmetro VALUE="contenido_del_parmetro"> Para escoger el texto, ser, por ejemplo:

Acceso de un Java Script en el cuerpo de la pgina o a travs de etiquetas

Para colocar el applet en la pgina, se debe utilizar las siguientes etiquetas (que se colocan donde queramos dentro del cuerpo del documento HTML, es decir entre las etiquetas <BODY> y </BODY>): <APPLET CODE=SineText.class WIDTH=500 HEIGHT=100> </APPLET> Con esto se le indica al navegador que cargue un applet, cuyo cdigo compilado es SineText.class, que se encuentra en el mismo directorio que el propio documento HTML, y 500x100 pixels. que le reserve un rea de

<PARAM NAME=Text VALUE="Gracias por tu visita!"> De momento no se va a definir ms parmetros. El resto de ellos sern los que ha escogido su autor por defecto. Las etiquetas del applet quedan de momento as: <APPLET CODE=SineText.class WIDTH=500 HEIGHT=100> <PARAM NAME=Text VALUE="Gracias por tu visita!"> </APPLET>

Programamacin en HTML y Java Script

45

Estructuracin de Applets en java script Con los applets se pueden conseguir efectos visuales y sonoros (incluso ambos a la vez), textos en movimiento, utilidades (por ejemplos: relojes), pequeos programas educativos, juegos interactivos, presentaciones multimedia, entre otros. Lo primero de todo, es necesario tener el programa del applet. El ejemplo de applet visto anteriormente, y que vamos a examinar a continuacin con detalle, se llama SineText.class. Se trata de un applet que hace que un texto (elegido por el usuario) se desplace formando una onda sinusoidal, en direccin reversible con un click del ratn. Se pueden escoger los colores del fondo y de las letras, elegir entre algunos tipos de fuentes, su tamao, velocidad de desplazamiento. Arocena, F (2006), Manual Html, Documentos en lnea http://www.ldc.usb.ve/~vtheok/webmaestro/
46 Programacin en HTML y Java Script

REFERENCIAS BIBLIOGRFICAS

[Consulta: 2006, Septiembre 20] Curso de Html, Documentos en lnea http://www.aulaclic.es/html/f_html.htm [Consulta: 2006, Septiembre 29] Lora, V (2006), Un sitio en Internet La Web, Documentos en lnea
http://www.monografias.com/trabajos5/laweb/laweb.shtml

[Consulta: 2006, Septiembre 20]

Luna, R (1998), Curso de Iniciacin Html, Documentos en lnea http://platea.pntic.mec.es/~rluna/CursoHTML [Consulta: 2006, Septiembre 22]

Programamacin en HTML y Java Script

47