Paginas Web Dreamwaver

Configurar sitio y páginas web

Tema 1. Entorno de trabajo en Adobe Dreamweaver CS6

1. Al ejecutar Adobe Dreamweaver CS6, la aplicación lanza un cuadro de diálogo para que elija el tipo de entorno a trabajar, asimismo, en el avance del programa de formación se va a utilizar el HTML, el cual permite visualizar los objetos en la página, así como el código. Las opciones como ColdFusión, PHP, ASP, entre otras, permiten el desarrollo de páginas dinámicas con lenguajes de programación.

2. Al entrar al espacio HTML, Adobe Dreamweaver CS6 presenta el espacio de trabajo para el desarrollo de las páginas web, este consta de: barras de herramientas, paneles y región editable.

Dé clic en HTML para iniciar.

3. Descripción de elementos:

Barra de menús: contiene todas las opciones y comandos de Adobe Dreamweaver CS6 agrupados en repertorios desplegables.

Barra de aplicaciones: tiene las alternativas para elegir el tipo de región editable, las extensiones, los widgets, los navegadores, así como la administración del sitio web (creación y configuración).

El diseñador: permite seleccionar un entorno de trabajo predefinido (clásico, programador, diseñador, entre otros).

El buscador: faculta examinar información en las ayudas de Adobe Dreamweaver CS6.

Región editable.

Paneles.

Barras de herramientas.

Barra vista de documento: muestra en tres formas diferentes la región editable (Código, Dividir y Diseño) y también brinda navegabilidad entre las paginas abiertas.

Inspector de propiedades: permite ver y cambiar las propiedades del objeto seleccionado en la página.

Barra estándar: presenta íconos que agilizan las acciones más utilizadas de los menús Archivo y Edición.

Nota: las barras de herramientas se pueden activar o desactivar desde el menú Ver / Barras de herramientas.

Paneles: dejan visualizar las propiedades y opciones de configuración de objetos de la página, asimismo encuentra el administrador del sitio web. Con la tecla F4 activa y desactiva el panel.

4. Vista código: permite visualizar el código HTML de la página.

Panel de propiedades.

Desplegar opciones.

Dé clic en Código.

5. Vista diseño: deja observar el diseño de la página con su elemento.

6. Con las opciones de vistas de la barra de documento: Dividir y código en vivo, también puede observar de manera paralela el diseño y el código HTML de la página.

Haga clic en Diseño.

Visualiza el diseño y el código.

Referencias

 Servicio Nacional de Aprendizaje, SENA. (2009). Diseño web con Adobe Dreamweaver CS3. Colombia: Autor.

Control del documento

Nombre Cargo Dependencia Fecha Autor

José Geovanny Angulo Imbachi

Instructor

Centro de Teleinformática y Producción Industrial.

...