Este libro es un manual de aprendizaje idóneo tanto para principiantes como usuarios con un cierto nivel de conocimientos que deseen profundizar en algunos aspectos del programa. Se trabaja sobre la versión CS5. Una vez completado este curso de iniciación, el lector deberá dominar el trabajo con las diferentes herramientas: creación de tablas, marcos, estilos, capas, plantillas, formularios, utilización de objetos multimedia, Adobe Bridge para gestionar las imágenes, Fireworks para crear iconos, botones estáticos o dinámicos y lo más importante, la integración con las bases de datos para sacar el máximo rendimiento a una página web.
A lo largo del libro se realizan todo tipo de prácticas que le facilitarán la comprensión de los diferentes conceptos para poder diseñar una web.
A QUIÉN VA DIRIGIDO
Principiantes o usuarios con un nivel medio. Windows o Mac indistintamente.
EL MÉTODO
El libro está estructurado en veintidós capítulos desarrollándose en cada uno de ellos paso a paso un tema determinado. En el penúltimo capítulo se trabaja con un caso ficticio donde se ponen en práctica todos los conocimientos adquiridos anteriormente para que el lector pueda aplicarlos.
LAS PRÁCTICAS
Las imágenes y los textos necesarios para realizar los ejercicios incluidos, se pueden descargar de la web de Inforbook’s, tal y como se detalla al inicio del
libro.
SE ESTUDIA
· Dreamweaver CS5
· Teoría de base de datos y SQL
· Adobe Bridge CS5
· Fireworks CS5
Índice:
1. Introducción a Dreamweaver CS5................... 13
Novedades de Dreamweaver CS5.................................................................... 13
2. Instalación de Dreamweaver CS5.................... 17
Requisitos del Sistema y del Hardware............................................................ 17
Requisitos mínimos para Windows.............................................................. 18
Requisitos mínimos para Macintosh............................................................ 18
Instalación de Dreamweaver CS5..................................................................... 18
Instalación de la aplicación XAMPP.................................................................. 21
3. Primer contacto con Dreamweaver CS5.......... 25
Arranque de Dreamweaver CS5............................................................................ 25
¿Cómo arrancar Dreamweaver CS5?.................................................................... 25
La ventana de Dreamweaver CS5......................................................................... 25
Uso de la Ayuda de Dreamweaver......................................................................... 31
4. El entorno de trabajo...................................... 33
La barra de menús............................................................................................ 33
Menú Archivo............................................................................................... 33 Menú Edición............................................................................................... 35 Menú Ver...................................................................................................... 37
Menú Insertar............................................................................................... 40
Menú Modificar............................................................................................ 41
Menú Formato.............................................................................................. 42
Menú Comandos.......................................................................................... 43
Menú Sitio.................................................................................................... 44
Menú Ventana.............................................................................................. 45
Menú Ayuda................................................................................................. 46
Uso de los paneles............................................................................................ 47
Cómo visualizar un panel............................................................................. 47
Cómo ocultar un panel................................................................................. 48
Cómo modificar el tamaño de un panel....................................................... 48
Cómo cambiar la ubicación de un panel...................................................... 48
5. Introducción a las páginas web....................... 49
Web estática..................................................................................................... 49
Ventajas e inconvenientes........................................................................... 52
Web dinámica................................................................................................... 52
Ventajas e inconvenientes........................................................................... 54
Elementos de una página web.......................................................................... 54
6. La primera página web.................................... 55
Crear una página web....................................................................................... 55
Vista previa de una página........................................................................... 60
Formateo del texto de una página............................................................... 63
Formateo de párrafos de una página........................................................... 72
Modificación de las Propiedades de la página............................................. 76
Inserción de una regla horizontal................................................................. 80
7. Utilización de los estilos.................................. 83
Introducción a las hojas de estilo (CSS)........................................................... 83
Definición de los estilos..................................................................................... 85
Reglas CSS................................................................................................. 87
Trabajar con estilos CSS en Dreamweaver...................................................... 88
Cómo trabajar con un estilo......................................................................... 90
Propiedades de Fuente de estilos.......................................................... 94
Propiedades de Fondo de estilos........................................................... 95
Propiedades de Bloque de estilos.......................................................... 95
Propiedades de Borde de estilos............................................................ 96
Propiedades de Cuadro de estilos.......................................................... 96
Propiedades de Lista de estilos.............................................................. 97
Propiedades de Posición de estilos........................................................ 97
Propiedades de Extensiones de estilos.................................................. 98
Propiedades de Tablas, Contenido, Comillas de estilos......................... 98
Cómo averiguar las propiedades de un estilo.............................................. 99
Cómo añadir una nueva regla (estilo).......................................................... 99
Definición de las propiedades CSS...................................................... 100
Cómo modificar una regla (estilo).............................................................. 106
Cómo eliminar una regla (estilo)................................................................ 107
Cómo añadir una regla en una hoja externa.............................................. 108
Cómo adjuntar una hoja de estilo externa...................................................... 110
Cómo validar el código CSS............................................................................111
8. Utilización de imágenes................................. 115
Tipos de imágenes.......................................................................................... 115
Imágenes vectoriales................................................................................. 115
Imágenes de mapa de bits (bitmaps)......................................................... 116
Resolución de un monitor.......................................................................... 117
Resolución de una imagen........................................................................ 1185
Formatos de imagen....................................................................................... 119
GIF (Graphic Interchange Format, Formato de Intercambio de Gráficos)... 119
JPEG (Joint Photographic Experts Group, Grupo de Conjunto de
Expertos Fotgráficos)............................................................................ 119
PNG (Portable Network Group, Grupo de Redes Portátiles)................ 120
El color............................................................................................................ 120
Trabajar con imágenes.................................................................................... 121
Insertar imágenes...................................................................................... 122
Imágenes de sustitución............................................................................ 127
Mapas de imágenes................................................................................... 129
Barras de navegación................................................................................ 133
Animación de imágenes............................................................................. 138
9. Utilizar tablas en una página web.................. 143
Trabajar con tablas.......................................................................................... 143
Creación de una página web con tablas.................................................... 144
Cómo seleccionar los elementos de una tabla.......................................... 148
Selección de toda la tabla..................................................................... 148
Selección de una o varias filas y columnas.......................................... 148
Selección de una columna.................................................................... 149
Selección de una celda......................................................................... 149
Selección de celdas adyacentes........................................................... 149
Selección de celdas no adyacentes...................................................... 149
Cómo combinar celdas.............................................................................. 150
Cómo insertar filas y/o columnas............................................................... 152
Inserción de una fila o columna............................................................ 152
Inserción de más de una fila o columna............................................... 153
Modificar las propiedades de la tabla........................................................ 154
Cómo eliminar una fila y/o columna........................................................... 160
Cómo dividir celdas.................................................................................... 160
Creación de las páginas vinculadas................................................................ 161
Importación de datos....................................................................................... 166
Importar XML en plantilla........................................................................... 166
Importar Datos de tabla............................................................................. 166
Importar Documento de Word.................................................................... 167
Importar Documento de Excel................................................................... 167
Modificación de las propiedades de los vínculos....................................... 171
10. Trabajar con capas..................................... 173
¿Qué son las capas?...................................................................................... 173
Etiquetas Div................................................................................................... 174
Inserción de etiquetas Div.......................................................................... 174
Modificación de etiquetas Div.................................................................... 175
Eliminación de etiquetas Div...................................................................... 175
Etiquetas Div PA.............................................................................................. 175
Inserción de etiquetas Div PA.................................................................... 175
Modificación de etiquetas Div PA............................................................... 176
Eliminación de etiquetas Div PA................................................................. 176
El entorno Spry............................................................................................... 176
Efectos que puede utilizar con Spry.......................................................... 176
Ejemplo práctico con capas............................................................................ 177
Definición de los estilos CSS para las estiquetas Div PA.......................... 178
Definición de las capas Div........................................................................ 181
Aplicación de un efecto Spry................................................................ 184
Definición del resto de las capas............................................................... 187
Spry Widgets................................................................................................... 193
¿Para qué sirve un Spry Widget?.............................................................. 193
Cómo insertar un Spry Widget................................................................... 194
Barra de menús Spry................................................................................. 195
Configuración de un menú Spry........................................................... 196
Ejemplo de menú Spry............................................................................... 197
Panel de fichas Spry.................................................................................. 198
Configuración de un panel de fichas Spry............................................ 198
Ejemplo de panel de fichas Spry............................................................... 201
Acordeón Spry........................................................................................... 205
Configuración de un Acordeón Spry..................................................... 206
Ejemplo de Acordeón Spry........................................................................ 206
Panel que puede contraerse de Spry........................................................ 209
Configuración de un panel que puede contraerse de Spry................... 209
Ejemplo de panel que puede contraerse de Spry...................................... 210
Información sobre herramienta de Spry..................................................... 210
Configuración de información sobre herramienta de Spry.................... 211
Ejemplo de información sobre herramienta de Spry.................................. 212
11. Trabajar con formularios............................ 217
Cómo crear un formulario HTML..................................................................... 217
Campo de texto............................................................................................... 221
Campo oculto.................................................................................................. 223
Área de texto................................................................................................... 224
Casilla de verificación..................................................................................... 225
Grupo de casillas de verificación.................................................................... 226
Botón de opción.............................................................................................. 227
Grupo de opción.............................................................................................. 228
Lista/menú....................................................................................................... 229
Menú de salto.................................................................................................. 231
Campo de imagen........................................................................................... 233
Campo de archivo........................................................................................... 234
Botón............................................................................................................... 235
Etiqueta........................................................................................................... 236
Juego de campos............................................................................................ 237
Campo de texto de validación Spry................................................................ 237
Área de texto de validación de Spry............................................................... 240
Casilla de verificación de validación de Spry.................................................. 2427
Selección de validación de Spry..................................................................... 243
Contraseña de validación de Spry.................................................................. 245
Confirmación de validación de Spry................................................................ 247
Grupo de opciones de validación de Spry...................................................... 249
Creación de un formulario............................................................................... 250
Inserción del formulario.............................................................................. 251
Inserción de los datos del comprador........................................................ 253
Inserción de los datos del libro.................................................................. 257
Inserción del cuestionario.......................................................................... 259
Lista de Eventos.............................................................................................. 261
12. Trabajar con marcos................................... 263
Ventajas e inconvenientes de los marcos....................................................... 264
Ventajas..................................................................................................... 264
Inconvenientes........................................................................................... 264
Cómo crear marcos......................................................................................... 265
Creación de una página con marcos.............................................................. 267
Propiedades del conjunto de marcos......................................................... 268
Cómo almacenar un conjunto de marcos....................................................... 270
Almacenar un archivo de un conjunto de marcos...................................... 270
Almacenar todos los archivos asociados a un documento........................ 270
Diseño del marco............................................................................................ 271
Diseño del marco Cabecera...................................................................... 271
Propiedades de un marco.......................................................................... 272
Diseño del marco Opciones....................................................................... 274
Diseño del marco Contenido...................................................................... 276
Eliminación de un marco................................................................................. 281
Cambio del tamaño de un marco.................................................................... 281
13. Multimedia con Dreamweaver...................... 283
Aspectos importantes de los archivos de vídeo.............................................. 283
Reproductores multimedia......................................................................... 284
Cómo incorporar archivos de vídeo a una página.......................................... 284
Vinculación de un vídeo............................................................................. 285
Incorporación de un vídeo......................................................................... 286
Cómo incorporar archivos de sonido a una página......................................... 288
Vinculación de un archivo de sonido.......................................................... 289
Incorporación de un archivo de sonido...................................................... 289
14. Definición de un sitio web........................... 293
Aspectos a tener en cuenta a la hora de diseñar un Sitio............................... 293
Sitios en Dreamweaver................................................................................... 294
Cómo definir un sitio web................................................................................ 295
Configuración de las opciones para un acceso FTP ................................. 296
Configuración de las opciones para un acceso Local/red......................... 298
Planteamiento de un sitio web........................................................................ 301
Creación de un sitio web................................................................................. 302
Sincronización de archivos........................................................................ 307
Comprobación de vínculos........................................................................ 308
Informe del sitio.......................................................................................... 309
Probar un sitio web........................................................................................ 312
Aspectos finales a tener en cuenta al crear un sitio web en Dreamweaver...........313
15. Trabajar con plantillas................................ 315
Las plantillas................................................................................................... 315
Cómo crear una plantilla................................................................................. 317
Creación de una plantilla nueva................................................................. 317
Creación de una plantilla a partir de un documento existente................... 319
Cómo definir regiones editables...................................................................... 320
Cómo crear regiones repetidas....................................................................... 321
Cómo insertar una tabla repetida............................................................... 322
Cómo crear un atributo de etiqueta editable................................................... 323
Cómo crear una región opcional..................................................................... 324
Cómo crear una región opcional no editable............................................. 325
Cómo crear una región opcional editable.................................................. 326
Plantillas anidadas.......................................................................................... 326
Cómo crear una plantilla anidada................................................................... 327
Cómo quitar formato de plantilla..................................................................... 327
Ejercicio práctico con plantillas....................................................................... 327
Creación de la plantilla............................................................................... 328
Definición de una región con atributo de etiqueta editable........................ 329
Cómo modificar un atributo de etiqueta editable.................................. 333
Definición de una región editable............................................................... 334
Definición de una región repetida.............................................................. 335
Definición de una región opcional editable................................................ 336
Uso de una plantilla......................................................................................... 338
Cómo aplicar plantillas a documentos existentes........................................... 347
Ejemplo práctico........................................................................................ 348
16. Introducción a las Bases de Datos.............. 351
¿Qué es una Base de datos?......................................................................... 351
Uso de las Bases de datos relacionales......................................................... 352
Claves de una base de datos.......................................................................... 353
Claves externas......................................................................................... 354
Tipos de relación............................................................................................. 354
Reglas de integridad....................................................................................... 356
Normalización de una base de datos.............................................................. 356
Primera forma normal................................................................................ 356
Segunda forma normal.............................................................................. 358
Tercera forma normal................................................................................. 359
Cuarta forma normal.................................................................................. 360
Quinta forma normal.................................................................................. 3609
17. Introducción al lenguaje SQL...................... 363
Sentencias SQL.............................................................................................. 364
Sentencia SELECT.................................................................................... 365
Cláusulas SQL...................................................................................... 365
ORDER BY........................................................................................... 365
GROUP BY........................................................................................... 366
WHERE................................................................................................. 367
Operadores SQL................................................................................... 367
HAVING................................................................................................ 369
Funciones SQL..................................................................................... 370
Sentencia CREATE.................................................................................... 371
Sentencia INSERT..................................................................................... 372
Sentencia UPDATE.................................................................................... 373
Sentencia DELETE.................................................................................... 373
Sentencia INNER JOIN.............................................................................. 374
Prácticas de SQL............................................................................................ 374
Soluciones a las prácticas anteriores........................................................ 380
18. Trabajar con Bases de Datos....................... 385
Creación de la base de datos......................................................................... 385
Cómo configurar la base de datos.................................................................. 391
Cómo conectar una base de datos................................................................. 393
Cómo vincular datos a una página PHP......................................................... 397
19. Adobe Bridge CS5....................................... 403
¿Qué es Bridge?............................................................................................. 403
Ejecutar Bridge................................................................................................ 403
Menú Archivo............................................................................................. 404
Menú Editar................................................................................................ 406
Menú Vista................................................................................................. 408
Menú Pilas................................................................................................. 410
Menú Etiqueta............................................................................................ 411
Menú Herramientas................................................................................... 412
Menú Ventana............................................................................................ 413
Paneles........................................................................................................... 413
Editar los metadatos.................................................................................. 415
Añadir palabras clave a archivos............................................................... 417
Añadir un conjunto de palabras clave a archivos...................................... 418
Eliminar palabras clave de un archivo....................................................... 418
Crear un nuevo conjunto de palabras clave.............................................. 418
Crear una nueva palabra clave.................................................................. 419
Eliminar una palabra clave......................................................................... 419
Ordenar........................................................................................................... 419
Buscar............................................................................................................. 420
20. Utilización de Fireworks.............................. 421
¿Qué es Fireworks?........................................................................................ 421
¿Para qué sirve?............................................................................................. 421
Creación de un archivo desde Fireworks........................................................ 421
Exportar una imagen de Fireworks................................................................. 425
Inserción HTML de Fireworks......................................................................... 426
Definición de un editor externo....................................................................... 427
Editar una imagen desde Dreamweaver......................................................... 427
Creación de una imagen animada.................................................................. 428
Creación de un Menú emergente.................................................................... 429
21. Diseño de una página web........................... 435
Consejos para diseñar una web...................................................................... 435
Descripción del proyecto................................................................................. 439
Creación de la base de datos......................................................................... 440
Importar la base de datos.......................................................................... 441
Definición del sitio........................................................................................... 442
Creación de la página de inicio....................................................................... 443
Creación de la página de metodología........................................................... 450
Creación de la página de cursos..................................................................... 451
Creación de la página principal del catálogo.................................................. 459
Creación de la página del catálogo............................................................ 461
Creación del archivo PHP basado en plantilla...................................... 461
Creación de la página de contenido del catálogo................................. 466
Creación de la página + información.................................................... 468
Creación del formulario de pedidos................................................................ 472
Creación de la página de contacto.................................................................. 482
Creación del buscador.................................................................................... 483
Comprobación del sitio.................................................................................... 490
22. Ejercicios prácticos en PHP........................ 497
Ejercicios......................................................................................................... 497
Soluciones de los ejercicios............................................................................ 500