Dreamweaver:

ADOBE DREAMWEAVER 

Es una en programa de estudio (basada en la forma de estudio de Adobe Flash) que está destinada a la construcción, diseño y edición de sitios, vídeos y aplicaciones Web basados en estándares. Creado inicialmente por Macromedia (actualmente producido por Adobe Systems) es uno de los programas más utilizados en el sector del diseño y la programación web por sus funcionalidades, su integración con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium.

• Nos encontramos en el entorno de trabajo de Adobe Dreamweaver, como podemos visualizar nos encontramos con una ventana del mismo programa; en la parte superior de la ventana vemos una barra de aplicaciones como tenemos:

            + Archivo

            + Edición

            + Ver

            + Insertar

            + Herramientas

            + Buscar

            + Sitio

            + Ventana

            + Ayuda

• Ahora nos ubicamos al panel izquierdo de la ventana, como se puede apreciar nos muestra una serie de iconos donde podremos interactuar fácilmente, mas bien sera como pequeños atajos para hacer mas fácil el trabajo

• Al darle click a Archivo podremos crear un nuevo archivo, o también podemos crear con las teclas (CTRL+N).

• Colocamos un titulo, luego elegimos el tipo de formato que por defecto es HTML 5, y si queremos podemos adjuntar una hoja de estilos; luego le damos en crear y listo...

• Una vez creado el nuevo archivo por defecto nos creara la estructura de HTML 5.

• Luego en la parte superior encontramos pestañas:

• Cuando le damos click a la pestaña código se nos muestra la estructura de la pagina web en modo desarrollador, es decir todo el código, en HTML 5, PHP, CSS, según sea el caso.

• Luego si le damos click en la pestaña de dividir automáticamente el entorno de trabajo cambia, ahora la ventana de trabajo cambia de apariencia, situándose el código en la parte de abajo, mientras que en la parte superior se muestra una vista previa del diseño de la pagina web.

• Finalmente cuando le damos click en diseño, a continuación nos muestra una pantalla nueva donde se puede visualizar la pagina web en todo su esplendor.

• Luego en la parte del lado derecho encontramos un panel de interacción donde encontraremos las pestañas de (Archivo, Insertar y Diseñador de CSS)

1. En la pestaña de archivo podremos seleccionar el archivo que tengamos en nuestro ordenador
2. En la pestaña de insertar cualquier etiqueta HTML.

   

 3. En la pestaña de Diseñador de CSS encontraremos todos los estilos que se están usando.

• Finalmente en la parte inferior de abajo encontraremos la ubicación de la pagina de HTML, como también la secuencia de donde nos encontramos y a su vez la selección del lenguaje de programación y la vista previa en tiempo real.

 A continuación en este video se explicara mas detalladamente sobre dreamweaver: