MEDIAactive - Aprender Dreamweaver CS4 con 100 ejercicios prácticos

IMPORTANTE

Los enlacespermiten la navegación, conectan las páginas con otras, y suelen presentarse con aspecto de texto subrayado.

1 Con el documento muestra.html abierto en Dreamweaver, despliegue el menú Ver y seleccione la opción Contenido de Head. (Puede encontrar este archivo en nuestra página de descargas).

2 Aparece la representación visual de la sección head bajo la barra de herramientas Documento . Para mostrar el código correspondiente, haga clic en el botón Dividir de esa barra.Los iconos para acceder al contenido de Head aparecen bajo la Barra de herramientas Documento.

3 Dreamweaver muestra un icono por cada uno de los elementos de la sección head. Seleccione el primero.

4 La etiqueta correspondiente, title, se selecciona . El primer elemento de la cabecera es, por tanto, el título del documento y consta de una sola propiedad, Título, que se muestra ya en el Inspector de propiedades. Seleccione mediante el arrastre la expresión Documento sin título, que aparece en el cuadro Título de la barra de herramientas Documento. Puede cambiar el título de su página escribiéndolo directamente en la etiqueta del código o bien en el campo Título de la Barra de herramientas Documento o del Inspector de propiedades.

5 No debe confundirse el título de la página con el nombre del archivo. El título se muestra en la Barra de título del navegador cuando se visualiza la página publicada. Escriba la palabra prueba y pulse la tecla Retorno para confirmar el cambio.

6 Haga clic en el segundo icono de la sección head. La codificación del documento se almacena en una etiqueta meta en el área de encabezado del documento. Esta información, que consta de tres propiedades, queda establecida automáticamente durante la generación del documento, en función del formato que éste presente.

7 La codificación del documento se almacena en una etiqueta meta en el área de encabezado del documento . Indica al navegador cómo se debe descodificar el documento y qué fuentes se deben utilizar para mostrar el texto descodificado. Seleccione el tercer elemento de la sección head.

8 Esta sección se completa con un estilo CSS que define atributos de formato de los elementos contenidos en el cuerpo de la página. Haga clic en el botón Diseño de la barra de herramientas Documento, pulse el icono Ver opciones, el cuarto empezando por la derecha, y haga clic en la opción Contenido de Head. Para ocultar el Contenido de Head, desactive esa opción en el menú de opciones de la Barra de herramientas Documento.

9 Nuestra página de ejemplo cuenta con algunos de los elementos clásicos que conforman una página web. Haga doble clic, en la ventana del documento, sobre la palabra Página.

10 El panel Propiedades presenta los atributos del texto actualmente seleccionado. Los enlaces son otro de los elementos principales de las páginas. Seleccione con un doble clic la palabra Pulse.

11 El texto definido como enlace aparece en el campo Vínculo. Los enlaces también pueden añadirse a imágenes. Seleccione la imagen para ver sus propiedades y dar por acabado el ejercicio.En este caso, el texto seleccionado enlaza con la página principal del sitio de la empresa desarrolladora de este manual, MEDIAactive.

Las imágenes también son un componente fundamental de las páginas, ya que las dotan de un mayor atractivo. Otros componentes pueden ser tablas, sonidos, vídeos y diversos tipos de elementos multimedia.

IMPORTANTE

Las ayudas visuales,activas por defecto, facilitan la realización de algunas acciones. Para desactivarlas puede optar por utilizar el comando Ocultar tododel submenú Ayudas visuales del menú Ver o acudir al menú emergente del botón Ayudas visuales y activar la opción Ocultar todas las ayudas visuales.

PUEDE GUARDAR LOS DOCUMENTOS de Dreamweaver con el nombre y ubicación predefinidos por el programa o modificarlos desde el cuadro de diálogo Guardar como. Los comandos relativos al almacenado de documentos son accesibles desde el menú Archivo y las funciones habituales de copia, pegado, etc., se encuentran en el menú Edición.

IMPORTANTE

El comando Deshaceranula la última acción realizada y el comando Rehacerla recupera. Ambos se encuentran en el menú Edición y en la Barra de herramientas Estándar de Dreamweaver.

1 En el ejercicio anterior hemos utilizado el documento HTML muestra, que ha sido modificado. Por eso aparece un asterisco en su pestaña. El método más sencillo para almacenar los cambios efectuados en un documento consiste en la ejecución del comando Guardar desde el menú Archivo. Este comando puede ser ejecutado directamente mediante la combinación de teclas Ctrl.+S. Abra el menú Archivo y pulse en el comando Guardar.

2 El programa guarda los cambios efectuados, conservando la ubicación original y el nombre del documento. La opción Guardar se ve complementada por los comandos Guardar como, Guardar todo, Guardar en servidor remoto y Guardar como plantilla. Abra el menú Archivo y elija la opción Guardar como. El cuadro Guardar como, al que se accede usando esa opción del menú Archivo, es similar al cuadro Abrir y permite seleccionar el directorio en el que se almacenará el archivo. Para ello presenta el cuadro desplegable Guardar en y el panel de accesos directos. Además permite el cambio del nombre del documento.