Este documento describe los elementos básicos del software Dreamweaver CS5 para crear páginas web. Explica que Dreamweaver permite crear sitios web profesionales de forma visual sin necesidad de codificar a mano, y que incluye barras, paneles y herramientas para diseñar páginas, insertar hiperenlaces, etiquetas HTML y maquetar elementos mediante su tamaño y posición.

2. Menú
 Dreamweaver CS5.
 Los elementos básicos de Dreamweaver CS5.
 Pantalla inicial.
 Las barras.
• La barra de la aplicación.
• Las pestañas de documento.
• La barra de estado.
• La barra de herramientas estándar.
• La barra de herramientas de documento.
• La barra de representación de estilos.
• La barra de navegación con navegador.
 Los Hiperenlaces.
 HTML desde Dreamweaver.
• Etiqueta .
 Maquetación web(diseño de la pagina).
• Tamaño .

3. Dreamweaver CS5
El dreamweaver CS5 es un software que permite crear
paginas web profesionales.
Este software permite agregar rápidamente diseño y
funcionalidad a las paginas sin necesidad de
programar manualmente el código HTML, en este
podemos crear tablas, editar marcos, trabajar con
capas, insertar comportamientos JavaScript,ect…,de
una forma muy sencilla y visual.
Además permite trabajar con software FTP completo,
permitiendo entra otras cosa manejar mapas visuales
de los sitios web sin salir de este

4. Los elementos básicos de
Dreamweaver CS5
Los elementos básicos de este software son la pantalla,
las barras, los paneles, ect… estos se diferencian entre
si.
 Pantalla inicial.
 Las barras.
• La barra de la aplicación.
• Las pestañas de documento.
• La barra de estado.
• La barra de herramientas estándar.
•La barra de herramientas de documento.
• La barra de representación de estilos.
•La barra de navegación con navegador.

5. PANTALLA INICIAL :
En esta pantalla nosotros elegimos lo que queremos o no
que se vea en ella; la pantalla inicial de este software es
diferente a cualquier otra, al abrirla podremos observar sus
componentes.

6. Las barras:
 La barra de la aplicación:
Es la barra que contiene el menú, 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 por lo general
aparecen junto al icono que identifica al Dreamweaver CS5
(Dw) estos nos permiten modificar la vista de diseño o
código, acceder a extensiones que se pueden añadir.
Al hacer clic en insertar veremos las operaciones
relacionadas con los diferentes elementos que podemos
agregar en Dreamweaver CS5.

7. Las pestañas de documento:
Estas pestañas nos permiten tener mas de un
documento abierto, en los cuales evidenciara el
nombre del archivo abierto, los archivos a los cuales les
aparezca un asterisco (*) es por que tiene cambios
pendientes por guardar.
Debajo de la pagina encontraremos los archivos que
utiliza la pagina como lo son: la hoja de estilos,
archivos JavaScript, ect…; a los cuales podemos acceder
con un clic, ahorrándonos tiempo.

8. La barra de estado:
Nos da información sobre los documentos y se
encuentra ubicada debajo de este. Nos sirve para
seleccionar etiquetas completas y poder
desplazarnos con facilidad por la pagina.
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.
Esta barra puede ser muy útil, a un que es mas frecuente el
uso de esta por el teclado.

9. La barra de herramientas de documento:
Es la 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 representación de estilos:
Es la barra menos utilizada nos permite ver la apariencia de
nuestra web en distintos dispositivos.
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

10. Los Hiperenlaces:
Son un elemento esencial en toda pagina web, esto no es
mas que crear un enlace con una pagina; estos pueden ser
puestos en imágenes ,textos ect… .
Cuando creamos un enlace lo que hacemos es etiquetarlo
el HTML se encarga de definirlos.

11. HTML desde Dreamweaver:
Esta basado en etiquetas que marcan el comienzo y el fin de
cada elemento en la pagina web.
Etiquetas:
Las etiquetas consisten en poner un mismo comando
entre los símbolos < y >. La primera etiqueta indica
inicio, y la segunda, que incluye el símbolo /, indica
final y se suele denominar etiqueta de cierre.

12. Maquetación web(diseño de la
pagina)
La maquetación es la distribución de los elementos en la
pagina web, son los que logramos identificar con mas
claridad en la pagina
Tamaño:
Por lo general, la maquetación se realiza sobre elementos en
bloque. Normalmente divisiones, pero también lo podemos
hacer con párrafos, listas, o con el propio body. los elementos de
bloque ocupan todo el ancho del elemento que lo contiene, y su
alto se ajusta al contenido.
Cualquier elemento HTML de bloque, tiene dos atributos que
pueden definir su tamaño: ancho (width) y alto (height).