Taller de Aplicaciones para Internet

Vicerrectoría Académica
Cuaderno de Apuntes – 2009
I. PROGRAMA DE MÓDULO
NOMBRE DEL MÓDULO: TALLER DE APLICACIONES PARA INTERNET.
UNIDAD DE COMPETENCIA: Al finalizar el módulo los participantes serán capaces de:

Construir páginas WEB interactivas mezclando HTML y Flash, en
concordancia con los requerimientos del cliente.
DURACIÓN: 90 horas pedagógicas
II. DESCRIPCIÓN POR ÁREA DE FORMACIÓN Y PRERREQUISITO
ÁREA DE FORMACIÓN: Especialidad

UBICACIÓN EN LA MALLA: Segundo Semestre
PRERREQUISITO: No tiene
III. UNIDADES DE APRENDIZAJE
PRIMERA UNIDAD: PROGRAMACIÓN DE ESTRUCTURAS BÁSICAS

APRENDIZAJES ESPERADOS:
• Identifican la estructura y lógica del lenguaje HTML.

• Construyen páginas HTML utilizando texto enriquecido.
• Construyen páginas HTML incorporando tablas y sus propiedades.
• Incorporan imágenes a las páginas Web.
• Realizan enlaces de páginas Web.
• Incorporan marcos a las páginas.
• Incorporan archivos de sonido y video a las páginas Web.
SEGUNDA UNIDAD: PÁGINAS WEB DINÁMICAS

• Identifican la metodología de construcción de proyectos multimediales en Flash.

• Construyen animaciones como animación por fotograma, interpolación de movimiento, cambio de forma, guía
de movimiento utilizando línea de tiempo.
• Crean y editan escenas.
• Aplican lenguaje de programación ActionScript para vincular los botones con las páginas Web apropiadas.
• Aplican lenguaje de programación ActionScript para dar efectos en los clips de películas en las páginas Web.
• Aplican lenguaje de programación ActionScript para reproducir sonido y video en las páginas Web.
Cuadernos de Apuntes de uso exclusivo estudiantes del Instituto Profesional AIEP: Prohibida su reproducción. Derechos reservados AIEP.
TERCERA UNIDAD: DESARROLLAR PROYECTO WEB SEGÚN REQUERIMIENTOS DEL CLIENTE.

• Identificar requerimientos del cliente.

• Traducir los requerimientos del cliente en especificaciones de la página.
• Desarrollar proyecto Web de acuerdo a requerimientos:
IV. EVALUACIÓN DE UNIDADES

Unidad 1 Al menos 1
Unidad 2 Al menos 1
Unidad 3 Al menos 1
Examen de Módulo Práctico
V. BIBLIOGRAFÍA
-Germán Galeano – Pablo Díaz – José C. Sánchez. “HTML 4”. Anaya Multimedia. 2003.
-Matthew David. “Flash MX – Proyectos Profesionales”. Anaya Multimedia. 2002.
VI. CLASE A CLASE
PRIMERA UNIDAD: PROGRAMACIÓN DE ESTRUCTURAS BÁSICAS
CLASE 1
CLASE 1
APRENDIZAJES ESPERADOS CONTENIDOS
- Identifican la estructura y lógica del lenguaje HTML. - Estructura y lógica de un documento HTML
INTRODUCCION:
Cuántas veces nos hemos preguntado como funciona Internet y no nos imaginamos la magnitud que ha alcanzado en los
últimos años, ni la cantidad de personas que la utiliza diariamente.
El principal elemento de Internet es su cara visible “los Sitios Web” y en este modulo se conocerán, desde sus
estructuras mas simples, hasta sitios de mayor complejidad. La idea es aprender a crear Sitios Web de calidad bajo
estándares de diseño y con diferentes software y lenguajes orientados a Web.
Internet:
Es un conjunto de redes de comunicación interconectadas, que utilizan el protocolos TCP/IP para establecer la
comunicación entre maquinas que se encuentran distantes.
¿Qué es un Servidor Web?
¿Qué es un Servidor DNS?
¿Qué es un navegador?
¿Qué es TCP/IP?
¿Cómo funciona Internet?
Investigue en Internet sobre estos conceptos.
Material complementario:
Al digitar una dirección de un sitio Web en un navegador, no nos imaginamos todo lo que ocurre en realidad hasta que
los contenidos son descargados en nuestro computador, en realidad es un proceso bastante complejo.
Es importante saber que la información pasa por muchas partes antes de llegar hasta nuestros equipos, lo realmente
increíble es la rapidez con que los datos viajan, incluso cruzando continentes, llegando de casi en forma instantánea a su
destino, es la maravilla tecnológica que representa Internet.
¿Cómo se crea una pagina Web?
Las páginas Web están diseñadas en HTML (Lenguaje de Hipertexto en base a marcadores); este lenguaje esta
compuesto por marcadores, llamados también etiquetas, las cuales en capsulan acciones dentro de su estructura. Un
ejemplo de etiqueta seria el siguiente:
<marcador> (Todo comando se inicia de esta manera).

</marcador> (Para terminar todo comando se le antepone un “/”)
Donde <marcador el inicio de la acción y </marcador el termino de esta.
ESTRUCTURA DE UNA PÁGINA WEB EN HTML
La estructura de toda pagina web en HTML, esta compuesta por los siguientes marcadores:
<html> Indica el inicio de una página Web.

</html> Indica el termino del código fuente de la pagina Web.
<head> Indica el inicio de la cabecera de una pagina Web.

</head> indica el termino de la cabecera de una pagina Web.
<title> Indica el inicio del titulo de la pagina Web.

</title> Indica el termino del titulo de una pagina Web.
<body> Indica el inicio del cuerpo de una pagina Web.

</body> indica el termino del cuerpo de una pagina Web.
Ejemplo de Pagina Web en Html:
<html>
<head>
<title>ESTA ES MI PRIMERA PAGINA WEB</title>
</head>
<body>
AQUÍ ESCRIBIMOS EL TEXTO DE NUESTRA PAGINA
</body>
</html>
Actividades:
Elaboremos en base al ejemplo anterior, nuestra primera pagina Web en HTML, para ello utilicemos el Block de Notas de
Windows e Internet Explorer.
Instrucciones:
1- Cree el código fuente de la página Web en el Block de Notas.

2- Una vez terminado guarde el archivo como (pagina.htm).
3- Ejecute la pagina Web que automáticamente se generó al guardar el archivo de texto como “pagina.htm”
Material complementario:
Analice y comente:
La Internet llego a nuestras vidas como una novedad, pero con el paso del tiempo, se ha convertido en una necesidad,
ya que por muchos motivos en cierta medida dependemos de esta red mundial de información.
Es por este motivo que muchas de nuestras actividades diarias, ahora se pueden realizar online, organismos públicos y
privados, particulares y toda la comunidad se hace parte de esta plataforma de información que es Internet.
CLASE 2
CLASE 2
- Construyen páginas HTML utilizando texto enriquecido. - Etiquetas para enriquecer texto
- Construyen páginas HTML incorporando tablas y sus - Tablas en HTML
propiedades.
¿Qué diferencia existe entre una pagina y un sitio Web?
La diferencia es que una pagina Web es solo un plano o pantalla y el sitio Web es toda la estructura que componen las
paginas y sus enlaces.
Ejemplo:
¿Qué Comandos se utilizan para texto?
Algunos comandos para texto son los siguientes:
<br> Comando para salto de pagina.

<hx> Donde “x” puede ser un valor entre 1-6 y permite cambiar el tamaño del texto que se encuentra entre el
marcador
Ejemplo: <h1>texto afectado</h1>
<b>texto en negrita</b>
<i>texto en cursiva</i>
<u>Esto está subrayado</u>
<div align=left>texto a la izquierda</div>
<div align=center>texto en el centro</div>
<div align=right>texto a la derecha</div>
¿Qué Comandos se utilizan para darle color a las páginas?
<body bgcolor="red" text="blue" > Color de fondo y del texto de la página.

<font color="red" > Afecta al color del texto de una sola línea</font >
¿Qué Comandos se utilizan para crear una tabla?
Ejemplo:
<table> Indica el comienzo de la tabla

<tr> Indica el comienzo del primer renglón
<td> FRUTA </td> Ingresa el primer dato del primer renglón
<td> VERDURA</td> Ingresa otro dato al mismo renglón
<td> LEGUMBRE</td> Ingresa el tercer dato al primer renglón
</tr> Indica el final del renglón
<tr> Indica el comienzo de un nuevo renglón
<td>PERA</td> Ingresa el primer dato del segundo renglón
<td>APIO</td> Ingresa otro dato al segundo renglón
<td>LENTEJA</td> Ingresa el tercer dato al segundo renglón
</tr> Indica el final del renglón
</table> Indica el final de la tabla
CLASE 3
SE 3
- Incorporan imágenes a las páginas Web. - Incorporación de imágenes en HTML
- Realizan enlaces de páginas Web. - Vínculos en HTML
Las fotografías e imágenes son un elemento fundamental dentro de los sitios Web, ya que constituyen la parte visual
más importante y básica dentro de una pagina Web.
Para insertar imágenes en nuestras paginas HTML, debemos utilizar:
<img src="foto.jpg">
Hipervínculo: Es la capacidad que tiene un texto o un objeto, para acceder a otros archivos u objetos.
Los hipervínculos en HTML, permiten establecer enlaces entre las diferentes páginas Web, para establecer un
hipervínculo, utilizaremos los siguientes marcadores:
Acceder a otros sitios Web:
<a href="http://www.google.cl">Ir google</a>
Acceder a otras paginas dentro de nuestro sitio Web:
<a href="contactos.html">Pagina de Contactos</a>
CLASE 4
CLASE 1
- Incorporan marcos a las páginas. - Incorporación de marcos
Los marcos nos permiten dividir las páginas Web en regiones independientes, lo que nos permite, tener zonas siempre
visibles y otras que se pueden intercambiar por medio de hipervínculos. La ventaja de trabajar con marcos es que por
ejemplo, siempre podemos tener a la vista los menús de la pagina lo que nos permite una mejor navegabilidad por el sitio
Web.
Actividad:
Vamos a diseñar una página que contenga dos columnas, una de 250 píxeles y la otra que ocupe el resto de la pantalla.
En la primera colocaremos un fondo de color amarillo y en la segunda de color rosa.
Para ello redactamos el primer documento que se encarga de establecer las divisiones de esta manera:
<html>
<head>
<title>Creación de Página Web con Marcos</title>
</head>
<frameset cols="250,*">
<frame src="marco1.html" name="primermarco">
<frame src="marco2.html" name="segundomarco">
</frameset>
</html>
Observa que no debe incluirse el marcador <body>.

Guardamos este documento con el nombre divisiones.html
Luego redactamos el documento que ocupará el primer marco:
<html>
<head>
<title>Fondo uno</title>
</head>
<body bgcolor="red">
</body>
</html>
A este documento lo guardarlo con el nombre marco1.html.

Y por último redactamos el documento que ocupará el segundo marco:
<html>
<head>
<title>Fondo dos</title>
</head>
<body bgcolor="black">
</body>
</html>
A este documento lo guardarmos con el nombre marco2.html.

Si ahora abrimos desde nuestro navegador el archivo divisiones.html, deberíamos ver esto:
CLASE 5
CLASE 1
- Incorporan archivos de sonido y video a las páginas Web. - Incorporación de archivos y videos
El incorporar archivos multimedia a nuestros sitios Web proporciona, un aspecto muy llamativo, que hace que nuestro
proyecto Web, sea mucho mas atractivo para los usuarios; además de acaparar la atención de muchos de nuestros
sentidos.
Para agregar archivos de audio debemos aplicar:
<bgsound src="canción.wav " loop=infinite> (Canción de fondo).
Para agregar archivos de video debemos aplicar:
<embed src="video.avi" width=352 height=240>
Actividad:
Vamos a diseñar una página, en la cual existan dos listas de reproducción una de audio y una de videos, para esto
crearemos enlaces a los archivos multimedia.
CLASE 6
CLASE 1
- Incorporan archivos de sonido y video a las páginas Web. - Incorporación de archivos y videos
El lenguaje HTML, es importante dominarlo, ya que la estructura de cualquier sitio Web, se basa en marcadores de este
lenguaje. Dentro de estos marcadores se inserta el código de los lenguajes de programación orientados a Web; de ahí
la importancia que tiene que dominemos el lenguaje HTML.
Actividad:
Crear un sitio Web, para una empresa ficticia, de acuerdo a esto se pide para el sitio Web de la organización lo siguiente:
- Creación de página principal en HTML con 2 marcos (el marco izquierdo para menú y el marco derecho para
contenidos de las otras páginas).
- Creación de de 5 páginas HTML (para contenidos).
- Inserción de tablas.
- Inserción de imágenes.
- Inserción de comandos para texto.
- Inserción de comandos para color.
- Inserción de archivos multimedia.
- Crear hipervínculos entre la página principal y las páginas de contenidos.
- Crear vínculos desde las páginas de contenidos para volver a la pagina principal.
SEGUNDA UNIDAD: PÁGINAS WEB DINÁMICAS
CLASE 7
CLASE 1
- Identifican la metodología de construcción de proyectos - Metodología de construcción de proyectos
multimediales en Flash. multimediales en Flash.
- Construyen animaciones como animación por fotograma, - Animaciones utilizando línea de tiempo.
interpolación de movimiento, cambio de forma, guía de movimiento
utilizando línea de tiempo.
Mapa del Sitio: Es la representación gráfica de la estructura jerárquica que compone un sitio Web, en este
diagrama, van especificadas todas las páginas Web que componen el sitio, con la finalidad
que tanto los usuarios, como los diseñadores tengan una visión global de la estructuración
de el sitio Web.
Ejemplo:
En el ejemplo podemos ver un árbol de un sitio, perteneciente a una viña. En el son representados gráficamente tanto
las paginas Web como los enlaces y como se relacionaran dentro de la estructura jerárquica de árbol.
Actividad:
Crear un Árbol sitio Web, para una empresa ficticia o un sitio de interés personal, realizar un ordenamiento de los ítems
de acuerdo a su importancia.
Para crear un proyecto Web en flash debemos tener claro el orden jerárquico de los objetos esto porque Flash, trabaja
con capas y a su vez las capas poseen sub niveles de acciones.
INTRODUCCION A FLASH
Flash es software más utilizado en el diseño Web, que permite la creación de animaciones y películas vectoriales. El
interés en el uso de gráficos vectoriales es que éstos permiten llevar a cabo animaciones livianas, es decir, que se
demoran poco tiempo en ser cargadas por los navegadores.
ESPACIO DE TRABAJO DE FLASH
LINEA DE TIEMPO:
En la línea de tiempo se llevan a cabo todas las acciones de la animación en intervalos de tiempo llamados “fotogramas”
el cual un cuadro o frame dentro de la película Flash, la velocidad de la película se mide en fotogramas por segundo, el
valor por defecto de las películas flash es de 12 fotogramas por segundo. Cabe señalar que este valor se puede
disminuir o aumentar, haciendo la película mas lenta o más rápida respectivamente.
En la línea de tiempo además se trabaja con las capas la cual pertenece a cada campo de acción de los elementos de
las películas.
AREA DE DISEÑO:
En el área de diseño se lleva a cabo la construcción, inserción y edición de los diversos elementos de la película. Se
podría decir que es el escenario de la película flash.
EDITOR DE ActionScript:
En esta área de trabajo se programan las acciones en lenguaje de programación ActionScript, lenguaje de programación
propio de flash el cual cuanta con innumerables comandos para el trabajo en ambientes Web.
CREAR UNA ANIMACIÓN EN FLASH
1- Dibujar objeto en un extremo del área de diseño.

2- Darle permanecía al objeto en la línea de tiempo con la tecla F6.
3- Hacer clic derecho sobre la capa del objeto y seleccionar “crear interpolación de movimiento”.
4- Hacer clic derecho sobre el último fotograma clave del objeto y seleccionar “crear interpolación de movimiento”.
5- Una vez de color lila toda la capa del objeto, hacer clic sobre el ultimo fotograma clave.
6- Mover el objeto hacia la posición que se desee desplazar.
7- Presionar ENTER.
8- Si todo se realizo bien la animación debería funcionar, haciendo que el objeto se desplace.
PUBLICAR UNA ANIMACIÓN EN FLASH
Para publicar una animación debemos hacer lo siguiente:
1- Menú “archivo” guardar como damos un nombre y guardamos el archivo fuente con extensión *.fla
2- Una vez guardado el archivo fuente, nos vamos nuevamente al menú “archivo”
Y seleccionamos la opción publicar, por defecto nos publicará una película *.swf que es el formato de película de
flash. Esta publicación se puede configurar y se pueden publicar una serie de archivos de diferentes tipos.
Actividad:
Crear una animación básica en flash.
Se pide:
- Mover figuras Geométricas a través de interpolación de movimiento.

- Crear imágenes compuestas agrupando figuras geométricas.
- Publicar película en formatos swf y html.
CLASE 8
CLASE 1
- Crean y editan escenas. - Creación y edición de escenas.
Las escenas en flash son fragmentos, con los cuales se conforma una película. La escenas sirven para organizar y
ordenar el desarrollo y construcción de un proyecto de animación o video clip extenso, en el cual existan muchas capas y
elementos.
Para crear una escena nos vamos al menú “insertar/escena”
Para eliminar una escena presionamos la combinación de teclas shif + F2, para que se abra un cuadro de dialogo donde
podemos administra las escenas.
Actividad:
Crear un video clip con 3 escenas, en las cuales siga una secuencia lógica de acontecimientos. De manera de poder
apreciar cual es la importancia de utilizar escenas en Flash.
CLASE 9
CLASE 1
- Aplican lenguaje de programación ActionScript para vincular los - Lenguaje de programación ActionScript para
botones con las páginas Web apropiadas. vincular los botones con las páginas Web.
Para vincular botones en flash, para crear sitios Web, es necesario programar estos botones con acciones en lenguaje
ActionScript.
A continuación veremos un ejemplo del código empleado para vincular paginas en Flash, a través de las acciones de
ActionScript.
PROCEDIMIENTO PARA PROGRAMAR UN BOTON
Primero que nada para crear un botón de manera grafica, podemos hcerlo con un texto, una imagen o cualquier objeto,
para transformar un objeto en botón es necesario:
1- Hacer clic sobre el objeto.

2- Presionar la tecla F8.
3- Seleccionar la opción botón y presionar ACEPTAR.
De esta manera automáticamente el objeto se transformará en botón
Para programar las acciones al botón debemos:
1- Hacer clic sobre el boton.

2- Irnos al editor de ActionScript.
3- Generar el siguiente codigo.
on (release) {
gotoAndStop("nombre del fotograma de la pagina");
}
Al realizar estas acciones al hacer clic en el botón durante la publicación, actuará al igual que un hipervínculo, mostrando
los contenidos del fotograma mencionado en el código ActionScript.
Actividad:
Crear un Proyecto de catalogo electrónico, para hacer promoción a un producto a elección, el catalogo deberá poseer
botones programados con enlaces ActionScript, para mostrar los contenidos de los fotogramas.
CLASE 10
CLASE 1
- Aplican lenguaje de programación ActionScript para dar efectos en - Lenguaje de programación ActionScript para
los clips de películas en las páginas Web. Clips de Películas en páginas Web.
Actividad:
Continuación del proyecto de catalogo electrónico, incorporación de acciones para escenas y acciones para fotogramas.
Comandos ActionScript para cambiar de escena.

on (release){
gotoAndStop("nombre de escena", "nombre de fotograma");
}
Comandos ActionScript para retroceder un fotograma.

on (release){
prevframe();
}
Comandos ActionScript para avanzar un fotograma.

on (release){
nextframe();
}
CLASE 11
CLASE 1
- Aplican lenguaje de programación ActionScript para reproducir - Lenguaje de programación ActionScript para
sonido y video en las páginas Web. incorporar sonido y video a una pagina Web.
El audio y video al ser incorporados en un proyecto Flash, son un gran aporte al diseño del proyecto, ya que se
enriquece con estos medios multimediales.
Para insertar audio y video a flash, debemos:
1- Importar archivos multimedia que utilizaremos a la biblioteca de flash.

2- Incorporar los archivos de audio o video a capas creadas para ellos, de manera que estén en un espacio
independiente.
3- Programar las acciones de reproducción, que vienen por defecto, o bien programar los comportamientos,
con acciones de ActionScript.
Actividad:
Crear un Proyecto de Video Clip, para un cantante o grupo musical, el proyecto deberá incorporar audio y video.
CLASE 12
CLASE 1
- Aplican lenguaje de programación ActionScript para vincular los - Lenguaje de programación ActionScript para
botones con las páginas Web apropiadas. vincular los botones con las páginas Web.
Comandos ActionScript para cargar películas.

on (press) {
loadMovieNum("Nombre del archivo.swf", nivel);
}
Actividad:
Crear un Proyecto de Sitio Web, donde se incorporen los proyectos del catalogo electrónico y el video clip, esto a través
del comando load movie. La incorporación de los proyectos se deberá implementar a través de botones programados.
TERCERA UNIDAD: DESARROLLAR PROYECTO WEB SEGÚN REQUERIMIENTOS DEL CLIENTE.
CLASE 13
CLASE 1
- Identificar requerimientos del cliente. - Identificación los requerimientos del cliente.
Es fundamental definir los requerimientos del proyecto de sitio Web, para esto es necesario, estar en contacto con el
cliente durante todas las fases de desarrollo del proyecto.
En un principio es decisivo saber que es lo que quiere ganar el cliente, con la implementación de un Sitio Web y a su vez
que quiere que contenga el sitio Web.
De acuerdo a estos parámetros podríamos establecer un bosquejo del estructura de nuestro proyecto, a través de la
creación de un árbol del sitio. Para tener una visión analítica de la estructura del sitio Web.
Actividad:
Crear un Árbol sitio Web, de acuerdo a la toma de requerimientos con el cliente. La idea es discutir con el cliente acerca
de este bosquejo, para saber si vamos bien encaminados y si hay que hacer modificaciones en el proyecto en esta etapa
es el más oportuno momento.
Una vez terminado el árbol del sitio de acuerdo con los requerimientos del cliente, debemos comenzar la construcción de
nuestro proyecto de sitio web.
CLASE 14
CLASE 1
- Traducir los requerimientos del cliente en especificaciones de la - Traducción de los requerimientos del cliente
página. en especificaciones de la página Web.
Luego de la toma de requerimientos, definir que herramientas de software utilizaremos para el desarrollo del proyecto;
una vez definidas las aplicaciones con las que trabajaremos, debemos crear las estructura del sitio Web.
El siguiente paso es preocuparnos de la parte grafica, la publicidad y planear que mecanismos de difusión utilizaremos
para que el sitio se haga conocido en Internet.
Otros aspectos importantes son el adquirir un nombre de dominio para el sitio Web y un servicio de hosting, para alojar
nuestros archivos del sitio Web en un servidor de Internet.
CLASE 15
CLASE 1
- Desarrollar proyecto Web de acuerdo a requerimientos: Desarrollo proyecto para Web, según
especificaciones.
Actividad:
- Comenzar a diseñar y desarrollar el proyecto de sitio Web, de acuerdo a la toma de requerimientos al cliente y
basándose en el árbol del sitio diseñado con anterioridad.
- Buscar en Internet un hosting gratuito donde podamos alojar nuestro sitio Web.
- Visitar www.nic.cl para aprender como es el procedimiento para comprar un dominio.cl.
- Visitar sitios Web de hosting, para cotizar cuales son las tarifas y los planes y servicios que estas empresas
nos ofrecen a la hora de alojar nuestros sitios Web en sus servidores.
CLASE 16
CLASE 1
Desarrollar proyecto Web de acuerdo a requerimientos: Desarrollo proyecto para Web, según
especificaciones.
Actividad:
- Revisar detalles y posibles errores del proyecto.
- Subir los archivos del sitio al hosting.
- Hacer pruebas de velocidad de descarga y de contenidos.
- Comparar trabajos de sus compañeros intercambiándose direcciones, con el objetivo de evaluar y autoevaluar
el proceso del desarrollo y término de los proyectos.
- Observar si el producto final satisface efectivamente a los usuarios finales.

Taller de Aplicaciones para Internet

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Taller de Aplicaciones para Internet

Cargado por

Copyright:

Formatos disponibles

Vicerrectoría Académica

Cuaderno de Apuntes – 2009

NOMBRE DEL MÓDULO: TALLER DE APLICACIONES PARA INTERNET.

UNIDAD DE COMPETENCIA: Al finalizar el módulo los participantes serán capaces de:

DURACIÓN: 90 horas pedagógicas

II. DESCRIPCIÓN POR ÁREA DE FORMACIÓN Y PRERREQUISITO

ÁREA DE FORMACIÓN: Especialidad

III. UNIDADES DE APRENDIZAJE

PRIMERA UNIDAD: PROGRAMACIÓN DE ESTRUCTURAS BÁSICAS

• Identifican la estructura y lógica del lenguaje HTML.

SEGUNDA UNIDAD: PÁGINAS WEB DINÁMICAS

• Identifican la metodología de construcción de proyectos multimediales en Flash.

TERCERA UNIDAD: DESARROLLAR PROYECTO WEB SEGÚN REQUERIMIENTOS DEL CLIENTE.

• Identificar requerimientos del cliente.

IV. EVALUACIÓN DE UNIDADES

VI. CLASE A CLASE

PRIMERA UNIDAD: PROGRAMACIÓN DE ESTRUCTURAS BÁSICAS

¿Qué es un Servidor Web?

¿Qué es un Servidor DNS?

¿Cómo funciona Internet?

Investigue en Internet sobre estos conceptos.

<marcador> (Todo comando se inicia de esta manera).

Donde <marcador el inicio de la acción y </marcador el termino de esta.

ESTRUCTURA DE UNA PÁGINA WEB EN HTML

<html> Indica el inicio de una página Web.

<head> Indica el inicio de la cabecera de una pagina Web.

<title> Indica el inicio del titulo de la pagina Web.

<body> Indica el inicio del cuerpo de una pagina Web.

Ejemplo de Pagina Web en Html:

1- Cree el código fuente de la página Web en el Block de Notas.

¿Qué diferencia existe entre una pagina y un sitio Web?

¿Qué Comandos se utilizan para texto?

Algunos comandos para texto son los siguientes:

<br> Comando para salto de pagina.

Ejemplo: <h1>texto afectado</h1>

¿Qué Comandos se utilizan para darle color a las páginas?

<body bgcolor="red" text="blue" > Color de fondo y del texto de la página.

¿Qué Comandos se utilizan para crear una tabla?

<table> Indica el comienzo de la tabla

Para insertar imágenes en nuestras paginas HTML, debemos utilizar:

Acceder a otros sitios Web:

<a href="http://www.google.cl">Ir google</a>

Acceder a otras paginas dentro de nuestro sitio Web:

<a href="contactos.html">Pagina de Contactos</a>

Observa que no debe incluirse el marcador <body>.

A este documento lo guardarlo con el nombre marco1.html.

A este documento lo guardarmos con el nombre marco2.html.

Para agregar archivos de audio debemos aplicar:

<bgsound src="canción.wav " loop=infinite> (Canción de fondo).

Para agregar archivos de video debemos aplicar:

<embed src="video.avi" width=352 height=240>

SEGUNDA UNIDAD: PÁGINAS WEB DINÁMICAS

ESPACIO DE TRABAJO DE FLASH

CREAR UNA ANIMACIÓN EN FLASH

1- Dibujar objeto en un extremo del área de diseño.

PUBLICAR UNA ANIMACIÓN EN FLASH

Para publicar una animación debemos hacer lo siguiente:

- Mover figuras Geométricas a través de interpolación de movimiento.

Para crear una escena nos vamos al menú “insertar/escena”

PROCEDIMIENTO PARA PROGRAMAR UN BOTON

1- Hacer clic sobre el objeto.

De esta manera automáticamente el objeto se transformará en botón

Para programar las acciones al botón debemos: