Está en la página 1de 15

Guia del Usuario Revista Compus

Prácticas DreamWeaver

PRÁCTICA 1: TEXTOS
1. Crea una nueva página en el sitio EJEMPLO1, y la guardamos con el nombre TEXTO1.
2. Escribe directamente en ella este texto:
Sabías que...
... el refrán " en las manos de un idiota ni la pólvora arde " viene de las guerras
napoleónicas.
Al parecer el mismo Napoleón Bonaparte profirió esta frase a propósito del general Hardrick
Von Jaun, comandante del ejercito austrohúngaro, tras arrasar al ejercito aliado en la batalla
de Jena.
Lo curioso es que Bonaparte, en sus años de academia militar en Lyon, era conocido como
el cadete "Oblique" (oblicuo) por sus sucesivos errores en las prácticas de artillería.
3. Aplica a la primera línea un Encabezado1 y a la segunda un Encabezado2.
4. Selecciona el último párrafo.
5. Corta el párrafo seleccionado y lo pegas por encima del anterior.
6. Convierte los dos últimos párrafos en una lista ordenada.
7. Cambia la lista ordenada a Lista sin ordenar.
8. Aplica la fuente Arial a los elementos de la lista.
9. Aplica color azul oscuro a los encabezados.
10. Convierte en párrafos normales los elementos de la lista, y sángralos una vez.
11. Aplica un color de gris al fondo de la página.
12. Guardamos los cambios.
13. Finalmente visualiza el resultado en el navegador.

Prof. José de La Rosa Página 1


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 2: ENLACES DE PÁGINAS


1. Crea una página nueva llamada INDEX en un sitio nuevo, que se llame EJEMPLO2. Ésta va
a ser la página principal. Acostúmbrate a llamar a las páginas principales de esta forma
(index.htm). Es un método utilizado universalmente por los servidores para reconocer la
página inicial de un sitio web.
Con el siguiente esquema vamos a enlazar mediante vínculos cada una de las páginas,
según indican las flechas. Para ello crea las páginas necesarias y escribe los textos que
consideres oportunos para cada uno de los enlaces.

NOTAS
El contenido de la información de la energía eólica tiene la siguiente estructura:
• Parques eólicos= parqueseolicos.htm
• ¿Cómo funciona un aerogenerador? = saberaero.htm
El contenido de la información de la energía solar se va ha componer de dos apartados con sus
dos páginas:
• Conexión directa a red = conexión.htm
• ¿Cómo funciona una célula fotovoltaica? = sabercelula.htm
El contenido de la información de los productos es similar.

Prof. José de La Rosa Página 2


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 3: TABLAS ANIDADAS


2. Crea las siguientes tablas, en una página nueva dentro de tu sitio EJEMPLO 1. Guarda la
página con el nombre TABLAS01.

NOTAS
Para poner el tamaño de texto a 2, haz clic en el menú Texto y en la opción Tamaño y clic en 2. Si
está desactivado esto último, haz clic en el menú Edición y en la opción Preferencias y en la
categoría General, desactiva la casilla Utilizar CSS en lugar de etiquetas HTML. Y haz clic en el
botón Aceptar.

Prof. José de La Rosa Página 3


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 4: HIPERVINCULOS DE ANCLAJE


3. Crea una página nueva HTML en el sitio EJEMPLO1. Guarda la página con el nombre
ROLLO2.
4. Escribe y copia un texto cualquiera hasta rellenar varias pantallas.
5. Inserta los siguientes títulos, con el formato Encabezado 2, en tu página:
PRINCIPIO
DESARROLLO DEL TEMA
CONCLUSIONES
6. Inserta 3 puntos de anclaje, que coincidan con los títulos anteriores:
Pon el nombre PRINCIPIO al primer anclaje.
Pon el nombre DESARROLLO al segundo anclaje.
Pon el nombre CONCLUSIONES al tercer anclaje.
7. Ahora, crea 2 hipervínculos al comienzo de la página, con los siguientes textos:
Para ir al Desarrollo del tema, haz clic aquí.
Para ir a las conclusiones del tema, haz clic aquí.
8. Por último, crea un hipervínculo al final de la página, que “salte” al principio de la página.
9. Guarda todos los cambios y comprueba que funcionan los hipervínculos.

Prof. José de La Rosa Página 4


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 5: TABLAS
10. Crea un sitio nuevo con el nombre PRACTICA05.
11. Crea 4 páginas nuevas HTML. Guárdalas con los nombres INDEX, HISTORIA,
CONCEPTOS y SERVICIOS.
12. En la página INDEX haz el siguiente diseño:

El título está escrito en la fuente Arial, Helvética, sans-serif, con el formato Encabezado 1 y
está centrado.
La tabla tiene 3 columnas de 170 píxeles de ancho cada una y 1 fila de 145 píxeles de alto.
El grosor del borde es 1 píxel. Está centrada.
Los hipervínculos están escritos en la fuente Arial, Helvética, sans-serif, con el formato
Párrafo. Están centrados.
13. En la página HISTORIA haz el siguiente diseño:

El título está escrito en la fuente Arial, Helvética, sans-serif, con el formato Encabezado 1.

Prof. José de La Rosa Página 5


Guia del Usuario Revista Compus
Prácticas DreamWeaver

La tabla está al 90 %, la primera columna está al 13% y la segunda columna está al 87%.
Tiene 10 filas. El grosor del borde es 1 píxel.
El texto de la primera columna está escrito en la fuente Arial, Helvética, sans-serif en
negrita y con color rojo. Está centrado.
El texto de la segunda columna está escrito en la fuente Arial, Helvética, sans-serif.
14. En la página SERVICIOS crea el siguiente diseño:

La tabla y los textos tienen las mismas propiedades que en la página HISTORIA. (Puedes
copiar y pegar la tabla).
15. En la página CONCEPTOS crea el siguiente diseño:

La tabla y los textos tienen las mismas propiedades que en la página HISTORIA. (Puedes
copiar y pegar la tabla).
16. En el menú Modificar, en la opción Propiedades de la página y en la categoría Aspecto,
puedes cambiar el color de fondo de la página y poner un título.
17. Pon un hipervínculo en las páginas de HISTORIA, SERVICIOS y CONCEPTOS para que
vuelvan a la página INDEX.

Prof. José de La Rosa Página 6


Guia del Usuario Revista Compus
Prácticas DreamWeaver

18. Pon un hipervínculo para enviar un e-mail a hugo3385@hotmail.com.


19. Guarda todo y comprueba los hipervínculos.

Prof. José de La Rosa Página 7


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 6: DISEÑO DE TABLAS


1. Crea un sitio nuevo con el nombre PRACTICA06.
2. Crea una página nueva HTML. Guárdala con el nombre INDEX.
3. Escribe el título MIS SEIS WEBS IMPRESCINDIBLES. Está escrito en la fuente Arial, Helvética,
sans-serif, con el formato Encabezado 1 y está centrado, dentro de una tabla centrada de 750 x
110. Usa el botón Estándar para escribir.
4. Diseña una tabla de 750 x 260.
5. Busca una imagen que te guste. Puedes usar www.google.com Cópiala en tu sitio web.
6. Inserta una celda en la tabla anterior. Inserta dentro de la celda la imagen.
7. En la otra celda de la tabla, escribe los siguientes vínculos:
Alerta antivirus www.alerta-antivirus.com
Diccionarios online www.diccionarios.com
Descarga de software - Softonic www.softonic.com
Viajes - Guía Michelín www.michelin.com
Información de teléfonos www.paginasamarillas.es
Enciclopedia Wipipedia es.wikipedia.org
Los hipervínculos están escritos en la fuente Arial, Helvética, sans-serif, con el formato Párrafo.
Están centrados.
8. Pon un hipervínculo para enviar un e-mail a hugo3385@hotmail.com, con el formato Párrafo y
la fuente Arial, Helvética, sans-serif , en la parte inferior derecha de la página.
9. Guarda todo y comprueba los hipervínculos.

Hugo

Prof. José de La Rosa Página 8


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 7: GALERIA DE IMÁGENES


En esta práctica vamos a crear una galería de imágenes. Se trata de crear una página principal con
las imágenes “pequeñas” y, después, una página separada por cada imagen “original-grande”. Se
hace esta separación para que la carga de la galería no sea excesivamente lenta.

1. Crea una página nueva HTML con el nombre INDEX, en un sitio nuevo con el nombre
PRACTICA07.
2. Busca en www.google.com seis imágenes que te gusten. Guarda cada imagen en una carpeta
de imágenes de tu sitio web.
3. Usa el menú Comandos y la opción Crear álbum de fotos web.
4. Rellena el cuadro de diálogo Crear álbum de fotos web:
a. En la casilla Título del álbum de fotos escribe: MIS SEIS FOTOS PREFERIDAS
b. En la casilla Información de subencabezado escribe: UNA IMAGEN VALE MAS QUE
MIL PALABRAS.
c. En la casilla Otra información escribe: PRACTICA 7 DEL CURSO.
d. En la casilla Carpeta de imágenes de origen, selecciona con el botón Examinar tu
carpeta de imágenes que has buscado en google.
e. En la casilla Carpeta de destino, selecciona la carpeta de tu sitio web.
f. Las demás opciones del cuadro puedes dejarlas como están.
g. Pulsa el botón Aceptar.
5. Guarda todos los cambios y comprueba los resultados en el navegador.

Prof. José de La Rosa Página 9


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 8: REPASO
Definir el sitio Web y establecer propiedades de página
1. Cada práctica debe hacerse paso a paso, y en el mismo orden “sin saltos”.
2. Crea un sitio local con el nombre DEPORTES, en tu carpeta Mis documentos.
3. Crea una página HTML con el nombre INDEX y modifica las propiedades de página (menú
Modificar). En el título escribe ¿Quiénes somos?, en el color de fondo selecciona el color
#99CCCC y el color de texto será #003333.
4. Guarda los cambios y cierra la página.
Modificar las propiedades de texto
1. Crea una página HTML con el nombre INSTALACIONES, en el sitio DEPORTES.
2. Escribe en la primera línea el texto NUESTRAS INSTALACIONES.
3. Selecciona el formato Encabezado 1 al texto NUESTRAS INSTALACIONES.
4. Escribe 6 líneas describiendo las instalaciones, con una lista sin ordenar (menú Texto).
5. Pon 2 sangrías a la lista anterior (menú Texto).
6. Guarda los cambios y cierra la página.
Inserta imágenes
1. Abre la página INSTALACIONES.
2. Busca en www.google.es una imagen de deportes. Guarda la imagen en la subcarpeta
IMAGENES (Si no existe créala) de DEPORTES.
3. Inserta la imagen anterior a la derecha del texto de las instalaciones.
4. Guarda los cambios y cierra la página.
Formatos de tablas
1. Crea una página HTML con el nombre RESERVAS, en el sitio DEPORTES.
2. Crea la siguiente tabla y selecciona algún formato de tabla (menú Comandos).

ACTIVIDAD PRECIO/HORA

AEROBIC 3€

CARDIO

PESAS 4€

3. Guarda los cambios y cierra la página.


Crear hipervínculos
1. Crea una página HTML con el nombre QUIEN, en el sitio DEPORTES.
2. Crea un hipervínculo a http://es.sports.yahoo.com en la página QUIEN. Utiliza el destino
_blank (en el panel Propiedades) para que se abra en una ventana nueva del navegador.
3. En la página INDEX, crea un hipervínculo para cada página del sitio.
4. Guarda los cambios y cierra la página.

Prof. José de La Rosa Página 10


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 9: REPASO
1. Crea un sitio local con el nombre PRACTICA 10.
2. Crea una página HTML nueva y modifica las propiedades de la página para poner un
color de fondo #00FFCC.
3. Escribe como título RECETAS en el título de la página.
4. Guarda la página con el nombre INDEX.
5. Escribe el título RECETAS DE LA ABUELA, con el formato Encabezado 1, centrado y
con la fuente Courier New, Courier, mono.
6. Crea otra página HTML con el nombre CONSEJOS. Inserta la siguiente tabla:

CONSEJOS
Uno de los métodos más empleados en la cocina consiste en sumergir los
alimentos en un recipiente con agua y aplicar calor durante un tiempo,
hasta que estén cocidos. En ocasiones los distintos elementos se agregan
al agua fría, como es el caso de hortalizas frescas, legumbres
ablandadas, pescados, carne para caldo, huevos, etc., mientras que en
otras ocasiones, se añaden cuando el agua está en ebullición: pasta,
arroz, algunas verduras, la carne del cocido, etc.

Tiempos de cocción Minutos


Alcachofas 20-30
Apio 30-40
Calabacines 20-30
Calabaza 30-40
Cardos 45-50
Cebollas 25-30
Coles de Bruselas 20-25
Coliflor 15-20
Escarola 15-20

7. La fuente es Courier New, Courier, mono.


8. Escribe el texto CONSEJOS PRACTICOS en el título de la página.
9. Guarda los cambios.
10. Crea un menú de salto, con la siguiente lista:
El mundo de las recetas http://www.mundorecetas.com
Recetas tradicionales http://www.recetas.net
Recetas internacionales http://www.arecetas.com
Recetas españolas http://www.acocinar.com/recetas.htm
11. Crea una barra de navegación, con dos imágenes ( imagen arriba y sobre imagen).
Pon un hipervínculo que salte a la página de consejos.
12. Inserta una dirección de e-mail para solicitar más información (mailto:)

Prof. José de La Rosa Página 11


Guia del Usuario Revista Compus
Prácticas DreamWeaver

13. Inserta una tabla de 2 columnas y 10 filas en la página INDEX, con las recetas más
populares. Elige algún formato de tabla a tu gusto.
14. Guarda todos los cambios y comprueba los resultados en el navegador.

Prof. José de La Rosa Página 12


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 10: MARCOS

1. Crea un sitio Web, con el nombre PRACTICA 12, donde la página principal esté dividida en
3 marcos; el marco superior para el título TIENDAS DE MUSICA ONLINE, otro marco a la
izquierda con los hipervínculos, y el marco principal, que muestre el contenido de cada
hipervínculo de las tiendas de música online.
2. Las páginas de los marcos deben estar diseñadas con las siguientes propiedades:
a. El fondo de la página del marco principal debe contener una imagen o un color de
fondo.
b. El marco superior debe tener el título con Encabezado 1, con el tipo de letra y el
color que quieras.
3. Los hipervínculos del marco izquierdo deben estar diseñados con las siguiente propiedades:
a. Los párrafos deben estar con el tipo de letra y color que elijas. La alineación debe
ser centrada.
b. Los hipervínculos son:
Terra Música Premium http://musicapremium.terra.es/index.cfm
MSN Music http://music.msn.es
Wanadoo Jukebox http://jukebox.ritmic.com
Apple iTunes Music Store http://www.apple.com/es/itunes/store
4. Modifica las propiedades de los bordes de los marcos, para que se visualicen como tú
elijas.
5. Guarda todo y comprueba los resultados en el navegador.

Prof. José de La Rosa Página 13


Guia del Usuario Revista Compus
Prácticas DreamWeaver

Prof. José de La Rosa Página 14


Guia del Usuario Revista Compus
Prácticas DreamWeaver

PRÁCTICA 13: GALERIA DE IMÁGENES Y MARCOS

En esta práctica vamos a crear una galería de imágenes. Se trata de crear una página principal con
las imágenes “pequeñas” y, después, una página separada por cada imagen “original-grande”. Se
hace esta separación para que la carga de la galería no sea excesivamente lenta.

6. Crea una página nueva HTML con el nombre INDEX, en un sitio nuevo con el nombre
PRACTICA13.
7. Diseña marcos, en la página INDEX.
8. En la página INDEX, escribe el texto GALERIA DE IMÁGENES con el formato Encabezado 1,
centrado y con la fuente Arial, Helvética, sans-serif. Debajo de este texto, escribe el texto ¡HAZ
CLIC EN CADA IMAGEN PARA AMPLIARLA!, con el formato Encabezado 2, centrado y la
fuente Arial, Helvética, sans.serif.
9. En el marco de la izquierda, inserta la imagen PUESTA DE SOL, de la carpeta IMAGENES DE
MUESTRA. Copia la imagen dentro de tu sitio en una carpeta de imágenes. Si es necesario
crea la carpeta de imágenes. En la imagen anterior, cambia el ancho a 80 píxeles y el alto a 60
píxeles.
10. Debajo de PUESTA DE SOL, inserta la imagen COLINAS AZULES, de la carpeta IMAGENES
DE MUESTRA. Copia la imagen dentro de tu sitio en una carpeta de imágenes. En la imagen
anterior, cambia el ancho a 80 píxeles y el alto a 60 píxeles.
11. Debajo de COLINAS AZULES, inserta la imagen INVIERNO, de la carpeta IMAGENES DE
MUESTRA. Copia la imagen dentro de tu sitio en una carpeta de imágenes. En la imagen
anterior, cambia el ancho a 80 píxeles y el alto a 60 píxeles.
12. Debajo de INVIERNO, inserta la imagen NENUFARES, de la carpeta IMAGENES DE
MUESTRA. Copia la imagen dentro de tu sitio en una carpeta de imágenes. En la imagen
anterior, cambia el ancho a 80 píxeles y el alto a 60 píxeles.
13. Crea 4 hipervínculos para que cada imagen del marco izquierdo, se abra en el marco principal.
14. Guarda todos los cambios y visualiza el resultado en el navegador.

Prof. José de La Rosa Página 15

También podría gustarte