Este documento describe las características y funcionalidades de Adobe Dreamweaver, un programa de edición de sitios web. Dreamweaver permite diseñar páginas profesionales utilizando hojas de estilo, JavaScript, multimedia y más. Ofrece sugerencias de código, compatibilidad con CMS, inspección de CSS y compatibilidad con Browserlab de Adobe. El documento también explica elementos de formularios como campos de texto, áreas de texto y botones, así como tipos de rutas de enlace.

1. Escuela normal superior del distrito de barranquilla
Trabajo de : informática
Presentado por : Alexia Bethel
Presentado a : Analida Carvajal
Curso :11°d

2. Adobe Dreamweaver es una aplicación en forma de estudio
(basada en la forma de Adobe Flash) enfocada a la construcción
y edición de sitios y aplicaciones Web basados en estándares.
Creado inicialmente por Macromedia (actualmente producido
por Adobe Systems). Es el programa de este tipo más utilizado
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. Su principal competidor es
Microsoft Expression Web y tiene soporte tanto para edición de
imágenes como para animación a través de su integración con
otras. Hasta la versión MX, fue duramente criticado por su
escaso soporte de los estándares de la web, ya que el código que
generaba era con frecuencia sólo válido para Internet Explorer, y
no validaba como HTML estándar. Esto se ha ido corrigiendo en
las versiones recientes.

3. Cumple perfectamente el objetivo de diseñar páginas con
aspecto profesional, y soporta gran cantidad de tecnologías,
además muy fáciles de usar:
Hojas de estilo y capas
Java script para crear efectos e interactividades
Inserción de archivos multimedia...

4. Sugerencias de código. Ahora las sugerencias de código incluyen nuestras clases personalizadas,
y los comandos y funciones propios de los distintos CMS soportados.
Integración Adobe Browserlab. Adobe Browser Lab es un servicio en línea de Adobe, que nos
permite comparar cómo se ve una misma página web en las distintas versiones de Internet Explorer,
Firefox y Safari, bajo los sistemas operativos de Windows o Mac OS.
Compatibilidad con CMS integrada. Un sistema de gestión de contenidos (en inglés Content
Management System, abreviado CMS) es in interfaz o programa que nos permite gestionar el contenido
de un sitio web. Cada vez son más usados, y ahora Dreamweaver integra con los principales, permitiendo
crear nuestras páginas con la estructura adecuada.
Inspeccionar CSS. Ahora, con la opción Inspeccionar, podemos ver claramente los márgenes aplicados
al elemento seleccionado, y qué propiedades le afectan, tanto si son propias, como heredadas de los
elementos padre.

5. Características del texto
Lista:
Estos botones permiten crear listas con viñetas o listas numeradas. Veremos qué son las
listas en el siguiente apartado.
Sangría:
Estos dos botones permiten sangrar el texto y anular la sangría. La sangría es una
especie de margen que se establece a ambos lados del texto. En este caso los
botones se refieren a sangría a la izquierda del texto.
Si lo aplicamos sobre texto normal, lo encerrará en una
etiqueta <blockquote></blockquote>, que por defecto se muestra indentada hacia la
derecha. En cambio, al aplicarlo sobre una lista, creará una sublista dentro de ésta.
Formato:
Permite seleccionar un formato de párrafo ya definido para HTML, que puede ser
encabezado, párrafo o formato predeterminado. Los encabezados se utilizan para
establecer títulos dentro de un documento. El formato predeterminado sirve para que
el texto aparezca tal cual ha sido escrito, por ejemplo, si entre dos palabras se
introducen varios espacios solo se considera uno, pero al establecer el formato
predeterminado se respetará que hayan varios espacios en lugar de solo uno. El texto
normal, debería ir siempre en párrafos, salvo que esté en otros elementos, como
tablas o listas.
Es importante emplear correctamente los encabezados, ya que se organizará mejor el
contenido de nuestra web, y es importante de cara a buscadores y visitantes. No te
preocupes por cómo se muestran esos encabezados, recuerda que siempre
podremos personalizarlo.

6. Existen diferentes clases de rutas de acceso a la hora de definir los vínculos. Estas referencias no
se limitan a los enlaces, se comportarán igual cuando indiquemos la ubicación de una imagen, de un
archivo Flash, de la hoja de estilo, etc.
Referencia absoluta:
Conduce al sitio en el que se encuentra el documento utilizando la ruta completa del archivo,
incluyendo el protocolo http://.
Por ejemplo, http://www.aulaclic.com, o http://www.misitio.com/seccion2/pagina1.html.
La referencia absoluta es independiente de la ubicación de la página que contiene el enlace, y será
válida siempre que no cambie la ubicación del archivo enlazado. Es la opción obligatoria si
pretendemos enlazar a archivos fuera de nuestro sitio (enlaces externos).
Referencia relativa al documento (por defecto):
La ubicación del archivo enlazado se toma en relación con la ubicación del la página. Es decir,
partimos de la carpeta en la que se encuentra el documento.
Si queremos enlazar con una página o archivo dentro de la misma carpeta, no tenemos más que
utilizar su nombre. Por ejemplo, pagina2.htm.
Si está en una subcarpeta de la página actual, no tenemos más que indicar el nombre de la carpeta
antes del archivo, y separarlos por una barra (/). Por ejemplo imágenes/miimagen.gif.
Si queremos referirnos a carpetas que están por encima del nivel donde nos encontramos
deberemos utilizar ../

7. Por ejemplo, imagina que estamos en la siguiente
dirección http://www.misitio.com/pagina/informacion/index.html. En esta página queremos
mostrar una imagen que se encuentra en la
carpeta http://www.misitio.com/pagina/secciones/seccion1.html, ¿cómo podemos hacerlo?
Fácil. Deberemos llamarla haciendo referencia al nivel superior (http://www.misito.com/pagina/)
para poder ir luego a la carpeta secciones.
El resultado de la ruta sería el siguiente: ../secciones/seccion1.html.
De esta forma, mientras nos encontramos en la carpeta información, subimos un nivel y luego nos
movemos dentro de la carpeta secciones para mostrar el archivo seccion1.html.
Esta opción depende de la ubicación del archivo, y pueden no funcionar correctamente si alteramos
la estructura de carpetas.
Esta es la opción por defecto de Dreamweaver, y es la forma más habitual para enlazar archivos
dentro del sitio.

8. Formulario
Los elementos de formulario pueden insertarse en una página a través del
menú Insertar, opción Formulario, o lo que es más cómodo si vamos a insertar
varios elementos, desde el panel Insertar en la sección Formularios.
A través de esta opción se puede acceder a la lista de todos los objetos de formulario
que pueden ser insertados en la página.
Vamos a ver uno por uno algunos de los distintos elementos que pueden formar parte de
un formulario, así como algunas de sus propiedades.
Campo de texto y Área de texto
Permiten introducir texto. El Campo de texto solo permite al usuario escribir una línea,
mientras que el Área de texto permite escribir varias.
Se puede pasar de Campo de texto a Área de texto a través del inspector de
propiedades, marcando la opción Una línea o Multi línea respectivamente.
También es posible definirlo como Contraseña es como el campo de texto pero las
letras que va tecleando el usuario se sustituyen por un carácter como podrás ver en
la imagen siguiente.
A continuación tienes un ejemplo de cada uno de estos tres tipos. Puedes escribir en
ellos para ver su funcionamiento.
A través del inspector de propiedades es posible asignar también el Ancho del cuadro de texto, el número máximo de
líneas o caracteres, y el valor inicial del cuadro.

9. Botón
Es el botón tradicional de Windows. El botón puede tener asignadas tres opciones: Enviar
formulario, Restablecer formulario (borrar todos los campos del formulario), o Ninguna (para
poder asignarle un comportamiento diferente de los dos anteriores).
También es posible cambiar el texto del botón, a través de la propiedad Valor del inspector de
propiedades.

10. Ventana principal de dreamweaver