domingo, 1 de noviembre de 2015

Tarea final - OCTUBRE - SETIEMBRE

Aqui el ejemplo de la pagina Web que deben publicar...........

http://barras.webcindario.com/index.html

- No tiene imágenes.
- La tabla no debe tener bordes.

Presentación; hasta la próxima clase recuerden que es nota.


sábado, 22 de agosto de 2015

Clase 04 - Tarea final

Estimados alumnos: 
Deberán realizar la siguiente Práctica con Sothink SWF Easy que trata de crear 12 escenas cada una con 4 segundos de duración y en cada escena poner como titulo EL NOMBRE DE UN DEPARTAMENTO, y debajo de ella poner una imagen que describa al departamento puede ser por ejemplo:
                                     
                                        CUZCO

LA IMAGEN DEBE TENER EFECTOS.
DEBEN HACER EN GRUPOS COMO SE LES HA ORGANIZADO. 
DEBERÁN ELEGIR CUALQUIERA DE LOS 24 DEPARTAMENTOS, ASI QUE NO PIERDAN TIEMPO
EXPORTARLO Y PUBLICARLO EN EL FACE. E INDICAR CON QUIEN HAN TRABAJADO.


jueves, 20 de agosto de 2015

Clase 03 - Entorno de Trabajo

La pantalla inicial

Ver el videotutorial
Al arrancar Dreamweaver aparece una pantalla inicial como ésta, vamos a ver sus componentes fundamentales. Así conoceremos los nombres de los diferentes elementos y será más fácil entender el resto del curso. La pantalla que se muestra a continuación (y en general todas las de este curso) puede no coincidir exactamente con la que ves en tu ordenador, ya que cada usuario puede decidir qué elementos quiere que se vean en cada momento y dónde, como veremos más adelante.

 Las barras

• La barra de la aplicación.
Barra de aplicación
La barra la aplicación se incorporó en la versión anterior de Dreamweaver. Si tenemos la ventana maximizada veremos todos los elementos de la barra ocupando una sola línea, si no, ocuparán dos líneas, como en la imagen superior.
Esta barra contiene los siguientes elementos: los menús (en la imagen, en la parte inferior), varios botones propios de la aplicación, el conmutador de espacio de trabajo y una caja de búsquedas para obtener ayuda on line.
Los botones propios de la aplicación, que aparecen junto al icono, nos permiten (de derecha a izquierda) cambiar entre la vista de diseño o código, acceder a las extensiones que se pueden añadir, o al administrador de sitios, que ya veremos.
Clásico
Más hacia la derecha observamos el conmutador del espacio de trabajo, como un desplegable. Un espacio de trabajo es la configuración del entorno (paneles visibles y su disposición) que podemos guardar y cargar. Lo veremos más adelante.
Los menús, están agrupados en categorías.
Barra de menúBarra de menú
Al hacer clic en Insertar, por ejemplo, veremos las operaciones relacionadas con los diferentes elementos que se pueden insertar en Dreamweaver. Todas las opciones de Dreamweaver son accesibles a través de los menús, aunque en ocasiones nos envíen a los paneles.
• Las pestañas de documento.
Cada archivo que tengamos abierto, mostrará una pestaña con su nombre, lo que nos permitirá cambiar de uno a otro fácilmente. Si junto al nombre aparece un *, indica que ese archivo tiene cambios sin guardar. Podemos cerrar cada documento clicando en el aspa de la derecha, o acceder a otras acciones haciendo clic con el botón derecho, comoCerrar otros archivos.
Debajo de las pestañas encontramos los archivos a que utiliza nuestra página, como la hoja de estilos, archivos JavaScript, etc... pudiendo acceder a ellos con un clic. Esto nos ahorrará bastante tiempo.
• La barra de estado.
Barar de estado
Esta barra la encontramos debajo de la ventana de documento, y nos da información sobre el mismo.
A la izquierda, encontramos el selector de etiquetas. Nos sirve para seleccionar etiquetas completas. Siguiendo hacia la derecha encontramos las herramientas de Selección, Mano (para desplazarse) y Zoom. Y otros datos como el tamaño de la ventana, el tamaño de la página o su codificación.

Hasta aquí las barras que siempre veremos en la aplicación. A parte, existen otras que podemos ver u ocultar desde el menú Ver → Barras de herramientas.
Ver → Barras de herramientas
 • La barra de herramientas estándar.
La barra de herramientas estándar contiene iconos para realizar las acciones más habituales del menú Archivo y Edición. De izquierda a derecha: Nuevo archivo, Abrir, explorar con Adobe Bridge, Guardar, Guardar todo, Imprimir el código fuente, Cortar, Copiar, Pegar, Deshacer y Rehacer. Esta barra puede ser muy útil, pero en realidad casi todo el mundo usa esos comandos directamente con el teclado (Ctrl + G para guardar, Ctrl + C para copiar, etc.)
• La barra de herramientas de documento.
Barra de docuemnto
La contiene iconos que nos permiten cambiar entre las distintas vistas de edición y la vista en vivo, acceder cómodamente al título de la página, o realizar las distintas opciones de validación que nos ofrece el programa.
• La barra de navegación con navegador.
Esta barra nos permite usar Dreamweaver como un navegador web y navegar por las páginas de nuestro sitio, aunque sólo tiene sentido con la Vista en vivo, como ya veremos.

Como también veremos al personalizar el entorno, algunos paneles, como Insertar nos permiten colocarlo como otra barra de herramientas.

Vistas de un documento

Ver el videotutorial
Podemos editar el documento con distintas vistas, que puedes cambiar través de la barra de documento:
Vistas tradicionales
• La vista Diseño 
La vista Diseño permite trabajar con el editor visual.
Nos ofrece un aspecto muy similar al resultado final, pero totalmente editable.
• La vista Código 
La vista Código se utiliza para poder trabajar en un entorno totalmente de programación, de código fuente. No permite tener directamente una referencia visual de cómo va quedando el documento según se va modificando el código.
El código que vemos es el que genera Dreamweaver al editar el contenido en la vista Diseño.


Clase 02 - Conceptos básicos de Dreamweaver CS5





Conceptos básicos de Dreamweaver CS5
Dreamweaver CS5 es un software fácil de usar que permite crear páginas web profesionales.
Dw
Las funciones de edición visual de Dreamweaver CS5 permiten agregar rápidamente diseño y funcionalidad a las páginas, sin la necesidad de programar manualmente el código HTML.
Se puede crear tablas, editar marcos, trabajar con capas, insertar comportamientos JavaScript, etc.., de una forma muy sencilla y visual.
Además incluye un software de cliente FTP completo, permitiendo entre otras cosas trabajar con mapas visuales de los sitios web, actualizando el sitio web en el servidor sin salir del programa.
Los logotipos de Dreamweaver son propiedad de Adobe, así como las marcas registradas Dreamweaver y Adobe. aulaClic no tiene ninguna relación con Adobe.
Las páginas web están escritas en HTML. Si no conoces las características básicas de HTML puedes verlas aquí. Básico

Mi primera página

Para que te vayas haciendo una idea de cómo funciona Dreamweaver, vamos a crear una página web sencilla, con varios estilos de texto, una imagen y un enlace a otra página. Crear esta página solo te llevará unos pocos minutos, y sabrás cómo trabajar con los elementos básicos con los que están hechas la mayoría de las páginas web. Si nunca has hecho una página web, este es el momento para descubrir lo fácil que es.
 Lo primero que tienes que hacer es abrir Dreamweaver. Abre un documento nuevo y selecciona la Categoría Página básica, HTML, en la columna Diseño dejamos la opción por defecto: <ninguno>.
Seguidamente, haz clic sobre la zona blanca del documento y escribe lo siguiente:
Una vez introducido el texto, vamos a modificar el título y el color de fondo del documento.
Para ello podemos hacer clic sobre el menú Modificar y elegir la opción Propiedades de la página.
Entonces se abrirá una ventana como la que aparece a continuación:
En Color de Fondo escribe #CCCCFF, de este modo el fondo del documento pasará a ser de color azul.
Haz clic en Título/Codificación a la izquierda, y en el Título escribe Mi primera página.
Para aplicar los cambios, pulsa sobre el botón Aceptar.


sábado, 1 de agosto de 2015

Clase 1 - Sothink SWF Easy


Crea botones, banners y todo tipo de animaciones en Flash




Sothink SWF Easy (antes conocido como Glanda) es una de las formas más sencillas de crear vistosas animaciones en Flash (SWF) sin necesitar extensos conocimientos de diseño ni de esta tecnología de animación.

Sothink SWF Easy presenta una interfaz WYSIWYG en la que todo el trabajo se realiza de forma totalmente visual, con soporte para la funcióndrag-and-drop y usando si quieres alguna de las docenas de plantillas de diseño que ya vienen incluidas.

En Sothink SWF Easy, podrás crear botones, "intros" para tu página Web, logos, banners y cualquier otro tipo de animación. Una vez terminada tu creación, el programa genera automáticamente el código fuente necesario para incluir en tu Web, así como un fichero SWF.




Download Here

Direct Link (52MB)


Password
www.p30download.com