Trabajando con DreamWeaver 2015

Para diseñar paginas HTML, primero construimos un sitio web. Como primer paso creamos la
carpeta del Sitio: Laboratorio01, tal como se muestra. Una sugerencia, crea dicha carpeta en el
escritorio

Carpeta del sitio Web

A continuación abrir la carpeta y crear las subcarpetas donde distribuiremos los archivos del
sitio: paginas, imágenes, etc., tal como se muestra

Abrir la carpeta y crear

las carpetas
Trabajar con DreamWeaver 2015
Para Trabajar con esta aplicación primero abrir el aplicativo, el cual muestra el siguiente
entorno:

Para iniciar con el desarrollo de un sitio Web, debemos seleccionar desde la opción
SitioNuevo Sitio, tal como se muestra

Seleccionar la opción
Nuevo Sitio
Desde la ventana Configuración del sitio, buscamos la Carpeta del sitio local presionando el
botón buscar. A continuación selecciona la carpeta que representa el sitio Web del proyecto y
presiona el botón Seleccionar Carpeta, tal como se muestra

Botón buscar, carpeta

del sitio local

Selecciona la carpeta del

sitio web

Seleccionada la carpeta, se visualiza su ubicación, tal como se muestra. Presiona el botón

Guardar

Ubicación de la carpeta
del sitio web
A continuación visualizamos en la ventana Archivos, la carpeta del sitio y sus subcarpetas, tal
como se muestra

Carpeta del sitio

web

Creando una página HTML

Desde la ventana principal (opción Crear nuevo) selecciona la opción HTML, tal como se
muestra

Hacer click en la opción

Selecciona el documento HTML, como se muestra

Selecciona el tipo de
documento HTML

A continuación presentamos la ventana para diseñar una página HTML, tal como se muestra.
Recuerda que este documento aún no ha sido guardado

Barra de herramientas
del documento
A continuación guardamos, en primera instancia, el documento HTML: presiona la
combinación de teclas CTRL+S y abrimos la carpeta paginas y asignas el nombre del
documento, tal como se muestra. Presionar el botón Guardar

Nombre del documento

HTML

Para visualizar la ventana de código de la página, selecciona el botón código, donde se visualiza
el código HTML de la página, tal como se muestra

Presionar el botón
código.
Para visualizar la ventana en vivo, presiona el botón Dividir, dividiendo las páginas y
visualizando las ventanas en forma horizontal, tal como se muestra

Presionar el botón Dividir

para dividir las ventanas

Para que las ventanas se visualicen en forma vertical, desde la opción Ver, seleccionar la
opción Dividir verticalmente y desmarcar la opción Vista en vivo a la izquierda, tal como se
muestra

Seleccionar las opciones

Para trabajar con la página comenzamos a colocar las etiquetas y el contenido dentro de ellas.
Para verificar presiona la tecla F5, donde se visualiza la página en vivo tal como se muestra

Para ejecutar la página, presiona la tecla F12, pero antes guardas la página: Ctrl+S.