Curso Dreamweaver CS3

Curso de Adobe Dreamweaver CS3. Indice Curso de Dreamweaver CS3 Avanzado

aulaClic. Curso de Dreamweaver CS3. ndice

Cmo utilizar este curso. 1. Conceptos bsicos de Dreamweaver CS3 2. El entorno de trabajo 3. Configuracin de un sitio local 4. El texto 5. Hiperenlaces 6. Imgenes 7. Tablas 8. Marcos 9. Formularios

10. Multimedia 11. Las plantillas 12. HTML desde Dreamweaver 13. Otros elementos 14. Capas 15. Comportamientos 16. Comportamientos Avanzados 17. Estilos CSS Avanzado 18. Sitios Remotos

19. Servidor de Pruebas 20. Pginas Dinmicas 21. Cmo crear un Blog 22. XML y RSS 23. Acceso a datos con Spry 24. AJAX y Spry Framework 25. Spry y Formularios 26. Controles Spry Avanzados

Quieres tener el curso en tu ordenador y seguirlo sin estar conectado a Internet? Tambin ayudars a

mantener esta web. Infrmate aqu.

Adems te regalamos un DVD con ms de 600 programas libres/gratuitos al comprar un CD/DVD.

Web

www.aulaclic.es

n d i c e d e t a l l a d o

http://www.aulaclic.es/dreamweavercs3/ (1 de 7) [10/02/2008 19:45:21]


Unidad 1. Conceptos bsicos de Dreamweaver CS3

Qu es Dreamweaver CS3 HTML bsico Novedades de Dreamweaver CS3 Editar pginas web Cmo tener una pgina en Internet Arrancar y cerrar Dreamweaver CS3 Compaginar dos sesiones Abrir y guardar documentos Mi primera pgina

Unidad 2. El entorno de trabajo

La pantalla inicial Las barras Los paneles e inspectores Personalizar el rea de trabajo Vistas de un documento La ayuda

Unidad 3. Configuracin de un sitio local

Introduccin Crear o editar un sitio web sin conexin a Internet Vistas del sitio Subir archivos al servidor Comprobar tamao para optimizar la carga Propiedades del documento Los colores

Unidad 4. El texto

Unidad 16. Comportamientos Avanzados

Mensajes Emergentes Texto de la Barra de Estado Carga Previa de Imgenes Abrir una Ventana del Navegador Comprobar Navegador Comprobar Plug-ins Mens de Salto

Unidad 17. Estilos CSS Avanzado

Aplicar Estilos CSS Estructura CSS Selectores CSS Selectores de Atributo Pseudo-clases y Pseudo-elementos CSS Controles de Fuente Espaciado Aspecto del texto Controles de Ratn Controles de Lista Controles de Fondo Controles de Margen Bordes Controles de Elementos de Bloque y en Lnea Controles de Posicin Controles de Visibilidad

Unidad 18. Sitios Remotos

Configurar un Sitio Remoto El Panel Archivos Sincronizar Sitios

Unidad 19. Servidor de Pruebas



Caractersticas del texto Listas Caracteres especiales Estilos CSS. Introduccin Crear un estilo personalizado El Panel CSS Crear un nuevo estilo Gestionar estilos CSS Aplicar un estilo Hojas de Estilos

Unidad 5. Hiperenlaces

Introduccin Tipos de enlaces Crear enlaces Personalizar nuevos enlaces Destino del enlace Formato del enlace Enlace a correo electrnico Vnculos rotos

Unidad 6. Imgenes

Introduccin Tipos de imgenes para una web Insertar una imagen Cambiar el tamao de una imagen Mapas de imagen Imagen de sustitucin. Rollover Botones Flash Texto Flash Barra de navegacin

Unidad 7. Tablas

Introduccin a PHP Bases de datos Estructura PHP Instalar un Servidor Local con WAMP Trabajar con Servidor Local WAMP Configurar un Servidor de Pruebas Introduccin a phpMyAdmin Crear una Base de Datos en phpMyAdmin Crear una Tabla en phpMyAdmin Insertar Datos en una Tabla en phpMyAdmin Modificar una Tabla en phpMyAdmin Modificar Datos de una Tabla Establecer Privilegios en phpMyAdmin

Unidad 20. Pginas Dinmicas

Introduccin Crear una Conexin a la Base de Datos Juegos de Registros o RecordSets Mostrar Datos Dinmicos Repeticiones Orden de Juegos de Registros Filtrado de Juegos de Registros Paginacin de Registros Mostrar/Ocultar Regiones Uso de Variables Pginas Maestro-Detalle Asistente de Insercin de Registros Asistente de Actualizacin de Registros Asistente de Eliminacin de Registros Juegos de Registros Avanzados

Unidad 21. Cmo crear un Blog



Introduccin Insertar una tabla Rellenar las celdas Seleccionar elementos de una tabla Formato de tabla Cambiar tamao de tabla y celdas Aadir y eliminar filas y columnas Anidar, dividir y combinar celdas Modos de tabla Adaptar webs a distintas resoluciones

Unidad 8. Marcos

Introduccin Crear marcos Seleccionar marcos Guardar Configurar marcos Contenido del marco

Unidad 9. Formularios

Introduccin Elementos de formulario Crear formularios Validar formularios

Unidad 10. Multimedia

Pelculas Flash Sonido Vdeos

Unidad 11. Las plantillas

Introduccin Crear plantillas Establecer regiones editables en una plantilla Basar pginas en una plantilla

Unidad 12. HTML desde Dreamweaver

Introduccin Estructura de Datos Interfaz Pblica Interfaz Privada Insertar Nuevos elementos Listado de elementos Modificacin de elementos Eliminacin de elementos Restringir Acceso

Unidad 22. XML y RSS

Introduccin Importar datos de un Archivo Externo Trabajar con elementos XML Crear Repeticiones Ordenar elementos Sentencias condicionales Insertar un fragmento XSLT Paso de parmetros

Unidad 23. Acceso a datos con Spry

Introduccin Conjunto de datos XML Crear una Regin de Spry Repeticin de Elementos Listas de Repeticin Tablas de Datos Mostrar Maestro/Detalle

Unidad 24. AJAX y Spry Framework



Etiquetas Entidades HTML Listado de Entidades HTML El inspector de cdigo Completar las etiquetas Contraer y expandir cdigo Errores en el cdigo Buscar y reemplazar Expresiones Regulares Bsqueda en Etiquetas

Unidad 13. Otros elementos

Marquesinas Fecha Regla horizontal Cdigo de otras pginas

Unidad 14. Capas

Introduccin Insertar una capa Formato de una capa

Unidad 15. Comportamientos

Introduccin Insertar un comportamiento Mostrar-Ocultar capas Llamar JavaScript

Introduccin Incluir Spry Importar Datos Definiendo Regiones Mostrar informacin Crear Repeticiones Ordenar Registros Variables Preestablecidas Condicionales Filtros Eliminar Filas repetidas Actualizar la Carga de un archivo XML Modo Maestro/Detalle Modo Maestro/Detalle con diferentes fuentes XML Spry y Estilos CSS

Unidad 25. Spry y Formularios

Introduccin Validacin de Campos de Texto Estados de Validacin Validacin de Campos Desplegables Casillas de Verificacin reas de Texto

Unidad 26. Controles Spry Avanzados

Introduccin Barra de mens Navegacin por Fichas Control Acorden Panel con Contraccin Cambiar Estilos CSS

Ejercicios paso a paso



* Descargar archivos para ejercicios * 3. Crear un sitio web local 3. Crear nuevo documento y modificar sus propiedades 4. Insertar texto y modificar sus propiedades 4. Convertir texto en una lista 4. Crear estilos CSS 5. Crear un hiperenlace 5. Crear un vnculo de correo electrnico 6. Insertar una imagen 6. Crear mapas de imagen 6. Crear botones Flash 7. Crear y rellenar una tabla 7. Modificar las propiedades de la tabla 7. Aadir y eliminar filas 7. Combinar celdas 8. Crear y configurar marcos 9. Insertar elementos de formulario 10. Insertar un archivo de audio 11. Crear una plantilla 12. Buscar y reemplazar 13. Insertar fecha 14. Insertar una capa 15. Crear comportamiento

17. Crear una hoja de estilos 17. Utilizando pseudo-elementos y clases 17. Controles de fuente 17. Controles de ratn 17. Controles de fondo 17. Controles de mrgenes y bordes 17. Controles de bloque 19. Instalacin de WAMP 19. Crear un servidor de pruebas 19. Crear una Base de Datos 19. Crear una Tabla 19. Importar datos a una Tabla 19. Asignar privilegios en una base de datos 20. Crear una conexin a una Base de Datos 20. Crear un Recordset 20. Crear Texto Dinmico 20. Repeticiones de Texto Dinmico 20. Ordenacin de un Recordset 20. Filtrado de Registros 20. Paginacin de Registros 20. Recuento de Registros 20. Ocultar/Mostrar Regiones 20. Enlaces con Parmetros 20. Filtros con Parmetros

20. Insercin de Registros 20. Utilizar sentencias SQL 21. Estructura de datos de un Blog 21. Interfaz Pblica 21. Creacin de un men de Administracin 21. Insercin de elementos 21. Listado de elementos 21. Modificacin de elementos 21. Eliminacin de elementos 21. Restringir acceso 22. Preparando el servidor de pruebas 22. Importar datos XML 22. Enlaces con elementos 22. Repeticin de elementos 22. Ordenacin de elementos 22. Insertar XSLT en una pgina dinmica 22. Paso de parmetros 24. Incluir Spry 24. Crear un Dataset 24. Crear una Regin con Informacin 24. Crear repeticiones de Registros 24. Crear Filtros

Vdeotutoriales Ejercicios propuestos Pruebas evaluativas

Indice

1. Conceptos bsicos 2. El entorno de trabajo 2. Las vistas 2. La ayuda 3. Crear un sitio local 3. Las propiedades de la pgina 4. Las caractersticas del texto 4. Crear estilo CSS 5. Los hiperenlaces 6. Insertar una imagen 6. Crear un botn Flash 6. Crear un texto Flash 7. Insertar una tabla

3. Crear sitio local y modificar las propiedades de la pgina 4. Modificar las propiedades del texto 5. Crear hiperenlaces 6. Insertar imgenes 7. Modificar tablas 8. Configurar marcos 9. Insertar elementos de formulario 10. Insertar elementos multimedia 11. Trabajar con plantillas 12. Buscar y reemplazar 13. Insertar otros elementos 14. Insertar capas 15. Crear comportamientos 16. Crear comportamientos avanzados

1. Conceptos bsicos de Dreamweaver CS3 2. El entorno de trabajo 3. Configuracin de un sitio local 4. El texto 5. Hiperenlaces 6. Imgenes 7. Tablas 8. Marcos 9. Formularios 10. Multimedia 11. Las plantillas 12. HTML desde Dreamweaver 13. Otros elementos 14. Capas 15. Comportamientos



8. Insertar marcos 9. Insertar un formulario 10. Insertar elementos multimedia 11. Crear una plantilla 12. HTML desde Dreamweaver 13. Otros elementos 14. Insertar una capa 15. Insertar comportamientos 16. Crear un men de salto 17. Estilos CSS 18. Sitios Remotos 19. Crear B. de datos en PhpMyAdmin 19. Modificar Tablas 20. Crear un recordset 20. Utilizar datos de un recordset 20. Paginacin de registros 20. Insertar registros 20. Eliminar registros 21. Qu es un Blog 22. XML y RSS 23. Spry y Acceso a Datos 24. AJAX y Spry Framework 25. Spry y los Formularios 26. Controles Avanzados Spry

17. Estilos CSS avanzados 19. Servidor de Pruebas 20. Pginas Dinmicas 21. Cmo hacer un Blog 22. XML y RSS 23. Spry y Acceso a datos 24. AJAX y Spry Framework 25. Spry y los Formularios 26. Controles Avanzados Spry

16. Comportamientos Avanzados 17. Estilos CSS Avanzados 18. Sitios Remotos 19. Servidor de Pruebas 20. Pginas Dinmicas 21. Cmo crear un Blog 22. XML y RSS 23. Spry y Acceso a datos 24. AJAX y Spry Framework 25. Spry y los Formularios 26. Controles Avanzados Spry

Aviso legal: este curso es gratuito siempre que se visualice desde la pgina web de aulaClic. No est permitido descargar el curso y utilizarlo en academias o centros de enseanza privados sin estar conectado a Internet.

aulaClic. Todos los derechos reservados. Free Computer tutorials. Prohibida la reproduccin por cualquier medio. Septiembre - 2007.


Curso de Adobe Dreamweaver CS3. informacion

Cmo utilizar este curso

Este curso pretende que todas las personas puedan aprender a manejar Dreamweaver CS3.

Si es la primera vez que visitas aulaClic posiblemente te interese visitar esta pgina.

Navegacin.

Para moverte por el curso dispones de la barra de navegacin que ves en la parte superior de la pgina. Con el icono avanzar vas a la pgina siguiente, con el icono retroceder vas a la pgina anterior, es como si pasaras ordenadamente las pginas de un libro. Con el icono inicio vas a la pgina principal de aulaclic ( tambin con el icono de aulaclic que hay en la parte izquierda). Con el icono ayuda vienes a esta pgina. Para ir a una pgina concreta puedes utilizar uno estos dos mtodos:

1.- Ir a la pgina del ndice detallado y hacer clic en el apartado o punto al que quieres ir.

2.- Utilizar el indice desplegable de la barra de navegacin superior, que funciona de esta manera: Al colocar el cursor sobre "Curso de Dreamweaver CS3" se despliega el men con los temas y al hacer clic irs a esa pgina

Al final de cada pgina tambin tienes unas flechas para retroceder , ir al indice , o avanzar . Cuando estamos en una pgina de ejercicios o de pruebas evaluativas, estas flechas al igual que las de la barra de navegacin y te llevan al siguiente ejercicio o prueba evaluativa, para ir al tema terico

correspondiente utiliza la flecha . F11. Si utilizas el Explorer es muy recomendable utilizar la tecla F11 para ganar espacio en la pantalla. Puedes probarlo ahora, para volver a la pantalla normal vuelve a pulsar F11.

http://www.aulaclic.es/dreamweavercs3/informacion.htm (1 de 3) [10/02/2008 19:45:27]


Estructura del curso.

Al seguir manuales de informtica cada lector va saltndose los temas que no le interesan porque es informacin muy compleja para su nivel o porque son cosas demasiado bsicas para su nivel. Este curso trata de aliviar este problema organizando los contenidos por niveles. Hemos establecido tres niveles: bsico, medio y avanzado. Cmo se navega por estos niveles?. Muy sencillo, el curso tiene una estructura troncal que es el nivel medio, pero en los puntos que se ha considerado oportuno hay unos iconos para acceder a los otros dos niveles. Para volver al nivel del que se parti puedes pulsar la flecha del final de la pgina. Es decir, una vez leda la explicacin en el nivel medio te puedes encontrar en algunos casos con este icono para ir al nivel bsico donde se te explicarn conceptos ms sencillos relacionados con ese tema. En otras ocasiones puedes encontrar este icono para ir al nivel avanzado, donde se explicarn conceptos ms avanzados, otras formas ms rpidas de hacer lo mismo, etc. Si es la primera vez que sigues el curso puede ser conveniente que dejes los niveles avanzados para una segunda lectura. Cmo se identifican los niveles? Por los colores de los rtulos:

Nivel bsico. Nivel medio. Nivel avanzado.

As sabrs en todo momento en qu nivel te encuentras.

Ejercicios.

En los temas encontrars dos tipos de ejercicios:

ejercicios paso a paso son ejercicios que sirven para ilustrar la explicacin descrita en el tema.

ejercicios propuestos son ejercicios que se realizan al final del tema para practicar los conceptos estudiados. Al final de la pgina de ejercicios encontrars un enlace con ayuda para la resolucin del ejercicio.

Tambin hay una prueba evaluativa terica con su correspondiente solucin.

Nomenclatura.



En color verde se pondrn los comandos que el usuario puede ejecutar. Tambin hemos puesto los conceptos ms importantes en azul.

Vdeotutoriales.

Pinchando sobre este icono podrs acceder a los vdeotutoriales o secuencias animadas, en los que

vers claramente las explicaciones. Para verlas slo necesitas el plug-in de Flash, la mayora de los navegadores ya lo llevan incorporado. Si no puedes ver las secuencias descrgatelo ahora aqu.

Preguntas.

Si tienes alguna duda o pregunta sobre el contenido de este curso puedes plantearlas en el Foro de aulaClic, entre todos intentaremos resolverlas.

Para participar en el foro slo tienes que darte de alta como usuario registrado. Tambin podrs aprender con las preguntas y respuestas de los dems participantes.

Para darte de alta slo te pedimos tu direccin de correo. Adems como usuario registrado tendrs acceso a la zona de descarga. En esta pgina tienes ms informacin.

Por otro lado os agradeceremos que nos ayudis a mejorar este curso con vuestras crticas y comentarios; por favor, escribidnos a esta pgina: contacto




Curso de Adobe Dreamweaver CS3. Tema 1. Conceptos bsicos de Dreamweaver CS3

Unidad 1. Conceptos bsicos de Dreamweaver CS3 (I)

Qu es Dreamweaver CS3

Dreamweaver CS3 es un software fcil de usar que permite crear pginas web profesionales.

Las funciones de edicin visual de Dreamweaver CS3 permiten agregar rpidamente diseo y funcionalidad a las pginas, sin la necesidad de programar manualmente el cdigo HTML.

Se puede crear tablas, editar marcos, trabajar con capas, insertar comportamientos JavaScript, etc., de una forma muy sencilla y visual.

Adems incluye un software de cliente FTP completo, permitiendo entre otras cosas trabajar con mapas visuales de los sitios web, actualizando el sitio web en el servidor sin salir del programa.

Para seguir este curso te puedes descargar la versin gratuita de Dreamweaver desde la pgina de Adobe, la versin caduca al cabo de 30 das, pero seguro que te animas a comprar la versin de pago de este estupendo programa.

Los logotipos de Dreamweaver son propiedad de Adobe, as como las marcas registradas Dreamweaver y Adobe. aulaClic no tiene ninguna relacin con Adobe.

Si no conoces las caractersticas bsicas de HTML puedes verlas aqu.

Novedades de Dreamweaver CS3

En este punto comentaremos las caractersticas que aporta esta nueva versin sobre la anterior.

Mejoras en Spry. El "Framework" o estructura Spry ha recibido un fuerte impulso en esta versin de Dreamweaver. Spry es un conjunto de archivos JavaScript que permiten la inclusin de elementos dinmicos en las pginas HTML. Por ejemplo se pueden incluir acordeones, barras de menus, validacin de formularios, acceso a datos XML, etc.

Tambin se han incluido efectos spry que se aplican a elementos ya existentes en la pgina HTML para hacer que se desvanezcan, reduzcan su tamao, se resalten, etc.

Mayor integracin con Photoshop y Fireworks. Ahora es posible pegar directamente imgenes desde Photoshop en una pgina HTML de Dreamweaver. Luego con un doble clic podremos ir a editar la imagen en Photoshop. Se pueden importar imgenes con capas.

Mejoras en la comprobacin de la compatiblidad con diferentes navegadores. Dreamweaver CS3 puede generar informes con los problemas de visualizacin de elementos CSS en los navegadores ms utilizados.

Adobe CSS Advisor es un sitio web accesible desde Dreamweaver que contiene informacin til para resolver los problemas de compatibilidad entre navegadores.

Mejoras en CSS. La administracin de CSS es ms fcil, ahora se pueden trasladar elementos CSS entre diferentes hojas de estilo. Tambin ha aumentado la cantidad de plantillas CSS disponibles para aplicar a nuestras pginas web.

http://www.aulaclic.es/dreamweavercs3/t_1_1.htm (1 de 2) [10/02/2008 19:45:40]

Curso de Adobe Dreamweaver CS3. Tema 1. Conceptos bsicos de Dreamweaver CS3

Adobe Device Central, incluido en la Adobe Creative Suite, facilita la publicacin en dispositivos mviles, PDAs, etc..

Pg. 1.1




Curso de Adobe Dreamweaver CS3. Tema 2. El entorno de trabajo

Unidad 2. El entorno de trabajo (I)

Vamos a ver cules son los elementos bsicos de Dreamweaver CS3 , la pantalla, las barras, los paneles, etc, para saber diferenciar entre cada uno de ellos. Aprenderemos cmo se llaman, dnde estn y para qu sirven. Tambin veremos cmo obtener ayuda, por si en algn momento no sabemos cmo seguir trabajando. Cuando conozcamos todo esto estaremos en disposicin de empezar a crear pginas web.

La pantalla inicial

Al arrancar Dreamweaver aparece una pantalla inicial como sta, vamos a ver sus componentes fundamentales. As conoceremos los nombres de los diferentes elementos y ser ms fcil entender el resto del curso. La pantalla que se muestra a continuacin (y en general todas las de este curso) puede no coincidir exactamente con la que ves en tu ordenador, ya que cada usuario puede decidir qu elementos quiere que se vean en cada momento, como veremos ms adelante.


Curso de Adobe Dreamweaver CS3. Tema 2. El entorno de trabajo

Pg. 2.1




Curso de Adobe Dreamweaver CS3. Tema 03. Configuracin de un sitio local

Unidad 3. Configuracin de un sitio local (I)

En este tema vamos a ver qu es un sitio web, cmo crearlos y gestionarlos, y cmo modificar las propiedades de los documentos, como puede ser el color de fondo.

Introduccin

Un sitio web es un conjunto de archivos y carpetas, relacionados entre s, con un diseo similar o un objetivo comn. Es necesario disear y planificar el sitio web antes de crear las pginas que va a contener.

La forma habitual de crear un sitio consiste en crear una carpeta en el disco local. Los documentos HTML normalmente se crean dentro de dicha carpeta, mientras que para contener las imgenes, las animaciones, las hojas de estilo, etc., se deben crear nuevas carpetas dentro de sta, con el objetivo de tener una mejor organizacin de los archivos a la hora de trabajar. Esto es lo que se conoce como sitio local.

Despus se podrn copiar los archivos en un servidor web, en el denominado sitio remoto, lo que equivale a publicar el sitio, de modo que la gente podr verlo en Internet.

La organizacin de los archivos en un sitio permite administrar y compartir archivos, mantener los vnculos de forma automtica, utilizar FTP para cargar el sitio local en el servidor, etc.

Es conveniente que la pgina inicial del sitio tenga el nombre index.htm o index.html, ya que los navegadores buscan una pgina con ese nombre cuando se intenta acceder a una URL genrica.

Por ejemplo, si escribiramos la direccin genrica http://www.aulaclic.com en el navegador, ste intentara cargar la pgina http://www.aulaclic.com/index.htm, por lo que se producira un error en el caso de que no existiera ninguna pgina con el nombre index.htm.

Crear o editar un sitio web sin conexin a Internet

Una vez creadas las carpetas que formarn un sitio local, ya es posible definir el sitio en Dreamweaver.

Para ello hay que dirigirse al men Sitio, a la opcin Administrar sitios....

Recuerda que a travs del panel Archivos, pestaa Archivos, se puede acceder a cada uno de los sitios creados y a la opcin Administrar sitio.



En el caso de haber seleccionado la opcin Administrar sitios, aparece una ventana que contiene la lista de sitios locales definidos con anterioridad.

Por supuesto, pueden existir varios sitios locales en un mismo ordenador.

Tanto si se elige la opcin Nuevo..., como si se elige la opcin Editar..., se mostrar la misma ventana en la que definir las caractersticas del sitio.



Las caractersticas del sitio se agrupan en diferentes categoras que aparecen en la parte izquierda.

Para visualizar las caractersticas de una categora basta con seleccionarla de la lista haciendo clic en ella.

Vamos a ver los datos que hay que editar para la categora Datos locales.

Debe definirse el Nombre del sitio y la Carpeta raz local, que es en la que se encuentra el sitio dentro del disco duro local.

Despus, si se desea, a travs de la categora Mapa de diseo del sitio puede definirse la pgina principal del sitio, de la que colgarn el resto de documentos HTML dentro del sitio, si en la carpeta raz del sitio existe una pgina con el nombre index.htm, Dreamweaver la coger por defecto.

Estas tres caractersticas son las imprescindibles para definir un sitio local.

Las dems opciones en este momento no nos interesan, ya que estamos definiendo el sitio local, y no es necesario establecer los datos del servidor en el que estar el sitio remoto.

Despus de rellenar los datos pulsamos el botn Aceptar y abrimos el sitio.

Si preferimos utilizar un asistente para crear el sitio web slo tenemos que seleccionar la pestaa Bsicas, en vez de la pestaa Avanzadas.



Abrir un sitio

Para abrir un sitio ya definido hay que dirigirse al men Sitio, a la opcin Administrar sitios.... seleccionar el sitio de la lista de sitios y pulsar sobre el botn Listo.

Tambin podemos utilizar el panel Archivos, buscar y seleccionar el sitio a abrir en el men desplegable de la pestaa Archivos.

Para practicar puedes realizar el Ejercicio paso a paso Crear un sitio web local.

Pg. 3.1




Curso de Adobe Dreamweaver CS3. Tema 4. El texto

Unidad 4. El texto (I)

A lo largo de este tema vamos a aprender a cambiar las propiedades del texto y a crear estilos CSS, que permiten asignar al texto estilos creados por nosotros mismos, no predefinidos.

Caractersticas del texto

Las caractersticas del texto seleccionado pueden ser definidas a travs del men Texto, y a travs del inspector de propiedades. Vamos a ver las posibilidades que se nos ofrecen a travs del inspector de propiedades, aunque sean menos que las que se nos ofrecen a travs del men Texto.

Formato:

Permite seleccionar un formato de prrafo ya definido para HTML, que puede ser encabezado, prrafo o preformateado. Los encabezados se utilizan para establecer ttulos dentro de un documento. El formato preformateado sirve para que el texto aparezca tal cual ha sido escrito, por ejemplo, si entre dos palabras se introducen varios espacios solo se considera uno, pero al establecer el formato preformateado se respetar que hayan varios espacios en lugar de solo uno.

Fuente: Permite seleccionar un conjunto de fuentes. Aparecen conjuntos de fuentes en lugar de una sola, ya que es posible que al establecer una nica fuente el usuario no la tenga en su ordenador. El seleccionar un conjunto de fuentes posibilita que en el caso de que el usuario no tenga una fuente se aplique otra del conjunto. Por ejemplo, si seleccionamos Arial, Helvetica, Sans-serif, el texto se ver con la fuente Arial, pero si esta no existe se ver en Helvetica.

Tamao:

Permite cambiar el tamao del texto. El tamao lo podemos indicar en diversas unidades, en pxeles, centmetros, etc...

Color:


Curso de Adobe Dreamweaver CS3. Tema 4. El texto

Permite seleccionar el color de la fuente, ignorando el color que se haya definido en las propiedades de la pgina. Si no se ha establecido ningn color en las propiedades de la pgina ni aqu, el color del texto por defecto ser el negro.

Estilo:

Estos botones permiten establecer si el texto aparecer en negrita o en cursiva. A travs del men Texto tambin se puede, entre otras cosas, subrayar el texto. Esta opcin no aparece en el panel de Propiedades ya que de normal no suele utilizarse, debido a que los vnculos aparecen subrayados y el subrayar texto normal podra hacer que el usuario pensara que se trata de un vnculo.

Alinear:

A travs de estos botones es posible establecer la alineacin del texto de una de estas cuatro formas distintas: izquierda, centrada, derecha y justificada.

Lista:

Estos botones permiten crear listas con vietas o listas numeradas.

Sangria:

Estos dos botones permiten sangrar el texto y anular la sangra. La sangra es una especie de mrgen que se establece a ambos lados del texto. En este caso caso los botones se refieren a sangra a la izquierda del texto.

Para practicar puedes realizar el Ejercicio paso a paso Insertar texto y modificar sus propiedades.

Pg. 4.1




Curso de Adobe Dreamweaver CS3. Tema 5. Hiperenlaces

Unidad 5. Hiperenlaces (I)

Vamos a ver qu son los hiperenlaces, para qu sirven y cmo crearlos, ya que son un elemento esencial para cualquier pgina web.

Introduccin

Un hiperenlace, hipervnculo, o vnculo, no es ms que un enlace, que al ser pulsado lleva de una pgina o archivo a otra pgina o archivo.

Es posible asignar un vnculo a un texto, a una imagen, o a parte de una imagen.

Tipos de enlaces

Existen diferentes clases de rutas de acceso a la hora de definir los vnculos.

Referencia absoluta:

Conduce al sitio en el que se encuentra el documento utilizando la ruta completa del archivo.

La ubicacin es en Internet, por ejemplo, http://www.aulaclic.com, o http://www.misitio.com/pagina/pagina1.html.

Referencia relativa al documento:

Conduce a un documento situado dentro del mismo sitio que el documento actual, pero partiendo del directorio en el que se encuentra el documento actual.

Si queremos referinos a carpetas que estn por encima del nivel donde nos encontramos deberemos utilizar ../

Por ejemplo, imagina que estamos en la siguiente direccin http://www.misitio.com/pagina/informacion/index.html. En esta pgina queremos mostrar una imagen que se encuentra en la carpeta http://www.misitio.com/pagina/secciones/seccion1.html, cmo podemos hacerlo? Fcil. Deberemos llamarla haciendo referencia al nivel superior (http://www.misito.com/pagina/) para poder ir luego a la carpeta secciones.

El resultado de la ruta sera el siguiente: ../secciones/seccion1.html.

De esta forma, mientras nos encontramos en la carpeta informacion, subimos un nivel y luego nos movemos dentro de la carpeta secciones para mostrar el archivo seccion1.html.

Referencia relativa al sitio:

Conduce a un documento situado dentro del mismo sitio que el documento actual.

En este mtodo los enlaces se crean indicando la ruta a partir de la raz del sitio.


Curso de Adobe Dreamweaver CS3. Tema 5. Hiperenlaces

En el ejemplo anterior si tuviesemos definido como sitio la carpeta http://www.misitio.com/, un enlace en cualquier pgina del sitio a http://www.misitio.com/pagina/secciones/seccion1.html se creara como /pagina/secciones/seccion1.html.

Como puedes ver ahora el vnculo a un archivo en todas las pginas es igual porque se define dependiendo del sitio raz y no de la ubicacin donde se encuentra.

Puntos de fijacin:

Conduce a un punto dentro de un documento, ya sea dentro del actual o de otro diferente. Para ello el vnvulo debe ser nombre_de_documento.extension#nombre_de_punto.

El punto se define dentro de un documento a travs del men Insertar, opcin Anclaje con nombre.

Podramos referenciar de este modo a un anclaje llamado parte2 de la siguiente forma: ../secciones/seccion1.html#parte2

Estos tipos de enlace que hemos visto son vlidos tanto para referenciar pginas (para crear hiperenlaces) o incluso imgenes u otro tipo de objetos (como veremos en temas posteriores).

Debers tener siempre en cuenta que los nombres de las rutas se correspondan perfectamente a los nombres de los archivos y carpetas en el servidor (local o remoto).

Por ello, es muy recomendable que utilices siempre minsculas para evitar fallos en los enlaces.

Tambin debers evitar utilizar caracteres especiales como acentos o espacios, as no tendrs problemas a la hora de referenciar tus objetos.

Pg. 5.1




Curso de Adobe Dreamweaver CS3. Tema 6. Imgenes

Unidad 6. Imgenes (I)

En este tema vamos a ver cmo insertar imgenes en un documento. Tambin veremos cmo crear algunas imgenes especiales, como es el caso de los Rollovers y los botones flash, que ayudan a mejorar la apariencia de nuestras pginas.

Introduccin

Todas las pginas web acostumbran a tener un cierto nmero de imgenes, que permiten mejorar su apariencia, o dotarla de una mayor informacin visual.

Existen una serie de formatos de imagen ms recomendables que otros para ser introducidos en una pgina web. Esta informacin puedes consultarla aqu .

Insertar una imagen

Para insertar una imagen hay que dirigirse al men Insertar, a la opcin Imagen. Despus de esto, ya es posible seleccionar una imagen a travs de la nueva ventana.



Si por algn motivo se desea insertar un BMP, este no aparecer a no ser que en Tipo se seleccione Todos los archivos.

En Relativa a es posible especificar si la imagen ser relativa al documento o a la carpeta raz del sitio. Es preferible que sea relativa al Documento, ya que si se mueve todo el sitio a una ubicacin diferente, la imagen puede no verse al estar siendo buscada en la ubicacin anterior.

Lo mismo ocurre cuando se selecciona un documento para crear un vnculo.

La ruta en la que se encuentra la imagen aparecer representada de una u otra forma en el campo URL de la ventana y en el campo Origen del inspector de propiedades, dependiendo de si ha sido insertada como relativa a la carpeta raz del sitio o relativa al documento.

Por ejemplo, imagina que dentro de la carpeta raz del sitio (la carpeta del sitio) se encuentran la carpeta imagenes y el documento en el que deseamos insertar la imagen. Dicha imagen, llamada aulaclic.jpg, se encuentra dentro de la carpeta imagenes.

En el caso de insertar la imagen como relativa al Documento la ruta sera:

imagenes/aulaclic.jpg

Mientras que en el caso de ser insertada como relativa a la Raz del sitio la ruta sera:

/imagenes/aulaclic.jpg

Ocurre lo mismo que cuando se crea un hipervnculo a un documento relativo al documento o a la carpeta raz del sitio.

Si se inserta un BMP en un documento, este no aparece correctamente en Dreamweaver, aunque s en el navegador.

En Dreamweaver aparecer de la siguiente forma:



Esa misma imagen es la que aparece en Dreamweaver cuando no se encuentra una imagen que haba sido insertada. Esto puede ocurrir si se ha modificado el nombre de la imagen, o si se ha movido de directorio, desde fuera

de Dreamweaver. En ese caso, la imagen que aparecer en el navegador ser similar a esta:

Aparece un recuadro blanco con una X roja, junto con el nombre de la imagen o el contenido del campo Alt del inspector de propiedades, que explicaremos a continuacin.

Para practicar puedes realizar el Ejercicio paso a paso Insertar una imagen.

Pg. 6.1




Curso de Adobe Dreamweaver CS3. Tema 7. Tablas

Unidad 7. Tablas (I)

En este tema vamos a ver cmo trabajar con tablas. Podremos, entre otras cosas, insertar tablas, combinar celdas, insertar filas o columnas y cambiar el tamao del borde.

Introduccin

Todos los objetos se alinean por defecto a la izquierda de las pginas web, pero gracias a las tablas es posible distribuir el texto en columnas, colocar imgenes al lado de un bloque de texto, y otra serie de cosas que sin las tablas seran imposibles de realizar.

Hoy en da, la mayora de las pginas web se basan en tablas, ya que resultan de gran utilidad al mejorar notablemente las opciones de diseo.

Las tablas estn formadas por un conjunto de celdas, distribuidas en filas y columnas. A continuacin tienes un ejemplo de tabla.

Insertar una tabla

Para insertar una tabla hay que dirigirse al men Insertar, a la opcin Tabla.

En la nueva ventana habr que especificar el nmero de Filas y Columnas que tendr la tabla, as como el Ancho de la tabla .


Curso de Adobe Dreamweaver CS3. Tema 7. Tablas

El Ancho puede ser definido como Pxeles o como Porcentaje. La diferencia de uno y otro es que el ancho en Pxeles es siempre el mismo, independientemente del tamao de la ventana del navegador en la que se visualice la pgina, en cambio, el ancho en Porcentaje indica el porcentaje que va a ocupar la tabla dentro de la pgina y se ajustar al tamao de la ventana del navegador, esto permite que los usuarios que tengan pantallas grandes, aprovechen todo el ancho de pantalla.

Grosor del Borde indica el grosor del borde de la tabla en pxeles, por defecto se le asigna uno (1).

Relleno de celda indica la distancia entre el contenido de las celdas y los bordes de stas.

Espacio entre celdas indica la distancia entre las celdas de la tabla.

Tambin se puede establecer si se quiere un encabezado para la tabla es recomendable utilizar encabezados en el caso de que los usuarios utilicen lectores de pantalla. Los lectores de pantalla leen los encabezados de tabla y ayudan a los usuarios de los mismos a mantener un seguimiento de la informacin de la tabla.

Si queremos incluir un ttulo, lo indicamos en Texto, el ttulo aparecer fuera de la tabla.

En alinear texto indicamos dnde queremos alinear el ttulo con respecto a la tabla.

En Resumen: indicamos una descripcin de la tabla, los lectores de pantalla leen el texto del resumen pero dicho texto no aparece en el navegador del usuario.

Pg. 7.1




Curso de Adobe Dreamweaver CS3. Tema 8. Marcos

Unidad 8. Marcos (I)

Vamos a ver qu son los marcos y para qu se utilizan. Tambin veremos cmo insertar un marco sencillo en una pgina, y cmo trabajar con l.

Introduccin

Los marcos o frames sirven para distribuir mejor los datos de las pginas, ya que permiten mantener fijas algunas partes, como pueden ser el logotipo y la barra de navegacin, mientras que otras s pueden cambiar. Adems de mejorar la funcionalidad, pueden mejorar tambin la apariencia.

Cada uno de los marcos de una pgina, contiene un documento HTML individual. Por ejemplo, en la imagen de la derecha puedes ver una pgina con dos marcos. El marco izquierdo contiene el documento menu.htm y el derecho el documento quienes.htm. Para poder visualizar la pgina de este modo, hemos tenido que abrir en el navegador el documento marcos.htm, que es la pgina que contiene los marcos agrupados.

Es posible editar los documentos contenidos en los marcos desde la pgina que contiene el grupo de marcos. Esto facilita el trabajo, ya que es ms fcil hacerse una idea de cmo quedar la pgina al final, cosa que no es posible si se editan individualmente cada uno de los documentos que contiene el marco.

El trabajar con marcos puede resultar una tarea algo complicada, sobretodo al principio, por lo que no vamos a profundizar mucho en el tema, y veremos solamente algunos conceptos bsicos y ejemplos sencillos.

Crear marcos



Existen varias formas de crear un marco. Nosotros vamos a ver solamente una de ellas.

Para crear un marco, primero hay que abrir algn documento. Puede ser uno nuevo o uno ya existente.

Despus, dirigirse al men Insertar, HTML, Marcos. A travs de esta opcin puede elegirse el tipo de marco que va a crearse.

Vamos a ver el marco a la Izquierda.

Si pulsamos sobre Izquierda se crear un nuevo marco a la izquierda del documento actual.

Como puedes ver en la imagen, aparece una lnea que divide el documento en dos. El documento de partida era uno nuevo.

En este caso tendremos tres documentos: el de la izquierda, el de la derecha, y el que contiene el grupo de marcos. El de la derecha es el documento que tenamos inicialmente, que est en el marco conocido como marco padre (MainFrame).



Para seleccionar el documento que contiene el grupo de marcos hay que pulsar sobre la lnea que separa los marcos. Esto solo es posible mientras dicho documento no se haya guardado.

Si en lugar de insertar un marco a la izquierda lo insertamos a la Derecha, el marco vaco aparecer a la derecha del documento original.

En esta imagen puedes ver un ejemplo de marco a la derecha.

Sobre un documento ya existente, menu.htm, se ha insertado un marco a la derecha.

Al igual que en el caso anterior, tenemos tres documentos: el de la izquierda, el de la derecha, y el que contiene el grupo de marcos. En este caso, el documento que tenamos inicialmente es el de la izquierda, mientras que antes era el de la derecha. Por ello, en este caso el marco padre ser el de la izquierda.

El marco padre siempre es el marco en el que se encuentra el documento inicial, sobre el que se han insertado el resto de marcos.

Pg. 8.1




Curso de Adobe Dreamweaver CS3. Tema 9. Formularios

Unidad 9. Formularios (I)

Vamos a ver qu es un formulario, para qu se utiliza, cmo insertar uno, qu elementos puede contener y cmo pueden validarse los datos introducidos en l.

Introduccin

Los formularios se utilizan para recoger datos de los usuarios, nos pueden servir para realizar un pedido en una tienda virtual, crear una encuesta, conocer las opiniones de los usuarios, recibir preguntas, etc.

Una vez el usuario rellena los datos y pulsa el botn para enviar el formulario se arrancar un programa que recibir los datos y har el tratamiento correspondiente.

Aqu vamos a ver cmo crear el formulario, (insertar campos y botones en el formulario y validarlos), pero no la parte de tratamiento de los datos, ya que para ello se necesitan nociones de programacin, ya sea en VBScript, en JavaScript o en otro lenguaje de programacin, y esto no entra en los objetivos del curso.

A la derecha tienes un ejemplo de formulario.

Un formulario est formado, entre otras cosas, por etiquetas, campos de texto, mens desplegables, y botones.

Elementos de formulario



Los elementos de formulario pueden insertarse en una pgina a travs del men Insertar, opcin Formulario.

A travs de esta opcin se puede acceder a la lista de todos los objetos de formulario que pueden ser insertados en la pgina.

Vamos a ver uno por uno algunos de los distintos elementos que pueden formar parte de un formulario, as como algunas de sus propiedades.

Campo de texto y rea de texto

Permiten introducir texto. El Campo de texto solo permite al usuario escribir una lnea, mientras que el rea de texto permite escribir varias.

Se puede pasar de Campo de texto a rea de texto a travs del inspector de propiedades, marcando la opcin Una lnea o Multi lnea respectivamente.

Tambin es posible definirlo como Contrasea es como el campo de texto pero las letras que va tecleando el usuario se sustituyen por un carcter como podrs ver en la imagen siguiente.

A continuacin tienes un ejemplo de cada uno de estos tres tipos. Puedes escribir en ellos para ver su funcionamiento.

A travs del inspector de propiedades es posible asignar tambin el Ancho del cuadro de texto, el nmero mximo de lneas o caracteres, y el valor inicial del cuadro.

Botn

Es el botn tradicional de Windows. El botn puede tener asignadas tres opciones: Enviar formulario, Restablecer formulario (borrar todos los campos del formulario), o Ninguna (para poder asignarle un comportamiento diferente de los dos anteriores).

Tambin es posible cambiar el texto del botn, a travs de la propiedad Etiqueta del inspector de propiedades.

Casilla de verificacin

Es un cuadrito que se puede activar o desactivar.

Deseo recibir informacin

Puede asignrsele el Estado inicial como Activado o como Desactivado.

Botn de opcin

Es un pequeo botn redondo que puede activarse o desactivarse. Si hay varios del mismo formulario, slo puede haber uno activado. Cuando se activa uno, automticamente se desactivan los dems.



Superman

Spiderman

Lista/Men

Una lista o men es un elemento de formulario que lleva asociada una lista de opciones.

Los elementos se aaden a travs del botn Valores de lista... del inspector de propiedades.

Cuando se trata de un men, solo es posible elegir uno de los elementos, pero si se trata de una lista, a travs de Selecciones del inspector de propiedades puede permitirse que se seleccionen varios simultneamente.

Etiqueta

Se utiliza para ponerle nombres al resto de elementos de formulario, para que el usuario pueda saber qu datos ha de introducir en cada uno de ellos.

Pg. 9.1




Curso de Adobe Dreamweaver CS3. Tema 10 Multimedia

Unidad 10. Multimedia (I)

Vamos a ver cmo insertar elementos multimedia. En concreto, veremos cmo insertar una animacin Flash, un sonido y un vdeo.

Pelculas Flash

Las pelculas Flash son animaciones, que al igual que los botones y el texto Flash, tienen la extensin SWF. Es frecuente verlas en las pginas iniciales de los sitios web, a modo de presentacin hacia los usuarios, aunque se pueden utilizar para realizar cualquier tipo de animacin.

Estas pelculas pueden crearse mediante el programa Flash de Macromeda, y necesitan que el usuario tenga instalado el plug-in para poder ser visualizadas.

Las pelculas Flash pueden insertarse en una pgina a travs del men Insertar, Media, opcin Flash, o pulsando Ctrl+Alt+F.

Tambin pueden insertarse pulsando sobre la opcin Flash que aparece en la pestaa Comn del panel Insertar, botn Media.

El inspector de propiedades de las pelculas Flash es prcticamente igual que el de los botones y el texto Flash, pero existen dos opciones nuevas que hacen referencia a la visualizacin de la pelcula.



La opcin Bucle indica que al finalizar la pelcula, sta volver a comenzar desde el principio.

La otra es la opcin Rep. autom. (reproduccin automtica), que al estar marcada indica que nada ms cargarse la pgina comenzar a reproducirse la pelcula Flash.

Si esta opcin no estuviera marcada, se mostrara nicamente el primer fotograma de la pelcula.

Interesa desmarcar esta opcin cuando se desea que la reproduccin sea activada por algn comportamiento.

Sonido

No es muy habitual incluir sonido en una pgina web, ya que algunos usuarios suelen estar escuchando su propia msica cuando navegan en Internet, por lo que el escuchar tambin sonido en cada pgina que se visita puede resultar algo molesto.

A pesar de ello, el incluir un sonido agradable, apropiado al contenido de la pgina, puede hacerla ms atractiva. Muchas de las pginas que contienen sonido suelen ofrecer la posibilidad de activarlo o desactivarlo, para que aquellos usuarios que no deseen escuchar el sonido de la pgina puedan desactivarlo.

Los formatos de sonido ms habituales en Internet son, fundamentalmente, el MP3, el WAV y en algunas ocasiones el MIDI, aunque existen otros formatos diferentes que tambin pueden utilizarse. Lo ideal es incluir algn archivo de audio que no ocupe mucho espacio, y que no por ello sea de mala calidad.

Para insertar un archivo de audio en un documento tienes que dirigirte al men Insertar, Meda, opcin Plug-in.

A la derecha tienes un ejemplo de un archivo de sonido, para el que se muestran los controles de audio. Si lo deseas, puedes reproducirlo pulsando sobre los controles (recuerda encender los altavoces, si los tienes).

En Dreamweaver no se mostrarn los controles de audio. Todos los archivos que son insertados como plug-in aparecen representadas dentro de Dreamweaver por una imagen como la de la izquierda.

En el inspector de propiedades pueden establecerse la altura y la anchura con la que se mostrarn los controles de audio, mediante Al y An.

En el caso de no especificar ningn tamao, se mostrar el tamao por defecto de los controles, como ocurre en el ejemplo de arriba. Si lo que se desea es que se escuche el sonido en la pgina, pero que no se muestren los controles de audio, los campos Al y An deben valer cero.

Los sonidos se reproducen automticamente al cargarse la pgina, y se reproducen solamente una vez. Estos valores no pueden definirse a travs del inspector de propiedades, pero s a travs del cdigo. Una vez definidos los podremos cambiar desde el inspector de propiedades con el botn Parmetros...

Por ejemplo, el archivo anterior apareca en el cdigo como . Pero para que no se reproduzca automticamente se ha aadido autostart="false", y para que se reproduzca continuamente se ha aadido loop="true".

La lnea de cdigo del archivo de audio ha quedado del siguiente modo:

En el Inspector de propiedades del sonido, el botn Parmetros... abre un cuadro de dilogo donde podemos cambiar esos valores una vez introducidos.



Para poder hacer que el audio pueda activarse y desactivarse cuando no se muestran los controles, es necesario insertar una serie de comportamientos que se encarguen de esa tarea.

Si quieres poner msica de fondo en una pgina web, sin que aparezcan los controles de audio, puedes escribir este cdigo directamente en la vista Cdigo.

Insrtalo despus de la etiqueta Con el parmetro loop puedes decidir cuntas veces quieres que se reproduzca, 1, 2, 3 ... (con -1 se reproduce de modo continuo).

Pg. 10.1




Curso de Adobe Dreamweaver CS3. Tema 11. Las plantillas

Unidad 11. Las plantillas (I)

En este tema vamos a ver qu son las plantillas, cmo crearlas y cmo basar documentos en ellas.

Introduccin

Cada vez que deseamos crear un sitio web, tenemos que tener muy en cuenta que las pginas deben seguir un formato uniforme.

La mayora de nosotros solemos hacer copias de los documentos ya creados, y trabajar sobre estas copias, modificando simplemente su contenido. Esta es la forma ms sencilla de tener pginas con una estructura basada en la estructura de otras ya creadas previamente.

Las plantillas son una especie de copia de la pgina en la que van a estar basadas el resto de pginas del sitio web, pero que incluyen la posibilidad de establecer unas zonas editables y otras zonas que sern fijas, que no podrn ser modificadas.

No es posible modificar las propiedades de una pgina que est basada en una plantilla, a excepcin del ttulo. Cuando se desea que existan pginas con, por ejemplo, diferente color de fondo, es necesario crear plantillas diferentes con los distintos colores, y basar las pginas en una u otra plantilla, segn el color de fondo que se desee para cada una.

Cuando se modifica el diseo de una plantilla, se pueden actualizar todas las pginas basadas en ella.

Las plantillas son archivos con la extensin DWT que se guardan en el sitio web, dentro de una carpeta llamada Templates.

Crear plantillas

Las plantillas pueden crearse desde cero, o a partir de una pgina ya existente.

Una forma de crear una plantilla desde cero es a travs del panel Archivos, pestaa Activos.

La pestaa Activos se puede abrir a travs del men Ventana, opcin Activos. Tambin pulsando F11.

Una vez abierto el panel hay que seleccionar el botn , para poder trabajar con las plantillas.


Curso de Adobe Dreamweaver CS3. Tema 11. Las plantillas

Los botones inferiores del panel Activos son similares a los del panel Estilos CSS.

El nico botn diferente es el primero, que en este caso sirve para actualizar la lista, el resto permiten crear una nueva plantilla, editar una plantilla seleccionada en la lista, o eliminarla.

Para crear una nueva plantilla hay que pulsar sobre el botn (Si este botn no est activado, pulsa con el botn derecho del ratn y elige Nueva Plantilla).

Cuando se pulsa ese botn aparece un nuevo documento en la lista de plantillas, al que es posible cambiarle el Nombre pulsando previamente sobre l.

Para modificar una plantilla la seleccionamos de la lista y pulsamos el botn .

Paraeliminar una plantilla la seleccionamos de la lista y pulsamos el botn .

Las plantillas se guardan en el sitio web actual, dentro de la carpeta Templates, que se crea automticamente.

Para crear una plantilla a partir de un archivo existente es necesario abrir dicho archivo, y despus guardarlo como plantilla a travs del men Archivo, opcin Guardar como plantilla.

Cuando se pulsa dicha opcin, aparece una ventana como la de la derecha.

En ella es necesario especificar el nombre con el que va a ser guardada la plantilla, a travs del campo Guardar como, y elegir, de entre la lista de sitios, el Sitio: en el que se va a guardar.

Pg. 11.1




Curso de Adobe Dreamweaver CS3. Tema 12. HTML desde Dreamweaver

Unidad 12. HTML desde Dreamweaver (I)

En este tema vamos a ver algunas de las facilidades que proporciona Dreamweaver para trabajar sobre el propio cdigo HTML, y no nicamente sobre el editor grfico de la vista diseo.

En este tema no se pretende ensearos el lenguaje HTML sino cmo poder realizar algunos reajustes directamente en el cdigo estando dentro de Dreamweaver.

Etiquetas

Ya sabes que el lenguaje HTML est basado en etiquetas que marcan el inicio y fin de cada elemento de la pgina Web.

En el primer tema vimos como ejemplo las etiquetas que hay que incluir en el cdigo HTML de una pgina para darle un ttulo. Consista simplemente en escribir el ttulo deseado entre las etiquetas y .

Las etiquetas consisten en poner un mismo comando entre los smbolos < y >. La primera etiqueta indica inicio, y la segunda, que incluye el smbolo /, indica final y se suele denominar etiqueta de cierre.

Las etiquetas disponen de atributos que permiten definir caractersticas del elemento sobre el que actan, incluyendo cierto cdigo dentro de la etiqueta.

Por ejemplo, un prrafo se inserta entre las etiquetas y , pero es posible cambiar sus caractersticas predeterminadas, como puede ser alinearlo a la derecha. Para ello, en lugar de introducir el texto del prrafo entre las etiquetas anteriores, ha de insertarse entre las etiquetas y .

Tambin hay elementos que no precisan insertar etiqueta de cierre. Por ejemplo, un May+INTRO dentro del cdigo HTML equivale a la etiqueta .

Tambin podrs ver la etiqueta en las pginas que sigan el estndar XHTML. ste obliga a que todas las etiquetas se cierren, incluso aquellas que no tienen etiqueta final, por lo que pasa a ser o a .

Dreamweaver inserta automticamente las etiquetas necesarias para construir la pgina con la apariencia y contenido definidos en el editor grfico, pero tambin ofrece otras posibilidades para trabajar directamente sobre el cdigo.

Entidades HTML



HTML tambin dispone de cdigos especiales para representar carceteres especiales como pueden ser letras con acentos o no pertenecientes al alfabeto latino internacional, signos de puntuacin o tipogrficos y smbolos especiales que presenten un problema en HTML como < >, que podran malinterpretarse por el inicio de una etiqueta.

Estos cdigos pueden mostrarse como un cdigo numrico o con un nombre de entidad. Ambos mtodos son igualmente aceptables, pero ambos debern ir encerrados entre los smbolos & y ;.

De este modo, < se escribir como < o <

Usar este mtodo es muy aconsejable, de esta forma los navegadores que estn configurados para visualizar juegos de caracteres que no contengan letras como la o la podrn ver el sitio correctamente. En caso contrario estos caracteres se mostraran de forma extraa.

En el tema 4 vimos que podamos escribir estos caracteres utilizando el men Insertar. Ahora te mostraremos otra forma para escribir caracteres que no se incluan en el listado de Dreamweaver y que podrs insertar escribiendo sus entidades en la vista de Cdigo.

Aqu tienes una tabla de los caracteres ms utilizados con sus Entidades HTML numrica y de nombre de entidad:

Carcter Entidad con nombre Entidad numrica Carcter

Entidad con nombre

Entidad numrica

&ntide;

&iexc;

< < < espacio

> > >

& & &

Si escribes ms de un espacio en Dreamweaver, cuando lo visualices en un Navegador slo veras uno. Esto http://www.aulaclic.es/dreamweavercs3/t_12_1.htm (2 de 3) [10/02/2008 19:47:16]


es debido a que en HTML las palabras separadas por ms de un espacio se visualizan sapradas de uno.

Para saltarte esta norma puedes escribir tantas veces como quieras y se visualizarn tantos espacios como elementos de entidad hayas introducido.

Si quieres ver una tabla con el listado de todos los caracteres especiales visita el avanzado de Listado de Entidades HTML .

Pg. 12.1




Curso de Adobe Dreamweaver CS3. Tema 13. Otros elementos

Unidad 13. Otros elementos (I)

Vamos a ver una serie de elementos que suelen aparecer en las pginas web, como pueden ser las marquesinas, las reglas horizontales y la fecha.

Marquesinas

Las marquesinas son texto, imgenes, o una mezcla entre texto e imgenes, que pueden desplazarse de un lado a otro de la ventana en forma de lnea. A continuacin tienes un ejemplo de marquesina.

Bienvenid@s a PerrosGatos

Las marquesinas no se pueden insertar a travs del editor grfico de Dreamweaver, es necesario hacerlo a travs del cdigo.

Para crear una marquesina hay que insertar las etiquetas y . Entre dichas etiquetas han de introducirse los elementos que se desea que aparezcan en la marquesina.

Tambin es posible especificar algunas caractersticas de la marquesina. La marquesina, por defecto, se desplaza de derecha a izquierda indefinidamente, pero si lo deseas puedes hacer que estas propiedades varen. Por ejemplo, si pones , la marquesina har el desplazamiento una sola vez y se detendr.

Si pones , en lugar de desplazarse continuamente de derecha a izquierda, la marquesina se desplazar de lado a lado de la ventana, como si rebotara en los extremos, tal y como ocurre en el ejemplo anterior, cuyo cdigo puedes ver a continuacin:

Bienvenid@s a PerrosGatos


Curso de Adobe Dreamweaver CS3. Tema 13. Otros elementos

Pg. 13.1




Curso de Adobe Dreamweaver CS3. Tema 14. Capas

Unidad 14. Capas

Vamos a ver algunas de las caractersticas bsicas sobre las capas, para luego poder trabajar con ellas y aplicarles algn comportamiento.

Introduccin

Las capas no son ms que unos recuadros, que pueden situarse en cualquier parte de la pgina (es decir, que tienen una posicin absoluta en la pgina), en los que podemos insertar contenido HTML. Dichas capas pueden ocultarse y solaparse entre s, lo que proporciona grandes posibilidades de diseo.

Las capas pueden moverse de una posicin a otra de la ventana pulsando sobre el recuadro blanco, y sin soltar el ratn, arrastrndola hacia la nueva posicin.

Tambin pueden ser redimensionadas pulsando sobre los recuadros negros, y arrastrndolos hasta conseguir el tamao deseado.

Dentro del recuadro de la capa es posible insertar texto, tablas, imgenes, animaciones flash, y todos los elementos que puede contener un documento HTML.

Este icono sirve para seleccionar la capa al pulsar sobre l, y al eliminarlo se elimina tambin la capa.

Insertar una capa

Las capas pueden insertarse en una pgina a travs del men Insertar, opcin Objeto de diseo, Div PA (Elemento con Posicin Absoluta).

Una vez se ha insertado la capa, pueden editarse sus atributos, pero para ello hay que seleccionarla primero.

Una capa puede seleccionarse de varias maneras. Una de ellas es pulsando sobre el icono correspondiente, pero esto no resulta til cuando existen muchas capas en un mismo documento, ya que todas las capas tienen asociada una imagen igual a esta, y no es fcil seleccionar la deseada a la primera.

Cuando existen varias capas en un mismo documento, es preferible seleccionarlas a travs de la pestaa Elementos PA del panel CSS, que puede abrirse a travs del men Ventana opcin Elementos PA. Tambin puedes abrir el panel pulsando F2.

En dicho panel aparecen los nombres de todas las capas que existen en el documento actual, y para seleccionar una de ellas simplemente hay que pulsar sobre el nombre en el panel.



Formato de una capa

Las propiedades de la capa se especifican a travs de su inspector de propiedades.

Elemento CSS-P es el nombre de la capa. Tambin puede ser cambiado a travs del panel Elementos PA, haciendo doble clic sobre l.

Izq y Sup indican la distancia en pxeles que hay entre los lmites izquierdo y superior del documento y la capa.

An y Al indican la anchura y la altura de la capa.

ndice Z es el nmero de orden de colocacin de las capas. Este valor tambin puede cambiarse a travs del panel Elementos PA. Una capa ser solapada por aquellas capas cuyo ndice Z sea mayor que el suyo.

Vis indica la visibilidad inicial de la capa. La visibilidad puede ser de cuatro tipos:

Default (visibilidad segn el navegador),

Inherit (se muestra la capa mientras la pgina a la que pertenece tambin se est mostrando),

Visible (muestra la capa, aunque la pgina no se est viendo) y

Hidden (la capa est oculta).

La visibilidad tambin puede cambiarse a travs del panel Elementos PA, pulsando sobre la imagen del ojo. El ojo abierto indica Visible, y el ojo cerrado indica Hidden.

A travs de Im. fondo y Col puede indicarse una imagen o un color de fondo para la capa.

Desb. (Desbordamiento) controla cmo aparecen las capas en un navegador cuando el contenido excede el tamao especificado de la capa.

Visible indica que el contenido adicional aparece en la capa. La capa se ampla para darle cabida.

Hidden (oculto) especifica que el contenido adicional no se mostrar en el navegador.

Scroll (desplazamiento) especifica que el navegador deber aadir barras de desplazamiento a la capa tanto si se necesitan como si no.

Auto (automtico) hace que el navegador muestre barras de desplazamiento para la capa cuando sean necesarias (es decir, cuando el contenido de la capa supere sus lmites).

Para practicar puedes realizar el Ejercicio paso a paso Insertar una capa.

Ejercicios del Tema 14. Prueba evaluativa del Tema 14.



Pg. 14.1




Unidad 15. Comportamientos (I)

En este tema vamos a ver las caractersticas bsicas de los comportamientos, as como un par de ejemplos de entre sus posibles aplicaciones.

Introduccin

Los comportamientos son acciones que suceden cuando los usuarios realizan algn evento sobre un objeto, como puede ser mover el ratn sobre una imagen, pulsar sobre un texto, hacer doble clic sobre un mapa de imagen, etc.

Los comportamientos no existen como cdigo HTML, se programan en JavaScript. Dreamweaver permite insertarlos a travs del panel Comportamientos, por lo que no es necesario escribir ninguna lnea de cdigo JavaScript para programarlos.

La imagen que aparece a continuacin tiene asociado un comportamiento. Sita el puntero sobre ella para ver qu es lo que ocurre.

La imagen tiene asociados dos comportamientos para mostrar y ocultar la capa. Este tipo de comportamiento lo veremos ms adelante.

Otros comportamientos que ya has visto son los que se aplican sobre las imgenes de sustitucin y las barras de navegacin, que ya estn predefinidos, por lo que no es necesario introducir este conjunto de comportamientos a travs del panel Comportamientos.

Para validar formularios ya viste algunas caractersticas del panel Comportamientos. Vamos a recordar las que necesitamos para poder insertar comportamientos ms tarde.

El panel Comportamientos se puede abrir a travs del men Ventana, opcin Comportamientos. Tambin pulsando Mays+F3.

Curso de Adobe Dreamweaver CS3. Tema 15. Comportamientos



En este panel hay que desplegar el botn pulsando sobre l, y en Mostrar eventos para elegir una versin de la lista de navegadores.

Algunos comportamientos no funcionan para algunos navegadores, por lo que dependiendo del navegador elegido aparecern unos u otros comportamientos posibles.

Existen comportamientos que funcionan en Internet Explorer pero no en Netscape. Debido a que la mayora de usuarios utiliza Internet Explorer, vamos a seleccionar este navegador. Puedes seleccionar alguna de sus ltimas versiones: IE 5.5 o IE 6.0.

Una vez elegido un navegador ya no es necesario volver a elegirlo las siguientes veces que se desee insertar algn comportamiento.

Insertar un comportamiento

Cuando ya hay establecido algn navegador, ya se pueden insertar comportamientos.

Lo primero que hay que hacer es seleccionar el objeto sobre el que se ha de aplicar el comportamiento, como puede ser una imagen, un fragmento de texto, etc.

Al desplegar el botn del panel Comportamientos aparece la opcin Mostrar eventos para, a travs de la cual se haba elegido el navegador. Tambin aparece la lista de todas las acciones posibles para el navegador elegido previamente, de entre las que se puede seleccionar una.

Segn el elemento sobre el que se desee aplicar el comportamiento, se podrn elegir unas acciones, mientras que otras no.

En este caso la accin Validar formulario no puede seleccionarse porque no existe ningn formulario en la pgina.

Despus de elegir alguna accin, el comportamiento correspondiente aparece en el panel Comportamientos. En este caso se han insertado dos comportamientos.

Como puedes ver, cada comportamiento tiene asociados un evento y una accin.

Las acciones son las que se han elegido en la lista anterior y el evento indica cundo se debe de realizar la accin.

Para eliminar un comportamiento, hay que seleccionarlo en el panel Comportamientos y pulsar sobre el botn . Tambin es posible cambiar el orden de los comportamientos aplicados a un objeto, seleccionndolos

y ordenndolos mediante los botones .



Pg. 15.1




Curso de Adobe Dreamweaver CS3. Tema 16. Comportamientos Avanzados

Unidad 16. Comportamientos Avanzados (I)

En el tema anterior vimos algunos de los comportamientos bsicos, en este tema veremos otros comportamientos y veremos cmo utilizarlos y aprovecharnos de esta caracterstica de Dreamweaver para crear diversas funcionalidades automticamente.

Mensajes emergentes

Este comportamiento te permitir crear avisos emergentes como en el siguiente ejemplo.

Haz clic aqu.

Este comportamiento es til para poder enviar mensajes al usuario. Ten en cuenta que no debers abusar de ellos, pues a la larga pueden resultar un poco incmodos, utilzalos con un objetivo concreto y no porque quieras atraer la atencin del usuario.

Para crear un mensaje emergente debers seleccionar el elemento al cual ir asociado el mensaje, en el ejemplo es un texto.

Una vez seleccionado ves al panel Comportamientos (Mayus+F4) pulsa el botn y selecciona la opcin Mensaje emergente.

Se abrir el siguiente cuadro de dilogo:

Aqu debers introducir el Mensaje que quieras que se muestre. Pulsa Aceptar cuando hayas acabado y estar listo.

Es aconsejable que asocies este comportamiento al evento onClick (cuando el usuario hace clic). Es ms intuitivo para el usuario, por ejemplo, si asocias el mensaje a un evento onMouseOver (cuando se pase el ratn por encima) el usuario no sabr muy bien porque se ha generado el mensaje de aviso.

En realidad no habr hecho ningn movimiento voluntario para recibir ese tipo de respuesta. Debido a esto (el estimulo-respuesta que espera el usuario), el evento onClick es el ms indicado para este caso.



Texto de la Barra de Estado

El Texto de la Barra de Estado es un elemento muy utilizado a la hora de personalizar una pgina web. Aunque no funciona en algunos navegadores.

Si observas esta barra cuando navegas vers que va cambiando su texto segn te encuentres sobre un enlace o no. Normalmente, las pginas que no tratan la Barra de Estado (por ejemplo, esta) no muestran ninguna informacin. nicamente cuando posicionas el puntero sobre un enlace el texto de la Barra cambia para mostrar la direccin a la que este se dirige.

Observa este ejemplo, si haces clic sobre l te llevar a la pgina principal de aulaClic.

Cambiar el Texto de la Barra de Estado significara modificar el texto que aparece en ese momento cuando realizamos un evento sobre un elemento en particular. Por ejemplo:

aulaClic.es

Este comportamiento es muy til para personalizar mucho ms tu pgina y mostrar informacin que de otra forma no sera posible. Aunque no todos los navegadores son capaces de responder a este comportamiento.

Para crear este comportamiento selecciona el elemento al cual quieres asociar este comportamiento. Abre el panel Comportamientos (Mayus+F4) y pulsa el botn .

Luego selecciona la opcin Definir texto y haz clic en Establecer texto de la barra de estado.

Aqu debers escribir el texto que quieres que aparezca en el cuadro Mensaje, luego pulsa Aceptar y listos.

Dnde y cmo asociar el texto en una pgina? es sencillo. Una de las opciones que te da este comportamiento es poder asociar un texto en concreto a la pgina en s.

Es decir, que cuando abras una pgina se muestre inmediatamente (y permanentemente) un texto en la barra de estado. Eso es posible creando el mensaje asociado al body de la pgina (para ello tendrs que insertar el comportamiento sin seleccionar ningn elemento para que se asocie con toda la pgina) y lanzndolo en el evento onLoad (en la carga del documento). De esta forma cuando se abra la pgina se mostrar el mensaje en la barra de estado y permanecer all hasta que se produzca un cambio (por ejemplo, que se posicione el cursor sobre un enlace).

Ahora veamos cmo debemos actuar al establecer texto para los enlaces. En este caso ser necesario que introduzcamos dos comportamientos.

El primero, asociado al evento onMouseOver (cuando el ratn se encuentra encima) que mostrar el mensaje que queramos.

El segundo deber ir asociado al evento onMouseOut (cuando el ratn deja de estar encima) que deber limpiar la



barra de estado para que recupere su estado anterior.

En el caso de que hubisemos establecido un mensaje para el body de la pgina, al salir de un enlace (en el onMouseOut) deberemos volver a escribir ese mensaje para que siga mostrndose.

En el caso de que la pgina no tuviese un mensaje personalizado, deja el cuadro Mensaje en blanco para que la barra de estado recupere su estado natural.

Observa que si no estableces el segundo comportamiento, cuando posiciones el ratn sobre el enlace (o imagen, prrafo..., da igual) el texto de la barra de estado cambiar. Pero cuando el ratn deje de estar sobre el elemento no habr ninguna orden para que el texto vuelva a cambiar y se mantendr fijo con el mensaje del anterior comportamiento.

Pg. 16.1




Curso de Adobe Dreamweaver CS3. Tema 17. Estilos CSS Avanzado

Unidad 17. Estilos CSS Avanzado (I)

En temas anteriores vimos cmo funcionaba el Panel CSS y cmo crear hojas de estilos para poder utilizarlas en tus pginas web.

En este tema aprenderemos ms sobre CSS, pero orientndonos ms a qu es CSS y cmo crear estilos CSS para crear pginas que sigan los fundamentos y reglas marcadas por el W3C (Word Wide Web Consortium).

Esta metodologa exige que el archivo HTML solamente muestre datos organizados y estructurados con etiquetas de marcacin HTML, mientras que la parte de formato recaera sobre los estilos CSS nica y exclusivamente.

Para poder lograr esto deberemos dominar en profundidad CSS para poder posicionar, modificar o adornar la pgina de un modo eficiente.

En este tema aprenderemos controles que nos ayudarn a presentar el texto e imgenes de nuestras pginas de una forma mucho ms limpia y cmoda.

Aplicar estilos CSS

Hasta ahora, si has entrado un poco en el cdigo de las pginas, habrs visto etiquetas que introducan estilos CSS en ellas.

La forma ms habitual de presentarse es en la seccin head de la pgina de esta forma:

Curso de Adobe Dreamweaver CS3. Tema 17. Estilos CSS Avanzado

En este caso deberemos crear un archivo CSS (Archivo Nuevo y seleccionando CSS) donde escribiremos las reglas de estilo del mismo modo en el que hemos visto ms arriba pero eliminado el componente HTML:

body {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

text-align: center;

background: url('imagenes/fondo.gif') repeat-x bottom;

}

Luego deberamos vincularlo en la pgina HTML utilizando la etiqueta link:

Una pgina puede contener ambos tipos de estilos CSS, como por ejemplo, tener un archivo vinculado y luego un bloque de estilo incrustado. O incluso tener varias hojas de estilo asociadas.

La organizacin de los estilos debes decidirla t. Pero recuerda que cuanto menos cdigo repitas en tus pginas, ms fcil ser luego de modificar o exportar.

Tambin es posible declarar el estilo en lnea. Es decir, tal y como se van creando las etiquetas HTML, para ello debers utilizar el atributo style:

Este texto est en rojo y con un tamao de 30 pxeles

El estilo en lnea es ms desaconsejado porque es ms difcil de modificar al tener que buscarlo por el texto y modificndolo uno a uno.

Para practicar realiza el Ejercicio Paso a Paso de Creacin de una Hoja de Estilo.

Pg. 17.1




Curso de Adobe Dreamweaver CS3. Tema 18. Sitios Remotos

Unidad 18. Sitios Remotos (I)

En el tema 3 vimos cmo crear y trabajar con un sitio local.

Esta unidad est dedicada a los Sitios Remotos, veremos cmo crearlos y cmo utilizarlos.

Definir un sitio remoto significa establecer una configuracin de modo que Dreamweaver sea capaz de comunicarse directamente con un servidor en Internet (por eso se llama remoto) y as poder trabajar a la vez con tus archivos en el sitio local, es decir, la copia que tienes en tu ordenador, y en el sitio remoto, colgados en el servidor, en Internet.

El modo en el que veremos que el programa se comunica con tu servidor ser FTP, ya que es prcticamente el ms utilizado y muy pocos utilizan otras alternativas.

Configurar un Sitio Remoto

Muy bien, ahora veamos los pasos que tenemos que seguir para configurar las opciones y que Dreamweaver se pueda conectar con nuestro servidor.

Para ello deberemos modificar la especificacin que creamos en su da del sitio con el que estamos trabajando.

As que haz clic en Sitio y selecciona Administrar sitios.

Selecciona el sitio con el que quieras establecer comunicacin remota (o crea uno nuevo para el caso) y pulsa Editar.

Vers que se abre el cuadro de dilogo de Definicin del Sitio.

Ahora podremos escoger entre trabajar en modo bsico o avanzado. Vamos a seleccionar la pestaa Avanzado para poder ver con ms detenimiento las opciones que se nos ofrecen.

Una vez ests en el nuevo modo, selecciona la Categora Datos remotos en el listado de la izquierda.

Ahora en el desplegable Acceso selecciona el mtodo de acceso que deber utilizar Dreamweaver para conectarse con el servidor. Como ya hemos dicho nosotros explicaremos la opcin FTP.

Se mostrarn las siguientes opciones:


Curso de Adobe Dreamweaver CS3. Tema 18. Sitios Remotos

Aqu debers rellenar los datos que te facilit el servicio de hosting que contrataste. Si no recuerdas los datos o has perdido el correo electrnico que seguramente te enviaron, pdeles de nuevo la informacin.

Los datos que necesitrs son los siguientes:

Servidor FTP o host es la direccin a la que se dirigir Dreamweaver para conectarse a tu servidor ser del tipo ftp.servidor.com o tambin podrs encontrar algunas que estn formadas en forma de direccin IP (como por ejemplo, 192.186.1.1)

En el campo Directorio del Servidor podremos establecer una carpeta contenida en el servidor donde queramos subir las pginas.

Imagina que dentro de la estructura de carpetas del servidor romoto tienes una que se llama pagina y dentro de esta otra que se llame principal. Podramos indicar la ruta pagina/principal para que los archivos se subiesen directamente a esa ubicacin.

En Usuario y Contrasea escribe el nombre de usuario y el password para poder conectar con el servidor. Marca la casilla Guardar si quieres que el programa recuerde la contrasea.

Una vez introducidos estos datos puedes pulsar el botn Probar para ver si son correctos y Dreamweaver puede crear una conexin con el servidor remoto.

Finalmente comentaremos la opcin Permitir desproteger y proteger archivo. Esta casilla es til cuando ms de una persona est utilizando el mismo servidor y las mismas pginas. De esta forma (como veremos ms adelante) podrs bloquear diversos archivos para evitar que se vean modificados por otra persona (que tambin tenga acceso al servidor) mientras t trabajas con ellos.

Si seleccionas la opcin Cargar archivos en el servidor automticamente al guardar forzars a que Deamweaver suba los archivos cada vez que los guardes. Una opcin bastante til para no olvidar subir pequeos retoques que se vayan haciendo en el tiempo. Aunque es una opcin un poco peligrosa porque si modificas la versin en local y te equivocas no podrs recuperar la versin anterior que estaba almacenada en el remoto porque se habr sobreescrito. Esta opcin tampoco es recomendable si no tienes conexin permanente y rpida a Internet.


Documents

Curso Dreamweaver CS3