Diseño web: Estructura, contenido y elementos interactivos con Dreamweaver

Diseño de la estructura de un sitio web con página principal y subpágina

Creación del sitio en Dreamweaver

1. Abre Dreamweaver y selecciona la opción "Dreamweaver Site".
2. Crea una carpeta de PROYECTO donde organizarás toda tu información (imágenes, animaciones, etc.).
3. En "Site Name", escribe el nombre de tu empresa.
4. En "Local Site Folder", selecciona tu carpeta de PROYECTO y haz clic en "Save".
5. En "Local Files", aparecerá la carpeta de tu empresa. Haz clic derecho y selecciona "New File".
6. Nombra la primera página como "INDEX" y las demás según el contenido que desees.

Organización del contenido de una página mediante tablas

1. Haz clic en "Insertar" > "Tabla" y selecciona las columnas y filas que necesites.

Personalización de bordes y relleno de celdas en una tabla

• En el campo "Borde", especifica el ancho del borde de la tabla en píxeles.
• Utiliza el campo "Color de borde" para seleccionar un color para toda la tabla.
• Utiliza las opciones "Color de fondo" para establecer la imagen o color de fondo de la tabla.

Manejo eficiente de filas, columnas y celdas (combinar y dividir)

• En las opciones de celda, en "Horizontal" o "Vertical", indica cómo quieres alinear el contenido.
• En las opciones de "Disposición", encontrarás las opciones para combinar o dividir celdas.

Creación de animaciones en Flash

Personalización del escenario

• Ajusta el escenario a un tamaño acorde a la figura o a la dimensión del espacio en las propiedades.

Guardar la animación en formato SWF

1. Cuando la animación esté terminada, presiona Ctrl+Enter para probarla.
2. Guarda la animación. Aparecerán dos archivos: uno rojo y uno blanco. El blanco es el que contiene la animación.
3. Para insertar la animación, haz clic en "Insertar" > "Media" > "SWF".

Inserción de imágenes con el formato de compresión adecuado

1. Haz clic en "Insertar" > "Imagen" y selecciona la imagen.
2. Haz clic en "Editar" y en "Formato", selecciona JPEG.

Inserción de vínculos mediante anclas

1. Selecciona la imagen que será el botón para el hipervínculo.
2. En la parte inferior de Dreamweaver, en "Propiedades", busca la opción "Link".
3. Selecciona la opción "Ancla" y arrástrala al archivo al que quieres que se dirija el vínculo.

Inserción de vínculos a correo electrónico

1. Posiciónate donde quieras insertar el vínculo.
2. Ve a la barra de herramientas y haz clic en "Insertar" > "Enlace".
3. Selecciona "Email" como tipo de enlace.
4. Escribe la dirección de correo electrónico, inserta el vínculo y guárdalo.

Inserción de vínculos mediante barras de navegación (Rollover Image) o imágenes

1. Haz clic en "Insertar" > "Rollover Image".
2. Selecciona la imagen que se mostrará cuando el mouse esté encima.

Aplicación de fondos, tipos de letras y colores

Utiliza colores que representen a tu empresa y que sean apropiados para la audiencia. Combina los colores de manera armoniosa y que transmitan la formalidad deseada. Las imágenes deben ser atractivas y llamar la atención de la audiencia.

Diseño de un formato profesional

Organiza la información de forma clara y atractiva utilizando tablas sin bordes. El diseño debe ser atractivo y fácil de entender. Las imágenes deben ser relevantes y de alta calidad para captar la atención de la audiencia.