ACUMULATIVO

El acumulativo consistió en la creación de la pagina principal de un sitio web, para realizarla seguí los siguientes pasos:

1. En dreamweaver abro un nuevo archivo html

2. Vamos a insertar una imagen de fondo, para ello en la barra de propiedades que se encuentra en la parte inferior damos clic en propiedades de pagina, luego nos aparecerá una ventana, damos clic en examinar y elegimos la imagen.

3. Ahora en insertar, creamos una tabla de 1 fila.

4. Una vez insertada la tabla le colocamos el fondo que deseemos y le agregamos el primer banner que sera el encabezado de nuestra pagina, para esto damos clic en insertar > imagen

Nota: Para crear este banner se puede utilizar paint o el programa que prefieras.

5. Luego debemos crear la barra de menú  para ello insertamos otra tabla de 7 columnas y la llenaremos los campos según lo que queremos que aparezca en la pagina.

6. Insertamos otro banner con lo que queremos ofrecer.

7. Le damos guardar y de nombre le colocamos index.html y ahora podemos observar lo que llevamos con el comando vista previa que aparece en la parte superior.

CREACIÓN DE UN MENÚ EN ADOBE DREAMWEAVER CS6

Para crear un menu en adobe dreamweaver CS6 se llevan a cabo los siguientes pasos:

1. Abrimos el programa Adobe Dreamweaver Cs6 y elegimos crear nuevo HTML

2. En la barra de herramientas, damos clic en el comando insertar > Spry > Barra de menús de spry

3. Nos aparecerá una ventana que nos dice que escojamos el diseño del menú que puede ser horizontal o vertical, en este caso yo elegí horizontal.

4. Elegimos el numero de comandos que tendrá nuestro menú  yo elegí 3 y enseguida nos saldrá una barra de menús de spry dependiendo del numero de comandos que elegimos. 

5. En la parte inferior observaremos que aparece una barra de propiedades para la edición del menú  nos dedicaremos a llenar los campos del menú de acuerdo a lo que queremos que aparezca. 

* El mas y el menos sirve para agregar o eliminar un campo; la fecha arriba y abajo sirve para ordenar el menú.

* El primer cuadro que nos aparece en la barra de propiedades corresponde a los comandos que vamos a crear, el segundo cuadro a lo que se va a desplegar de cada comando y el tercero a lo que se despliega de cada subcomando. 

6. Para agregar un vinculo hacemos lo siguiente: En la parte derecha de la barra de propiedades del menú  observamos que hay un campo texto que nos indica el nombre que le otorgamos al comando, debajo esta vinculo y en frente un campo desocupado, si queremos que se dirija a una pagina web solo copiamos su dirección o si queremos que se dirija a una imagen o a un archivo, damos clic en la carpeta que sale y elegimos el archivo. 

7. Continuamos agregando vínculos hasta terminar nuestro menú.

8. Guardamos el archivo.

- Ahora podemos ver que nos aparecerá en la carpeta donde guardamos el archivo un icono de un explorador, le damos clic y nos saldrá algo así: 

- Si le damos clic en cualquiera de los comandos, nos debe dirigir al vinculo que le agregamos anteriormente.

- Enseguida nos sale el vinculo.

ADOBE FIREWORKS CS6

Adobe fireworks CS6 te ayuda a crear en un instante y sin necesidad de escribir un código  atractivos diseños para sitios web y apps para dispositivos mobiles. 

El trabajo a realizar consistió en crear un boceto para una pagina web, este diseño esta a base de rectángulos y para darle un toque mas real, utilizamos la opción degradado y algunas iluminaciones como podrás ver en las siguientes imágenes:

El boceto de la pagina me quedo así:

CONTINUACIÓN CREACIÓN DEL DISEÑO DE UNA PAGINA WEB

Una vez creado el fondo es necesario agruparlo para esto seleccionamos todo y le damos ctrl + G. Luego vamos a crear la cabecera para esto se siguen los siguientes pasos:

1. Seleccionamos la herramienta rectángulo y hacemos uno de 908 de largo por 117 de alto. El color sera plomo en la parte superior y blanco en la inferior con una textura horizontal 3.

2. Realizamos otro rectángulo de 908 de ancho y con 11 de alto a este le quitamos la textura y el color plomo lo oscurecemos un poco mas.

3. Ahora diseñaremos el logo así  seleccionamos la opción texto y escribimos el nombre que le queremos colocar. Si deseamos le podemos colocar sombra de color blanco y un efecto relieve para que se vea mas real. Si quieres agregarle algún símbolo a tu logo puedes hacerlo.

4. Por ultimo agrupa todos los elementos que utilizaste en tu logo.

EL RESULTADO ES EL SIGUIENTE:

ADOBE FLASH CS6

Este es un programa que sirve para hacer animaciones, realizamos una animación de una pelota rebotando. A continuación aparecerán unas imágenes de como lo hicimos:

1. Dibujamos la trayectoria que le queremos dar a la pelota en una capa guía 

2. En otra capa dibujamos la pelota y la guardamos como símbolo

3. Oprimimos F6 y empezamos a mover la pelota para crear los fotogramas necesarios 

Esta fue la animación 

ADOBE DREAMWEAVER CS6

 Es una aplicación que esta destinada a la construcción  diseño y edición de sitios, vídeos y aplicaciones web basados en estándares.
 Es el programa mas utilizado en el sector de diseño y programación web, por sus funcionalidades, su integración con otras herramientas como adobe flash y recientemente por su aporte de los estándares del World Wide Web Consortium.

El trabajo de esta clase consistía en crear una presentación en power point acerca de adobe dreamweaver, enfatizando en su interfaz gráfica  Una vez realizada esta presentación debía que ser subida a authorstream y luego publicarla en el blogger.

A continuación veras imágenes de la presentación en power point:

Ahora unas imágenes de la presentación en authorstream:

Ahora la presentación final:

ADOBE DREAMWEAVER (1)

More PowerPoint presentations from Andrea Castillo