UNIVERSIDAD TECNOLOGICA DE IZUCAR DE MATAMOROS

PROFESORA: RUBICELL PINEDA TELLEZ

ALUMNO: LAURO ROSAS HERNANDEZ

MATERIA: DESARROLLO DE APLICACIONES WEB I

GRUPO: 3E

AREA DE TRABAJO DE DREAMWEAVER

1.- HIPERVÍNCULO: El comando Hipervínculo permite crear un vínculo de texto hasta una imagen, un objeto u otro documento o archivo.

Para añadir un hipervínculo mediante el comando Hipervínculo:

Sitúe el punto de inserción en el documento donde desea que aparezca el hipervínculo.

Siga uno de estos procedimientos para mostrar el cuadro de diálogo Insertar hipervínculo:

Seleccione Insertar>Hipervínculo.

En la categoría Común de la barra Insertar, haga clic en el botón Hipervínculo.

DESARROLLO DE APLICACIONES WED l

2

3

4

5

6

7 9

8 1

1

1

1

AREA DE CAPTURACION DE CODIGO

AREA DE DISEÑO

2.- VÍNCULO DE CORREO ELECTRÓNICO: Para crear un vínculo de correo electrónico utilizando el comando Insertar vínculo de correo electrónico:

1. En la vista Diseño de la ventana de documento, coloque el punto de inserción donde desea que aparezca el vínculo de correo electrónico o seleccione el texto o la imagen que desea que aparezca como vínculo de correo electrónico.

2. Siga uno de estos procedimientos para insertar el vínculo:o Seleccione Insertar > Vínculo de correo electrónico.o En la categoría Común de la barra Insertar, haga clic en el botón

Insertar vínculo de correo electrónico.

Aparecerá el cuadro de diálogo Vínculo de correo electrónico.

3.- ANCLAJE CON NOMBRE: Para crear un vínculo con un anclaje con nombre, siga este procedimiento de dos pasos. En primer lugar, cree un anclaje con nombre. A continuación, cree un vínculo con dicho anclaje.

Para crear un anclaje con nombre:

1. En la vista de diseño de la ventana de documento, coloque el anclaje en el lugar donde desea insertar el anclaje con nombre.

2. Siga uno de estos procedimientos: o Seleccione Insertar > Anclaje con nombre. o Presione Control+Alt+A (Windows) o Comando+Opción+A

(Macintosh). o En la categoría Común de la barra Insertar, haga clic en el botón

Anclaje con nombre.

Aparecerá el cuadro de diálogo Anclaje con nombre.

4.- TABLA: Seleccione Insertar>Tabla.

En el cuadro de diálogo Tabla, siga este procedimiento:

o Escriba 3 en el cuadro de texto Filas. o Escriba 1 en el cuadro de texto Columnas. o Escriba 700 en el cuadro de texto Ancho de tabla. o Seleccione Píxeles en el menú emergente Ancho de tabla.

DESARROLLO DE APLICACIONES WED l

o Escriba 0 en el cuadro de texto Grosor del borde. o Escriba 0 en el cuadro de texto Relleno de celda. o Escriba 0 en el cuadro de texto Espacio entre celdas.

Clic en aceptar.

5.- INSERTAR ETIQUETA DIV: Para insertar una etiqueta div:

En la ventana de documento, sitúe el punto de inserción en el lugar donde desea que aparezca la etiqueta div. Siga uno de estos procedimientos:

Seleccione Insertar > Objetos de diseño > Etiqueta Div.

En la categoría Diseño de la barra Insertar, haga clic en el botón Etiqueta Div.

Aparece el cuadro de diálogo Insertar etiqueta Div.

Rellenar el siguiente cuadro.

DESARROLLO DE APLICACIONES WED l

6.- IMAGENES: Para insertar una imagen:

Coloque el punto de inserción en el lugar de la ventana de documento en el que desea que aparezca la imagen y, a continuación, siga uno de estos procedimientos:

En la categoría Común de la barra Insertar, haga clic en el icono Imagen.

En la categoría Común de la barra Insertar, arrastre el icono Imagen a la ventana de documento (o a la ventana de vista Código si está trabajando en el código).

Seleccione Insertar > imagen.

Arrastre una imagen desde el panel Activos (Ventana > Activos) hasta la posición deseada de la ventana de documento. A continuación, siga con el paso 3.

Arrastre una imagen desde el panel Sitio hasta la posición deseada de la ventana de documento. A continuación, siga con el paso 3.

Arrastre una imagen desde el escritorio hasta la posición deseada de la ventana de documento. A continuación, siga con el paso 3.

En el cuadro de diálogo que aparece, siga uno de estos procedimientos:

Seleccione Sistema de archivos para elegir un archivo gráfico.

Seleccione Fuente de datos para elegir un origen de imagen dinámica.

Busque y seleccione el origen de imagen o contenido que desee insertar.

Si está trabajando en un documento que no está guardado, Dreamweaver genera una referencia de archivo:// para el archivo de imagen. Al guardar el documento en cualquier lugar del sitio, Dreamweaver convierte la referencia en una ruta relativa al documento.

Haga clic en Aceptar.

Aparece el cuadro Atributos de accesibilidad de la etiqueta de imagen si se ha activado el cuadro de diálogo en Preferencias

DESARROLLO DE APLICACIONES WED l

7.- MEDIA: Para insertar un objeto multimedia en una página:

Sitúe el punto de inserción en la ventana de documento en la que desea insertar el objeto.

Inserte el objeto siguiendo uno de estos procedimientos:

En la categoría Común de la barra Insertar, haga clic en el botón Media y seleccione el botón para el tipo de objeto que desea insertar.

Seleccione el objeto adecuado en el submenú Insertar > Media.

Si el objeto que desea insertar no es Flash, Shockwave, Applet ni ActiveX, utilice el botón de plug-in de Netscape Navigator (el icono que parece una pieza de puzzle de la barra Insertar) para insertarlo.

8.- FECHA: Para insertar la fecha actual en un documento:

En la ventana de documento, sitúe el punto de inserción en el lugar donde desea insertar la fecha.

Siga uno de estos procedimientos:

Seleccione Insertar>Fecha.

En la categoría Común de la barra Insertar, haga clic en el icono Fecha.

En el cuadro de diálogo que aparece, seleccione el formato de día de la semana, fecha y hora.

Si desea que la fecha insertada se actualice cada vez que guarde el documento, seleccione Actualizar automáticamente al guardar. Si desea que la fecha se convierta en texto normal cuando se inserte y no se actualice automáticamente, desactive esa opción.

DESARROLLO DE APLICACIONES WED l

Hacer clic en Aceptar para insertar la fecha.

9.- SERVER-SIDE INCLUDE: Para insertar un server-side include:

Seleccione Insertar>Server-Side Include.

En el cuadro de diálogo que aparece, localice y seleccione un archivo.

De forma predeterminada, Dreamweaver inserta un include de tipo Archivo.

Para cambiar el tipo del include, seleccione el server-side include en la ventana de documento y cambie el tipo en el inspector de propiedades (Ventana > Propiedades) tal como se indica a continuación:

Si se trata de un servidor Web Apache, elija el tipo Virtual. En Apache, Virtual funciona en todos los casos, mientras que Archivo sólo funciona en algunos casos. Si su servidor es Microsoft Internet Information Server (IIS), elija Archivo. (Virtual funciona con IIS sólo en ciertos casos determinados.)NOTA

Lamentablemente, IIS no le permitirá incluir un archivo en una carpeta de una jerarquía superior a la de la carpeta actual, salvo en el caso de que se haya instalado un software especial en el servidor. Si es necesario incluir un archivo desde una carpeta de una jerarquía superior en un servidor IIS, pregunte al administrador del sistema si está instalado el software necesario.

Para otros tipos de servidores, o si desconoce el tipo de servidor que está usando, pregunte al administrador del sistema la opción que debe emplear.

10.- COMENTARIO: Para insertar un comentario en el punto de inserción:

Seleccione Insertar>Comentario.

En la vista Código, Dreamweaver inserta una etiqueta de comentario y sitúa el punto de inserción en medio de la etiqueta. Escriba el comentario.

DESARROLLO DE APLICACIONES WED l

En la vista Diseño, Dreamweaver muestra el cuadro de diálogo Comentario. Introduzca el comentario y haga clic en Aceptar.

Para ver los marcadores de comentario en la vista Diseño:

Seleccione Ver > Ayudas visuales > Elementos invisibles.

No olvide seleccionar la opción Comentarios en las preferencias de los elementos invisibles ya que, de lo contrario, no aparecerá el marcador de comentario.

insertar en el cuadro siguiente el comentario.

11.- PLANTILLAS:Después de crear una plantilla, puede insertar regiones de plantilla (véase Tipos de regiones de plantillas). También puede definir las preferencias de plantilla en lo que respecta a los colores del código y al color de resaltado de la región de plantilla (véase Personalización de las preferencias de colores de código para una plantilla y Configuración de preferencias de resaltado en regiones de plantillas).

SUGERENCIA

Puede almacenar información adicional sobre una plantilla (como el nombre de su autor, la fecha en que se modificó por última vez o la explicación de algunas decisiones sobre su diseño) en un archivo de Design Notes para la plantilla (véase Asociación de Design Notes a archivos). Los documentos basados en plantilla no heredan las Design Notes de la plantilla.

Para crear una plantilla:

Abra el documento que desea guardar como plantilla:

Para abrir un documento existente, seleccione Archivo > Abrir y seleccione el documento.

DESARROLLO DE APLICACIONES WED l

Para abrir un documento nuevo en blanco, elija Archivo > Nuevo. En el cuadro de diálogo que aparece, seleccione Página básica o Página dinámica, seleccione el tipo de página con el que desea trabajar y haga clic en Crear.

Cuando el documento se abre, siga uno de estos procedimientos:

Seleccione Archivo > Guardar como plantilla.

En la categoría Común de la barra Insertar, haga clic en la flecha del botón Plantillas y, a continuación, seleccione Crear plantilla

12.- SELECTOR DE ETIQUETAS: Haga clic con el botón derecho del ratón (Windows) o, con la tecla Control presionada (Macintosh), haga clic en el texto seleccionado y, a continuación, seleccione Insertar etiqueta en el menú emergente.

Aparecerá el Selector de etiquetas.

En el Selector de etiquetas, expanda la categoría Etiquetas HTML, a continuación Formato y diseño y, por último, General.

En el panel de la derecha aparece una lista de nombres de etiquetas. Seleccione div de la lista.

Haga clic en Insertar. Aparecerá un editor de etiquetas para la etiqueta div. En el editor de etiquetas, seleccione la categoría Hoja de estilos/Accesibilidad e introduzca banner en el cuadro de texto ID.

DESARROLLO DE APLICACIONES WED l

Haga clic en Aceptar para cerrar el editor de etiquetas e insertar la etiqueta.

Dreamweaver inserta la etiqueta div en su página y la ajusta alrededor de la etiqueta de imagen.

Haga clic en Cerrar para cerrar el Selector de etiquetas y guarde la página.

DESARROLLO DE APLICACIONES WED l

REFERENCIAS

HTML HELP: Ayuda de Dreamweaber8

DESARROLLO DE APLICACIONES WED l