I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf.

. 531 - 1123

2 Secundaria

Laboratorio N 1 Dreamweaver Tema Como Ingresar a Dreamweaver

Pasos: 1. Haz doble clic en el cono de acceso directo del programa 2. Esta es la pantalla de bienvenida 3. Desde aqu podemos crear una nueva pgina HTML. 4. Haz clic en HTML 5. As obtenemos un nuevo documento listo para comenzar a trabajar.

Tema Como abrir en Dreamweaver

Pasos: 1. Haz clic en el men archivo 2. Haz clic en abrir 3. Seleccionamos el archivo a abrir 4. Pulsamos el botn abrir

Tema Como Dreamweaver

guardar

en

Pasos: 1. Haz clic en el men archivo 2. Haz clic en guardar como 3. Escribe el nombre que llevar 4. Haz clic en el botn guardar

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tema crear un nuevo documento en Dreamweaver

Pasos: 1. Haz clic en archivo 2. Hacer clic en el botn nuevo 3. Despus de esto aparecer una nueva ventana, en la que debers elegir la Categora Pgina en blanco. 4. Seleccionamos HTML 5. Haz clic en el botn Crear.

Tema crear un sitio local

Pasos: 1. Abre Dreamweaver 2. Haz clic en el men sitio 3. Haz clic en administrar sitios 4. Haz clic en el botn nuevo

5. En la ventana configuracin de sitio escribe el nombre que tendr el sitio, en la carpeta del sitio local busca en donde guardaras 6. Haz clic en abrir 7. Luego haz clic en Guardar 8. Haz clic en listo.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tema: Ver el sitio

Pasos: 1. En panel Archivos 2. Haz clic en el men Ventana Archivos o tecla F8 es uno de los paneles ms importantes de Dreamweaver, ya que nos da acceso a los archivos del sitio.

Tema insertar una imagen en Dreamweaver

Pasos: 1. Abre Dreamweaver 2. Ubica el cursor donde insertaras la imagen 3. Haz clic en el men insertar 4. Selecciona la opcin imagen 5. En la nueva ventana busca la imagen 6. Haz clic en aceptar

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tema Formato texto en Dreamweaver

Pasos: 1. Abre Dreamweaver 2. Ubcate en el inspector de propiedades que se encuentra en la parte inferior de la ventana.

3. Selecciona la primera lnea del texto 4. En el inspector de propiedades pulsa HTML y aplica el formato Encabezado 1 en el recuadro formato. 5. Para cambiar el color del texto

pulsa el cono CSS que se encuentra a la izquierda.

6. Para aplicar formatos al texto utilizamos diferentes botones como:

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tarea Domiciliaria N1 Photoshop

Tema: Crear un sitio local

A partir de lo prendido en clase elabora la siguiente actividad, presentar en una unidad de almacenamiento (USB, CD) con su respectivo nombre. Fecha de entrega prxima clase. 1. Crea una carpeta en tu disco duro, dentro de la carpeta ejercicios donde guardar los archivos de los distintos que vayamos creando. Llmala mis sitios. 2. Copia a ella la carpeta cocina que encontrars en la carpeta ejercicios del curso. 3. Si no tienes abierto Dreamweaver, brelo para realizar el ejercicio. 4. Haz clic sobre el men Sitio. 5. Elige la opcin Administrar sitios. Se abrir una nueva ventana. 6. Pulsa el botn Nuevo.... 7. Se abrir una nueva ventana, selecciona la opcin Sitio. 8. En Nombre del sitio escribe Cocina. 9. En Carpeta del sitio local busca la carpeta cocina que acabas de copiar, y que se encuentra dentro de la carpeta mis sitios. Seleccinala. Puedes hacerlo a travs del botn con forma de carpeta. 10. Pulsa el botn Guardar y el sitio estar listo.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tema Propiedades del documento

Pasos: 1. Abre Dreamweaver 2. Pulsar la combinacin de teclas Ctrl + J 3. Haz clic sobre el men Modificar y elige la opcin Propiedades de la pgina. 4. Tambin puedes ingresar haciendo clic en el botn Propiedades de pgina

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Ejercicio: Crear nuevo documento y modificar sus propiedades

Pasos: 1. Abre Dreamweaver 2. Abre el men Archivo y elige la opcin Nuevo, o bien haz clic sobre el botn de la barra de herramientas. 3. Selecciona Pgina en blanco en Categora. 4. Selecciona HTML en Tipo de pgina. 5. Haz clic sobre el botn Crear. 6. A partir de este momento vamos a realizar todos los ejercicios en la vista diseo. Haz clic sobre el botn Mostrar vista de diseo. 7. Haz clic con el botn derecho del ratn sobre el documento en blanco, para abrir su men contextual. 8. Elige la opcin Propiedades de la pgina en el men contextual y selecciona la categora Apariencia (CSS). 9. En Color de texto: escribe #585858. 10. En Color de fondo: escribe #FEFEFE. 11. Haz clic en la categora Vnculos CSS. 12. En Color de vnculos: escribe #DFA01B. 13. En Vnculos visitados: escribe #F9CA69. 14. En Vnculos activos: escribe #FFB900. 15. Haz clic en la categora Ttulo/codificacin. 16. En Ttulo, escribe Cocina. 17. Haz clic sobre el botn Aceptar. 18. Haz clic sobre el botn Guardar

Tema: Los colores en Dreamweaver

Pasos: 1. Abre Dreamweaver 2. Para asignar colores es posible despegar una paleta de colores 3. La paleta de colores de Dreamweaver utilizan 216 colores seguros para web. 4. Los colores pueden asignarse a travs de los botones:

Ejercicio 1: Deportes.
1. Crear un sitio local con el nombre Deportes, cuya carpeta raz sea la carpeta deportes, que se encuentre dentro de la carpeta mis_sitios. 2. Abrir el documento index.htm.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

3. Modificar sus propiedades para que el color de los vnculos, sea cual sea su estado, sea #000 y nunca se encuentren subrayados. 4. Asgnale la imagen fondo-logo.gif que se encuentra en la carpeta imgenes del sitio aparezca como fondo sin repeticin. 5. Haz que la fuente del documento sea Verdana, Arial, sans-serif 18px, y de color #535D6F. 6. Haz que el ttulo de la pgina sea Tu tienda de deportes. 7. Guardar todos los cambios y cerrar los documentos.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Ejercicio 2: Animales.
1. Copia la carpeta animales que encontrars en la carpeta de ejercicios a la carpeta mis_sitios, creada en el primer ejercicio paso a paso de la unidad. 2. Crear un sitio local con el nombre Animales, cuya carpeta raz sea la carpeta animales, que se encuentra dentro de la carpeta mis_sitios, copiada en el paso anterior. 3. Abre el documento consultas.htm y modifica sus propiedades, para que su ttulo sea Consultas. 4. Abre el documento gatos.htm y modifica sus propiedades, para que su ttulo sea Gatos. 5. Abre el documento perros.htm y modifica sus propiedades, para que su ttulo sea Perros. 6. Abre el documento index.htm y modifica sus propiedades, para que su ttulo sea Inicio. 7. Guarda los cambios y cierra los documentos.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

Tema crear pginas en Dreamweaver

Pasos: 1. Abre Dreamweaver 2. Haz clic en la zona blanca del documento y escribe el texto que se muestra 3. Una vez introducido el texto vamos a modificar el ttulo y el color de fondo del documento 4. Haz clic en el men modificar y elige la opcin propiedades de la pgina 5. Aparecer una ventana realiza los cambios que se muestran. 6. Ahora vamos insertar la imagen que se muestra en la parte superior 7. Observa cmo queda el proyecto

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

RESERVA NACIONAL DE LACHAY

Bienvenidos a la Reserva Nacional
La reserva nacional de Lachay, reserva de la biosfera, es referencia ecolgica donde existe una flora y fauna autctona. Las aguas fras de la corriente peruana originan neblinas invernales que llegan a la costa impulsadas por los vientos alisios, lo cual humedece el desierto y da origen a la vegetacin de lomas.

Tema: El texto, propiedades y formato

Pasos: 1. Abre Dreamweaver 2. Las caractersticas del texto seleccionado pueden ser definidas a travs del men Formato, y a travs del inspector de propiedades. Vamos a ver las posibilidades que se nos ofrecen a travs del inspector de propiedades, que estn clasificadas en dos categoras HTML y CSS.

Formato: Permite seleccionar un formato de prrafo ya definido para HTML, que puede ser encabezado, prrafo o formato predeterminado. Los encabezados se utilizan para establecer ttulos dentro de un documento. El formato predeterminado sirve para que el texto aparezca tal cual ha sido escrito, por ejemplo, si entre dos

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

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, debera ir siempre en prrafos, salvo que est en otros elementos, como tablas o listas. Estilo: El botn B por defecto se muestra en negrita. El botn I por defecto se ve en cursiva. Lista: Estos botones permiten crear listas con vietas o listas numeradas. Sangra: Estos dos botones permiten sangrar el texto y anular la sangra.

Tema: Accediendo a las propiedades CSS.

1. Las hojas de estilo en cascada (CSS, Cascading Style Sheets) nos permiten formatear nuestra pgina y darle el diseo que queramos. Podemos cambiar desde propiedades simples, como el color de fondo, hasta cosas ms vistosas, como hacer que un bloque se muestre en una posicin determinada o que un elemento cambie al pasar el cursor sobre l. Profundizaremos en esto ms adelante, por ser una parte fundamental en la creacin de pginas web.

2. Regla de destino: Las reglas CSS sirven para definir a qu elemento aplicamos el estilo, y cmo lo hacemos. 3. Editar regla: Mediante este botn accedemos a las opciones para la creacin o modificacin de estilos CSS, de la regla seleccionada. 4. Panel CSS: Este botn abre el panel CSS si no lo tuviramos abierto. 5. Fuente: Permite seleccionar un conjunto de fuentes.

6. Estilo:

Estos botones ponen el texto en negrita y cursiva

respectivamente. 7. Alineacin: A travs de estos botones es posible establecer la alineacin del texto de una de estas cuatro formas distintas: izquierda, centrada, derecha y justificada. 8. Tamao: Permite cambiar el tamao del texto.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

9. Color: Permite seleccionar el color de la fuente, ignorando el color que se haya definido en las propiedades de la pgina. Ejercicio: Insertar texto y modificar sus propiedades 1. Abre Dreamweaver 2. Si no aparece el panel Archivos, brelo a travs del men Ventana, opcin Archivos. 3. Selecciona el sitio Cocina en el panel Archivos. Recuerda que creamos este sitio en el tema anterior. 4. Haz doble clic sobre el documento quienes.htm, que aparece en los archivos desplegados en el panel de Archivos. Se abrir el documento en Dreamweaver. 5. Sita el punto de insercin antes de la primera letra de la primera lnea. 6. Escribe el texto Quines somos y pulsa la tecla Intro para saltar de lnea. 7. Si no aparece el inspector de propiedades, brelo a travs del men Ventana, opcin Propiedades. 8. Haz clic en el texto Quines somos. 9. En Formato, del inspector de propiedades HTML, elige Encabezado 1. Observa como ahora el texto es de mayor tamao. 10. En la barra de herramientas de documento, haz clic sobre la caja de texto Ttulo, y escribe Quines somos. 11. Haz clic sobre el botn Guardar Ejercicio: Convertir texto en una lista 1. Abre Dreamweaver 2. Si no aparece el panel Archivos, brelo a travs del men Ventana, opcin Archivos. 3. Selecciona el sitio Cocina en el panel Archivos. Recuerda que creamos este sitio en el tema anterior a partir de archivos de la carpeta Ejercicios. 4. Haz doble clic sobre el documento postresemana.htm, que aparece en los archivos desplegados en el panel Archivos. 5. Se abrir el documento en Dreamweaver. 6. Si no aparece el Inspector de propiedades HTML, brelo a travs del men Ventana, opcin Propiedades. 7. Haz clic en la primera lnea Postre de la semana. 8. En el desplegable Formato, elige Encabezado 1. 9. Haz clic en la segunda lnea Boniatos a la mallorquina. 10. En el desplegable Formato, elige Encabezado 2. 11. Selecciona las tres lneas de texto desde 1kg de boniatos hasta Abundante aceite. de la barra de herramientas.

Educando en Valores

I.E.P Elvira Garca y Garca Inicial Primaria - Secundaria Calle C. de los Hroes N 127 Urb. Antares S.M.P Telf. 531 - 1123

2 Secundaria

12. Haz clic sobre el botn Lista sin ordenar del Inspector de propiedades HTML. 13. Selecciona las lneas desde Mondar los boniatos hasta el final. 14. Haz clic sobre el botn de Lista ordenada del inspector de propiedades. 15. Haz clic sobre la barra de herramientas, para cambiar el Ttulo, e introduce Postre de la semana. 16. Haz clic sobre el botn Guardar no aparece visible, pulsa Ctrl + S. de la barra de herramientas. Si esta barra

Educando en Valores