Utilizacin de Dreamweaver

Marcas comerciales 1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central, ColdFusion, Contribute, Database Explorer, Director, Dreamweaver, Fireworks, Flash, FlashCast, FlashHelp, Flash Lite, FlashPaper, Flex, Flex Builder, Fontographer, FreeHand, Generator, HomeSite, JRun, MacRecorder, Macromedia, MXML, RoboEngine, RoboHelp, RoboInfo, RoboPDF, Roundtrip, Roundtrip HTML, Shockwave, SoundEdit, Studio MX, UltraDev y WebHelp son marcas comerciales registradas o marcas comerciales de Macromedia, Inc. y pueden estar registradas en Estados Unidos o en otras jurisdicciones, incluidas las internacionales. Otros nombres de productos, logotipos, diseos, ttulos, palabras o frases mencionados en esta publicacin pueden ser marcas comerciales, marcas de servicio o nombres comerciales de Macromedia, Inc. u otras entidades y pueden estar registrados en determinadas jurisdicciones. Informacin de otros proveedores Este manual contiene vnculos con sitios Web de terceros que no estn bajo el control de Macromedia, por lo que Macromedia no es responsable del contenido de ninguno de los sitios vinculados. Si obtiene acceso a un sitio Web de terceros mencionado en este manual, lo har por su cuenta y riesgo. Macromedia proporciona estos vnculos exclusivamente para su comodidad, por lo que la inclusin del vnculo no implica la aceptacin de responsabilidad alguna por parte de Macromedia por el contenido de dichos sitios de terceros. Copyright 1997-2005 Macromedia, Inc. Todos los derechos reservados. Este manual no se puede copiar, fotocopiar, reproducir, traducir ni convertir a ningn formato electrnico o legible por mquina, en su parte o en su totalidad, sin el permiso previo y por escrito de Macromedia, Inc. A pesar de lo establecido anteriormente, el propietario o el usuario autorizado de una copia legal del software junto al que se proporciona este manual puede imprimir una copia de la documentacin a partir de su versin electrnica con el nico fin de aprender a utilizar dicho software, teniendo en cuenta que ninguna parte de este manual se puede imprimir, reproducir, distribuir, revender ni transmitir con otros fines entre los que se incluyen, sin limitarse a ellos, la venta de copias de esta documentacin o el ofrecimiento de servicios de soporte no gratuitos. Agradecimientos Direccin del proyecto: Charles Nadeau Redaccin: Michael Varese Redaccin adicional: Jennifer Rowe, Paul Gubbay, Charles Nadeau Edicin: Rosana Francescato, Lisa Stanziano, Anne Szabla, Mary Ferguson, Mark Nigara Produccin y administracin de edicin: Patrice ONeill y Rosana Francescato Produccin y diseo multimedia: Adam Barnett, Aaron Begley, Paul Benkman, John Francis, Geeta Karmarkar, Paul Rangel, Arena Reed, Mario Reynoso Administracin de la localizacin: Melissa Baerwald Nuestro especial agradecimiento a Sheila McGinn, Paul Gubbay, Vic Mitnick, Jim Doubek, Joaquin Blas, Wenlan Du, Ken Karleskint, Jennifer Taylor, Jorge Taylor, Nick Halbakken, Scott Richards, Sami Kaied, John Skidgel, Masayo Noda, Kristin Conradi, Yuko Yagi, a los responsables de verificar la versin beta y a los equipos de ingeniera y control de calidad de Dreamweaver. Primera edicin: septiembre de 2005 Macromedia, Inc. 601 Townsend St. San Francisco, CA 94103

Contenido

PARTE 1: ASPECTOS BSICOS DE DREAMWEAVER Introduccin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Novedades de Dreamweaver 8. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Por dnde empezar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Flujo de trabajo de Dreamweaver para la creacin de sitios Web. . . Utilizacin de Dreamweaver con otras aplicaciones . . . . . . . . . . . . . . Dreamweaver y accesibilidad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Gua de recursos de formacin de Dreamweaver . . . . . . . . . . . . . . . . . Convenciones tipogrficas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Recursos tecnolgicos HTML y Web . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 24 28 33 34 35 39 39

Captulo 1: Exploracin del espacio de trabajo . . . . . . . . . . . . . . . 41 Espacio de trabajo de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41 Utilizacin de la ventana de documento . . . . . . . . . . . . . . . . . . . . . . . . . 54 Utilizacin de barras de herramientas, inspectores y mens contextuales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58 Utilizacin de paneles y grupos de paneles . . . . . . . . . . . . . . . . . . . . . . 66 Utilizacin de las funciones de accesibilidad de Dreamweaver . . . . . .70 Optimizacin del espacio de trabajo para el diseo de pginas accesibles. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .76 Utilizacin de guas visuales en Dreamweaver . . . . . . . . . . . . . . . . . . . .78 Aspectos bsicos de personalizacin de Dreamweaver . . . . . . . . . . . .78 Captulo 2: Configuracin de un sitio de Dreamweaver . . . . . . . .87 Acerca de los sitios de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . 88 Configuracin de un sitio de Dreamweaver nuevo . . . . . . . . . . . . . . . . . 91 Utilizacin de las opciones avanzadas para configurar un sitio de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92 Edicin de la configuracin de un sitio de Dreamweaver . . . . . . . . . . .97 Edicin de sitios Web existentes con Dreamweaver . . . . . . . . . . . . . . 98

3

Captulo 3: Cmo crear y abrir documentos . . . . . . . . . . . . . . . . 101 Creacin de documentos nuevos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102 Cmo guardar un nuevo documento. . . . . . . . . . . . . . . . . . . . . . . . . . . . 105 Configuracin de un tipo de documento nuevo predeterminado . . . 106 Configuracin de la extensin de archivo predeterminada para nuevos documentos HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107 Cmo abrir documentos existentes . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107 Limpiar archivos HTML de Microsoft Word . . . . . . . . . . . . . . . . . . . . . 108

PARTE 2: UTILIZACIN DE LOS SITIOS DE DREAMWEAVER Captulo 4: Administracin de archivos . . . . . . . . . . . . . . . . . . . . 113 Administracin de sitios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .114 Acceso a sitios, a un servidor y a unidades locales . . . . . . . . . . . . . . . . 118 Visualizacin de archivos y carpetas. . . . . . . . . . . . . . . . . . . . . . . . . . . . 122 Comparacin de archivos para detectar diferencias . . . . . . . . . . . . . . 125 Recuperacin de versiones anteriores de archivos (usuarios de Contribute). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132 Administracin de archivos y carpetas en el panel Archivos . . . . . . . 132 Utilizacin de un mapa visual del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . 137 Importacin y exportacin de sitios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147 Eliminacin de un sitio de Dreamweaver de la lista de sitios . . . . . . . 149 Desproteccin y proteccin de archivos . . . . . . . . . . . . . . . . . . . . . . . . 149 Obtencin y colocacin de archivos en el servidor . . . . . . . . . . . . . . . 156 Sincronizacin de los archivos de los sitios local y remoto . . . . . . . . .161 Identificacin y eliminacin de archivos no utilizados . . . . . . . . . . . . . 163 Cmo ocultar carpetas y archivos en el sitio . . . . . . . . . . . . . . . . . . . . . 163 Almacenamiento de informacin sobre archivos en Design Notes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 169 Comprobacin del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173 Captulo 5: Administracin de activos y bibliotecas . . . . . . . . . . 179 Elementos de biblioteca. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179 Utilizacin de activos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181 Creacin y administracin de una lista de activos favoritos . . . . . . . . 190 Utilizacin de los elementos de biblioteca . . . . . . . . . . . . . . . . . . . . . . . 193 Captulo 6: Administracin de sitios de Contribute con Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203 Administracin de sitios de Contribute . . . . . . . . . . . . . . . . . . . . . . . . . 204

4

Contenido

Preparacin de un sitio para su uso con Contribute . . . . . . . . . . . . . . .210 Administracin de un sitio Contribute con Dreamweaver . . . . . . . . . . 211 Administracin de archivos de Contribute con Dreamweaver . . . . . .213 Solucin de problemas de un sitio de Contribute . . . . . . . . . . . . . . . . .216

PARTE 3: DISEO DE PGINAS Captulo 7: Diseo de pginas con CSS. . . . . . . . . . . . . . . . . . . . 221 Acerca de las capas en Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . 222 Insercin de una capa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224 Configuracin de preferencias y propiedades de capa . . . . . . . . . . . 227 Administracin de capas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 229 Manipulacin de capas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233 Conversin de capas en tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235 Animacin de capas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 238 Insercin de etiquetas div para el diseo. . . . . . . . . . . . . . . . . . . . . . . . 248 Utilizacin de etiquetas div para el diseo . . . . . . . . . . . . . . . . . . . . . . 249 Cambio del color de resaltado de las etiquetas div . . . . . . . . . . . . . . . .251 Utilizacin de la visualizacin de diseo CSS . . . . . . . . . . . . . . . . . . . .251 Utilizacin de reglas, guas y cuadrculas para disear pginas . . . . 254 Utilizacin de una imagen de rastreo . . . . . . . . . . . . . . . . . . . . . . . . . . . 258 Captulo 8: Presentacin de contenido en tablas . . . . . . . . . . . . 261 Tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262 Insercin de una tabla y adicin de contenido . . . . . . . . . . . . . . . . . . . 264 Importacin y exportacin de datos de tabla . . . . . . . . . . . . . . . . . . . . 265 Seleccin de elementos de una tabla . . . . . . . . . . . . . . . . . . . . . . . . . . 266 Utilizacin del modo de tablas expandidas para facilitar la edicin de tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270 Aplicacin de formato a tablas y celdas . . . . . . . . . . . . . . . . . . . . . . . . . 271 Cambio de tamao de tablas, columnas y filas . . . . . . . . . . . . . . . . . . 274 Adicin y eliminacin de filas y columnas . . . . . . . . . . . . . . . . . . . . . . 279 Divisin y combinacin de celdas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .281 Cmo copiar, pegar y eliminar celdas . . . . . . . . . . . . . . . . . . . . . . . . . . 283 Anidacin de tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 285 Ordenacin de tablas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 285 Captulo 9: Diseo de pginas en el modo de diseo . . . . . . . . 287 Modo de diseo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 288 Alternancia entre modo estndar y modo de diseo . . . . . . . . . . . . . 292

Contenido

5

Dibujo en el modo de diseo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .293 Adicin de contenido a una celda de diseo . . . . . . . . . . . . . . . . . . . . .297 Cmo borrar los altos de celdas establecidos automticamente. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299 Cambio de tamao y desplazamiento de celdas y tablas de diseo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299 Aplicacin de formato a celdas y tablas de diseo . . . . . . . . . . . . . . 302 Establecimiento del ancho de columna . . . . . . . . . . . . . . . . . . . . . . . . 303 Configuracin de preferencias para el modo de diseo . . . . . . . . . . .307 Captulo 10: Utilizacin de marcos . . . . . . . . . . . . . . . . . . . . . . . 309 Marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 310 Utilizacin de conjuntos de marcos en la ventana de documento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315 Creacin de marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . 316 Seleccin de marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . 319 Cmo abrir un documento en un marco . . . . . . . . . . . . . . . . . . . . . . . . .322 Almacenamiento de archivos de marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .322 Visualizacin y configuracin de las propiedades y los atributos de los marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .324 Visualizacin y configuracin de las propiedades de un conjunto de marcos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .326 Control del contenido de los marcos con vnculos. . . . . . . . . . . . . . . .328 Manipulacin de navegadores que no pueden mostrar marcos . . . .329 Utilizacin de comportamientos JavaScript con marcos . . . . . . . . . 330 Captulo 11: Administracin de plantillas . . . . . . . . . . . . . . . . . . . 331 Plantillas de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .332 Creacin de una plantilla de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . 347 Creacin de plantillas para un sitio de Contribute . . . . . . . . . . . . . . . . 351 Creacin de regiones editables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .354 Creacin de regiones repetidas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 357 Utilizacin de regiones opcionales . . . . . . . . . . . . . . . . . . . . . . . . . . . . 360 Definicin de atributos de etiqueta editables . . . . . . . . . . . . . . . . . . . .363 Creacin de una plantilla anidada . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .365 Edicin y actualizacin de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . .366 Administracin de plantillas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .370 Exportacin e importacin de contenido XML de plantillas. . . . . . . . 372 Exportacin de un sitio sin formato de plantilla. . . . . . . . . . . . . . . . . . . 373 Aplicacin o eliminacin de una plantilla de un documento existente . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374

6

Contenido

Edicin de contenido de un documento basado en plantilla. . . . . . . 376

PARTE 4: ADICIN DE CONTENIDO A LAS PGINAS Captulo 12: Utilizacin de pginas . . . . . . . . . . . . . . . . . . . . . . . 383 Utilizacin de pginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 384 Almacenamiento de pginas Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389 Especificacin HTML en lugar de CSS. . . . . . . . . . . . . . . . . . . . . . . . . 390 Configuracin de propiedades de la pgina . . . . . . . . . . . . . . . . . . . . . .391 Utilizacin de colores. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 394 Seleccin de elementos en la ventana de documento. . . . . . . . . . . . 396 Utilizacin de Acercar y Alejar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 398 Utilizacin del panel Historial. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 400 Automatizacin de tareas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .401 Utilizacin de comportamientos de JavaScript para detectar navegadores y plug-ins . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 408 Vista previa y comprobacin de pginas en los navegadores . . . . . 409 Configuracin de las preferencias de tiempo de descarga y tamao . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .413 Captulo 13: Insercin y formato de texto. . . . . . . . . . . . . . . . . . . 415 Aplicacin de formato a texto en Dreamweaver . . . . . . . . . . . . . . . . . .415 Insercin de texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 428 Aplicacin de formato a prrafos y a la estructura de la pgina . . . . 432 Aplicacin de formato al texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 436 Utilizacin de hojas de estilos en cascada para aplicar formato al texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 444 Comprobacin de la ortografa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 456 Cmo buscar y reemplazar texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 457 Captulo 14: Insercin de imgenes . . . . . . . . . . . . . . . . . . . . . . 459 Imgenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 459 Insercin de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 462 Cambio del tamao de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . 467 Recorte de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 468 Optimizacin de una imagen mediante Fireworks . . . . . . . . . . . . . . . 469 Ajuste del brillo y del contraste de una imagen . . . . . . . . . . . . . . . . . . 470 Perfilado de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 470 Creacin de una imagen de sustitucin. . . . . . . . . . . . . . . . . . . . . . . . . . 471 Utilizacin de un editor de imgenes externo . . . . . . . . . . . . . . . . . . . 472 Aplicacin de comportamientos a imgenes . . . . . . . . . . . . . . . . . . . . 473

Contenido

7

Captulo 15: Establecimiento de vnculos y navegacin. . . . . . 475 Aspectos bsicos de ubicacin y rutas de documentos . . . . . . . . . . . 476 Mens de salto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .479 Barras de navegacin. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 480 Mapas de imgenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 481 Creacin de vnculos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .482 Administracin de vnculos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 494 Insercin de mens de salto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 499 Utilizacin de las barras de navegacin . . . . . . . . . . . . . . . . . . . . . . . . . 501 Utilizacin de los mapas de imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . 503 Cmo adjuntar comportamientos JavaScript a vnculos . . . . . . . . . 506 Comprobacin de vnculos rotos, externos y hurfanos . . . . . . . . . . 506 Reparacin de vnculos rotos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 509 Apertura de documentos vinculados en Dreamweaver . . . . . . . . . . . 510 Captulo 16: Utilizacin con otras aplicaciones . . . . . . . . . . . . . . 511 Integracin de Fireworks y Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 512 Optimizacin del entorno de trabajo para Fireworks y Flash. . . . . . . 512 Utilizacin de Fireworks. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 513 Utilizacin de Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 527 Captulo 17: Adicin de audio, vdeo y elementos interactivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 531 Archivos multimedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .532 Insercin y edicin de objetos multimedia . . . . . . . . . . . . . . . . . . . . . . .535 Inicio de un editor externo de archivos multimedia . . . . . . . . . . . . . . . 537 Utilizacin de Design Notes con objetos multimedia . . . . . . . . . . . . 539 Insercin y modificacin de un objeto de botn Flash . . . . . . . . . . . 540 Insercin de un objeto de texto Flash . . . . . . . . . . . . . . . . . . . . . . . . . . 542 Insercin de contenido de Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .543 Descarga e instalacin de elementos Flash . . . . . . . . . . . . . . . . . . . . 544 Insercin de elementos Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 545 Edicin de atributos de elementos Flash . . . . . . . . . . . . . . . . . . . . . . . 545 Insercin de documentos FlashPaper . . . . . . . . . . . . . . . . . . . . . . . . . .546 Insercin de contenido de Flash Video. . . . . . . . . . . . . . . . . . . . . . . . . .547 Insercin de pelculas Shockwave. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 551 Adicin de vdeo (no Flash). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .552 Adicin de sonido a una pgina . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .552 Insercin de contenido de plug-in de Netscape Navigator . . . . . . . 554 Insercin de un control ActiveX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .556 Insercin de un applet de Java . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .556

8

Contenido

Utilizacin de comportamientos para controlar elementos multimedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 557 Captulo 18: Utilizacin de comportamientos JavaScript . . . . 559 Utilizacin del panel Comportamientos. . . . . . . . . . . . . . . . . . . . . . . . . 560 Eventos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .561 Aplicacin de un comportamiento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 562 Cmo adjuntar un comportamiento a un texto. . . . . . . . . . . . . . . . . . . 563 Cambio de un comportamiento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 564 Actualizacin de un comportamiento . . . . . . . . . . . . . . . . . . . . . . . . . . 565 Creacin de nuevas acciones . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 565 Descarga e instalacin de comportamientos de terceros . . . . . . . . . 565 Utilizacin de las acciones de comportamiento incluidas con Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 566

PARTE 5: UTILIZACIN DEL CDIGO DE LAS PGINAS Captulo 19: Configuracin del entorno de codificacin . . . . . . . 601 Visualizacin del cdigo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .601 Utilizacin del espacio de trabajo orientado al codificador (slo en Windows) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 603 Configuracin de las preferencias de codificacin . . . . . . . . . . . . . . . 604 Personalizacin de los mtodos abreviados de teclado . . . . . . . . . . 608 Cmo abrir archivos en la vista de cdigo de forma predeterminada. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 608 Configuracin de las preferencias del validador . . . . . . . . . . . . . . . . . 609 Administracin de bibliotecas de etiquetas . . . . . . . . . . . . . . . . . . . . . 609 Importacin de etiquetas personalizadas a Dreamweaver . . . . . . . . .614 Utilizacin de un editor de HTML externo con Dreamweaver . . . . . . 617 Captulo 20: Codificacin en Dreamweaver . . . . . . . . . . . . . . . . 621 Codificacin en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 622 Escritura y edicin de cdigo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .631 Bsqueda y reemplazo de etiquetas y atributos . . . . . . . . . . . . . . . . . 647 Cambios rpidos en una seleccin de cdigo . . . . . . . . . . . . . . . . . . . 649 Utilizacin del material de consulta para lenguajes . . . . . . . . . . . . . . 650 Impresin del cdigo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .651 Captulo 21: Optimizacin y depuracin del cdigo . . . . . . . . . 653 Limpieza del cdigo. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 653

Contenido

9

Verificacin de que las etiquetas y llaves estn equilibradas. . . . . . .654 Comprobacin de la compatibilidad con los navegadores. . . . . . . . .655 Validacin de etiquetas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 659 Creacin de pginas compatibles con XHTML . . . . . . . . . . . . . . . . . 660 Utilizacin del depurador de ColdFusion (slo Windows) . . . . . . . . . 661 Captulo 22: Edicin de cdigo en la vista Diseo . . . . . . . . . . 663 Edicin de cdigo con el inspector de propiedades . . . . . . . . . . . . . .664 Cambio de atributos con el inspector de etiquetas . . . . . . . . . . . . . . .664 Edicin de cdigo con Quick Tag Editor . . . . . . . . . . . . . . . . . . . . . . . .666 Edicin de cdigo con el selector de etiquetas. . . . . . . . . . . . . . . . . . .670 Edicin de scripts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 671 Utilizacin de server-side includes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 672 Utilizacin de comportamientos JavaScript . . . . . . . . . . . . . . . . . . . . . 674 Visualizacin y edicin del contenido de Head. . . . . . . . . . . . . . . . . . . 674

PARTE 6: PREPARACIN PARA CREAR SITIOS DINMICOS Captulo 23: Configuracin de una aplicacin Web . . . . . . . . . .679 Lo que necesita para crear aplicaciones Web . . . . . . . . . . . . . . . . . . .679 Configuracin de un servidor Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . 680 Configuracin de un servidor de aplicaciones. . . . . . . . . . . . . . . . . . . . 681 Creacin de una carpeta raz para la aplicacin . . . . . . . . . . . . . . . . . .685 Definicin de un sitio de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . 687 Conexin con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 691 Captulo 24: Conexiones de base de datos para desarrolladores de ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . 693 Conexin con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .693 Edicin o eliminacin de una conexin de base de datos . . . . . . . . .696 Captulo 25: Conexiones de base de datos para desarrolladores de ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . .697 Conexin con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .697 Edicin o eliminacin de una conexin de base de datos . . . . . . . . . 701 Captulo 26: Conexiones de base de datos para desarrolladores de ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 703 Conexiones de base de datos en ASP . . . . . . . . . . . . . . . . . . . . . . . . . .703 Creacin de una conexin con DSN . . . . . . . . . . . . . . . . . . . . . . . . . . .706

10

Contenido

Creacin de una conexin sin DSN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 710 Conexin con una base de datos en un ISP . . . . . . . . . . . . . . . . . . . . . . 711 Edicin o eliminacin de una conexin de base de datos . . . . . . . . . . 715 Captulo 27: Conexiones de base de datos para desarrolladores de JSP. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 717 Conexiones de base de datos en JSP . . . . . . . . . . . . . . . . . . . . . . . . . . . 717 Conexin con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 719 Conexin mediante un controlador ODBC . . . . . . . . . . . . . . . . . . . . . . . 721 Edicin o eliminacin de una conexin de base de datos . . . . . . . . . 725 Captulo 28: Conexiones de base de datos para desarrolladores de PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 727 Conexin con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 728 Edicin o eliminacin de una conexin de base de datos . . . . . . . . . 728 Captulo 29: Solucin de problemas de conexiones de base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 731 Solucin de problemas relacionados con permisos . . . . . . . . . . . . . . . 731 Solucin de problemas relacionados con mensajes de error de Microsoft. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 733 Solucin de problemas relacionados con mensajes de error de MySQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 740

PARTE 7: CREACIN DE PGINAS DINMICAS Captulo 30: Optimizacin del espacio de trabajo para desarrollo visual . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 743 Visualizacin de paneles de desarrollo de aplicaciones Web . . . . . Visualizacin de la base de datos en Dreamweaver. . . . . . . . . . . . . . Visualizacin de live data en la vista de Diseo . . . . . . . . . . . . . . . . . Utilizacin de la vista de Diseo sin datos dinmicos . . . . . . . . . . . . Vista previa de pginas dinmicas en un navegador . . . . . . . . . . . . . Restriccin de la informacin de base de datos que se muestra en Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 743 746 747 753 754 755

Captulo 31: Flujo de trabajo para el diseo de pginas dinmicas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 757 Diseo de la pgina . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 757 Creacin de una fuente de contenido dinmico . . . . . . . . . . . . . . . . . 758

Contenido

11

Adicin de contenido dinmico a una pgina Web . . . . . . . . . . . . . . .760 Mejora de la funcionalidad de una pgina dinmica . . . . . . . . . . . . . . 761 Comprobacin y depuracin de la pgina . . . . . . . . . . . . . . . . . . . . . . . 763 Captulo 32: Obtencin de datos para la pgina. . . . . . . . . . . . .767 Utilizacin de una base de datos para almacenar contenido. . . . . . . 767 Recopilacin de los datos enviados por los usuarios . . . . . . . . . . . . .769 Acceso a datos almacenados en variables de sesin . . . . . . . . . . . . . 774 Captulo 33: Definicin de fuentes de contenido dinmico . . . . 781 Fuentes de contenido dinmico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 782 Definicin de un juego de registros . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 787 Definicin de parmetros de URL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .792 Definicin de parmetros de formulario . . . . . . . . . . . . . . . . . . . . . . . . .793 Definicin de variables de sesin. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .795 Definicin de variables de aplicacin para ASP y ColdFusion . . . . .796 Utilizacin de una variable como fuente de datos para un juego de registros ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 797 Definicin de variables de servidor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 798 Creacin de un cach de las fuentes de contenido . . . . . . . . . . . . . . . 801 Cambio o eliminacin de fuentes de contenido . . . . . . . . . . . . . . . . . 802 Copia de un juego de registros de una pgina a otra . . . . . . . . . . . . . 802 Captulo 34: Adicin de contenido dinmico a pginas Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 805 Adicin de contenido dinmico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 806 Conversin de texto en contenido dinmico . . . . . . . . . . . . . . . . . . . . .807 Conversin de imgenes en contenido dinmico . . . . . . . . . . . . . . . 809 Conversin de atributos HTML en contenido dinmico . . . . . . . . . . 810 Conversin de parmetros de ActiveX, Flash y de otros objetos en contenido dinmico. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 813 Edicin del contenido dinmico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 814 Eliminacin de contenido dinmico . . . . . . . . . . . . . . . . . . . . . . . . . . . . 814 Creacin de pginas dinmicas en un sitio de Contribute . . . . . . . . . 815 Captulo 35: Visualizacin de registros de la base de datos . . . 817 Visualizacin de registros de la base de datos . . . . . . . . . . . . . . . . . . . 818 Utilizacin de formatos de datos predefinidos . . . . . . . . . . . . . . . . . . .825 Creacin de vnculos de navegacin por conjuntos de registros . . . 827 Visualizacin y ocultacin de registros segn los resultados del juego de registros . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 830

12

Contenido

Visualizacin de varios resultados de juego de registros . . . . . . . . . .831 Creacin de una tabla con un comportamiento del servidor Repetir regin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 832 Creacin de un contador de registros . . . . . . . . . . . . . . . . . . . . . . . . . . 834 Captulo 36: Visualizacin de datos XML en pginas Web . . . 837 Utilizacin de XML y XSL en pginas Web . . . . . . . . . . . . . . . . . . . . . 837 Acerca de las transformaciones XSL en el lado del servidor . . . . . . 839 Acerca de las transformaciones XSL en el lado del cliente . . . . . . . 843 Acerca de los datos XML y elementos repetidos . . . . . . . . . . . . . . . . 846 Acerca de la obtencin de la vista previa de datos XML . . . . . . . . . . 848 Realizacin de transformaciones XSL en el servidor. . . . . . . . . . . . . 850 Realizacin de transformaciones XSL en el cliente . . . . . . . . . . . . . . 866 Aplicacin de estilos a fragmentos de XSLT . . . . . . . . . . . . . . . . . . . . 869 Solucin de problemas de transformaciones XSL . . . . . . . . . . . . . . . 870 Captulo 37: Utilizacin de servicios Web (slo Windows) . . . . 871 Servicios Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 872 Configuracin de generadores proxy para utilizarlos con Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 877 Adicin de un proxy de servicios Web utilizando la descripcin WSDL. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 879 Adicin de un servicio Web a una pgina . . . . . . . . . . . . . . . . . . . . . . . . 881 Edicin de la lista de sitios de servicios Web UDDI . . . . . . . . . . . . . . 883 Captulo 38: Adicin de comportamientos de servidor personalizados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 885 Comportamientos de servidor personalizados . . . . . . . . . . . . . . . . . . 885 Instalacin de comportamientos de servidor de terceros . . . . . . . . . 897 Utilizacin del Creador de comportamientos de servidor . . . . . . . . . 898 Utilizacin de parmetros en comportamientos de servidor . . . . . . 902 Colocacin de bloques de cdigo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 902 Creacin de un cuadro de dilogo para un comportamiento de servidor personalizado . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 904 Edicin y modificacin de comportamientos de servidor . . . . . . . . . 907 Captulo 39: Creacin de formularios. . . . . . . . . . . . . . . . . . . . . . 911 Formularios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .912 Creacin de formularios HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .915 Insercin de objetos de formulario HTML. . . . . . . . . . . . . . . . . . . . . . . .918 Insercin de objetos de formulario HTML dinmicos. . . . . . . . . . . . . 923

Contenido

13

Validacin de datos de formulario HTML . . . . . . . . . . . . . . . . . . . . . . .927 Cmo adjuntar comportamientos JavaScript a objetos de formulario HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 929 Cmo adjuntar scripts personalizados a botones de formulario HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 929 Creacin de formularios HTML accesibles . . . . . . . . . . . . . . . . . . . . . 930

PARTE 8: DESARROLLO RPIDO DE APLICACIONES Captulo 40: Creacin rpida de aplicaciones de ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 935 Desarrollo rpido de aplicaciones (todos los servidores) . . . . . . . . . 935 Creacin de formularios ColdFusion MX 7 . . . . . . . . . . . . . . . . . . . . . . 941 Creacin de pginas maestra-detalle (ColdFusion). . . . . . . . . . . . . . 954 Creacin de pginas de bsqueda/resultados (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .963 Creacin de una pgina de insercin de registro (todos los servidores). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 971 Creacin de pginas para actualizar un registro (ColdFusion) . . . . .974 Creacin de pginas para eliminar un registro (ColdFusion) . . . . . . .983 Utilizacin de procedimientos almacenados para modificar bases de datos (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 993 Creacin de pginas que restrinjan el acceso al sitio (ColdFusion, ASP, JSP Y PHP). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 995 Proteccin de una carpeta de su aplicacin (ColdFusion) . . . . . . . . 1007 Utilizacin de componentes de ColdFusion . . . . . . . . . . . . . . . . . . . .1008 Captulo 41: Creacin rpida de aplicaciones ASP.NET . . . . . 1017 Creacin de formularios ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1017 Creacin de controles Web Cuadrcula de datos y Lista de datos de ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1023 Creacin de pginas Maestro-Detalle (ASP.NET) . . . . . . . . . . . . . . 1028 Creacin de una pgina de bsqueda en la base de datos (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1036 Creacin de una pgina de insercin de registro (ASP.NET) . . . . .1043 Creacin de pginas para actualizar un registro (ASP.NET) . . . . . .1044 Creacin de pginas para eliminar un registro (ASP.NET) . . . . . . .1054 Utilizacin de procedimientos almacenados para modificar bases de datos (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1064 Creacin de pginas que restrinjan el acceso al sitio (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1065

14

Contenido

Captulo 42: Creacin rpida de aplicaciones ASP y JSP . . .1067 Creacin de pginas maestra-detalle (ASP y JSP) . . . . . . . . . . . . . Creacin de pginas de bsqueda/resultados (ASP y JSP) . . . . . Creacin de una pgina de insercin de registro (ASP y JSP) . . . Creacin de pginas para actualizar un registro (ASP y JSP) . . . . Creacin de pginas para eliminar un registro (ASP y JSP) . . . . . Creacin de pginas con objetos de manipulacin de datos avanzados (ASP y JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Creacin de pginas que restrinjan el acceso al sitio (ASP y JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Utilizacin de JavaBeans (JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1067 1072 1072 1072 1079 1084 1089 1090

Captulo 43: Creacin rpida de aplicaciones PHP . . . . . . . . 1093 Creacin de pginas maestra-detalle (PHP) . . . . . . . . . . . . . . . . . . . 1093 Creacin de pginas de bsqueda/resultados (PHP) . . . . . . . . . . . . 1101 Creacin de una pgina de insercin de registros (PHP) . . . . . . . . . 1101 Creacin de pginas para actualizar un registro (PHP) . . . . . . . . . . . 1102 Creacin de pginas para eliminar un registro (PHP) . . . . . . . . . . . . 1110 Creacin de pginas que restrinjan el acceso al sitio (PHP). . . . . . . 1119

PARTE 9: APNDICES Apndice A: Gua de bases de datos para principiantes . . . . . 1123 Bases de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1123 Aspectos bsicos del diseo de bases de datos . . . . . . . . . . . . . . . . . 1125 Aspectos bsicos de las conexiones de bases de datos . . . . . . . . . 1132 Apndice B: Nociones bsicas de SQL . . . . . . . . . . . . . . . . . . . 1139 Aspectos bsicos de la sintaxis. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1139 Definicin de las columnas en un juego de registros . . . . . . . . . . . . . 1141 Limitacin de los registros en un juego de registros. . . . . . . . . . . . . . 1142 Clasificacin de los registros en un juego de registros. . . . . . . . . . . . 1146 Unin de tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1146 ndice alfabtico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1149

Contenido

15

16

Contenido

PARTE 1

Aspectos bsicos de DreamweaverAprenda a utilizar la documentacin y otros recursos de Macromedia Dreamweaver 8 y configure el espacio de trabajo de Dreamweaver de acuerdo con su mtodo de trabajo. Posteriormente, planifique y configure un sitio y comience a crear pginas. Esta parte contiene los siguientes captulos:Introduccin. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Captulo 1: Exploracin del espacio de trabajo. . . . . . . . . . . . . . . . . 41 Captulo 2: Configuracin de un sitio de Dreamweaver. . . . . . . . . 87 Captulo 3: Cmo crear y abrir documentos . . . . . . . . . . . . . . . . . . 101

1

17

IntroduccinDreamweaver 8 es un editor HTML profesional para disear, codificar y desarrollar sitios, pginas y aplicaciones Web. Tanto si desea controlar manualmente el cdigo HTML como si prefiere trabajar en un entorno de edicin visual, Dreamweaver le proporciona tiles herramientas que mejorarn su experiencia de creacin Web. Las funciones de edicin visual de Dreamweaver permiten crear pginas de forma rpida, sin escribir una sola lnea de cdigo. Puede ver todos los elementos o activos del sitio y arrastrarlos desde un panel fcil de usar directamente hasta un documento. Puede agilizar el flujo de trabajo de desarrollo mediante la creacin y edicin de imgenes en Macromedia Fireworks o en otra aplicacin de grficos y su posterior importacin directa a Dreamweaver, o bien aadir objetos Macromedia Flash. Dreamweaver tambin ofrece un entorno de codificacin con todas las funciones, que incluye herramientas para la edicin de cdigo (tales como coloreado de cdigo y terminacin automtica de etiquetas) y material de referencia de lenguajes sobre hojas de estilos en cascada (CSS), JavaScript, y ColdFusion Markup Language (CFML), entre otros. La tecnologa Roundtrip HTML de Macromedia importa los documentos con cdigo manual HTML sin modificar el formato del cdigo. Posteriormente, si lo desea, puede formatear el cdigo con el estilo que prefiera. Dreamweaver permite crear aplicaciones Web dinmicas basadas en bases de datos empleando tecnologas de servidor como CFML, ASP.NET, ASP, JSP y PHP. Dreamweaver se puede personalizar totalmente. Puede crear sus propios objetos y comandos, modificar mtodos abreviados de teclado e incluso escribir cdigo JavaScript para ampliar las posibilidades que ofrece Dreamweaver con nuevos comportamientos, inspectores de propiedades e informes de sitios.

19

Este captulo contiene las secciones siguientes:Novedades de Dreamweaver 8. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Por dnde empezar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 Flujo de trabajo de Dreamweaver para la creacin de sitios Web. . . . . . . . . . . . . . . 28 Utilizacin de Dreamweaver con otras aplicaciones . . . . . . . . . . . . . . . . . . . . . . . . . . 33 Dreamweaver y accesibilidad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 Gua de recursos de formacin de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35 Convenciones tipogrficas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39 Recursos tecnolgicos HTML y Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

Novedades de Dreamweaver 8Dreamweaver 8 incluye una gran variedad de funciones que mejoran el uso y ayudan a crear pginas, tanto si trabaja en el entorno de diseo como si lo hace en el entorno de codificacin. En primer lugar, Dreamweaver 8 ofrece soporte para las prcticas recomendadas y las normas de la industria, incluido el soporte para el uso avanzado de CSS, agregadores XML y RSS, y requisitos de accesibilidad.Trabajo con las prcticas recomendadas:Creacin visual con datos XML Acelere los procesos XML gracias a las potentes herramientas visuales que permiten integrar los agregadores en el flujo de trabajo y acabar con el misterio de la transformacin de XML en HTML. Integre datos basados en XML, como los agregadores RSS, en pginas Web mediante un sencillo flujo de trabajo basado en arrastrar y soltar. Desplcese a la vista Cdigo para personalizar la transformacin gracias a sugerencias de codificacin mejoradas para XML y XSLT. Para ms informacin, consulte Captulo 36, Visualizacin de datos XML en pginas Web, en la pgina 837.

Nuevo panel CSS unificado El nuevo panel CSS unificado ofrece una ubicacin centralizada para aprender, conocer y trabajar de forma visual con los estilos CSS aplicados a las pginas. Todas las funciones CSS se consolidan en un solo juego de paneles y se mejoran para facilitar el trabajo con estilos CSS y aumentar su productividad. La nueva interfaz facilita la visualizacin de la cascada de estilos aplicados a un elemento concreto, de tal forma que la ubicacin en la que se definen los atributos resulte fcilmente identificable. Es posible acelerar la edicin gracias a una cuadrcula de propiedades. Para ms informacin, consulte Utilizacin del panel Estilos CSS en la pgina 445.

20

Introduccin

Trabajo con las prcticas recomendadas:Visualizacin de diseo CSS Aplique ayudas visuales en el tiempo de diseo para resaltar los bordes y el color de los diseos CSS. La aplicacin de ayudas visuales descubre esquemas complejos de anidacin y mejora la seleccin. Haga clic en el diseo CSS para obtener valiosa informacin sobre herramientas y poder comprender mejor los elementos que controlan el diseo. Vase Captulo 7, Diseo de pginas con CSS, en la pgina 221. Visualice el contenido del mismo modo que lo vern los usuarios independientemente del mecanismo de publicacin gracias a la nueva compatibilidad con tipos de medios CSS. Utilice la barra de herramientas Representacin de estilos para cambiar a la vista Diseo y ver el aspecto que tendr en versin impresa, en un dispositivo de mano o en pantalla. Vase Barra de herramientas Representacin de estilos en la pgina 52.

Barra de herramientas Representacin de estilos

Mejoras en el proceso CSS Compruebe cmo se representarn los diseos CSS complejos en la mayora de los navegadores con mejoras importantes en la precisin de la vista Diseo. Dreamweaver es ahora totalmente compatible con las tcnicas CSS ms avanzadas, como el desbordamiento, los pseudoelementos y los elementos de formulario. Accesibilidad: compatibilidad con puntos de comprobacin de las directrices del WCAG/W3C (prioridad 2) WebDAV mejorado Adems de la herramienta de evaluacin de accesibilidad integrada para los puntos de comprobacin de las directrices de la Seccin 508 y el WCAG (prioridad 1), ahora Dreamweaver admite tanto CSS como accesibilidad con una herramienta de evaluacin actualizada que incluye puntos de comprobacin del WCAG (prioridad 2). Gracias a WebDAV, ahora Dreamweaver 8 admite la autenticacin de texto implcita y SSL para la transferencia segura de archivos. Adems, proporciona una conectividad mejorada con un mayor grupo de servidores. Vase Utilizacin de WebDAV para desproteger y proteger archivos en la pgina 151.

Novedades de Dreamweaver 8

21

Consiga ms en menos tiempo, optimizando el flujo de trabajo de los usuarios de manera que se reduzca el tiempo necesario para completar tareas comunes. Dreamweaver 8 reduce el tiempo empleado en las rutinas ms pequeas para poder dedicar ms tiempo al diseo y al desarrollo de la vinculacin entre los sitios Web y las aplicaciones.Consiga msTransferencia de archivos en segundo plano Contine trabajando mientras Dreamweaver 8 carga los archivos en el servidor. Para ms informacin, consulte Administracin de las transferencias de archivos en la pgina 160. Disfrute de un mayor control de sus diseos gracias a la herramienta Zoom. Acrquese y analice una imagen o un trabajo con un diseo complejo de tablas anidadas. Aljese para obtener la vista previa de la apariencia de las pginas. Para ms informacin, consulte Utilizacin de Acercar y Alejar en la pgina 398. Compare el diseo de las pginas con pginas de muestra (con precisin de pxeles perfectos) y utilice las guas para realizar mediciones del diseo que tendrn las pginas. La respuesta visual le ayudar a medir las distancias con precisin y a realizar ajustes inteligentes. Para ms informacin, consulte Utilizacin de guas en la pgina 255. La nueva barra de herramientas Codificacin proporciona botones para las funciones de codificacin ms frecuentes en una barra alargada situada en uno de los laterales de la vista Cdigo. Para ms informacin, consulte Insercin rpida de cdigo con la barra de herramientas Codificacin en la pgina 635. Cntrese nicamente en el cdigo que desea visualizar y oculte o contraiga los bloques de cdigo. Para ms informacin, consulte Contraccin y ampliacin de fragmentos de cdigo en la pgina 641. Personalice y guarde las configuraciones de su espacio de trabajo. Dreamweaver 8 se suministra con cuatro configuraciones distintas que se ajustan a las necesidades de los diseadores y codificadores. Asimismo, es posible crear un espacio de trabajo personalizado. Para ms informacin, consulte Almacenamiento de diseos de espacio de trabajo personalizados en la pgina 81.

Zoom

Guas

Barra de herramientas Codificacin

Contraer cdigo

Diseos del espacio de trabajo

22

Introduccin

Consiga msDocumentos en fichas para Las nuevas fichas de documentos de la ayuda de Mac Mac simplifican la interfaz de usuario y facilitan la seleccin de documentos. Para ms informacin, consulte Visualizacin de documentos en fichas (Macintosh) en la pgina 80. Nuevas pginas iniciales Los nuevos diseos le permiten crear sitios rpidamente.

Mejoras de sincronizacin y Administre los sitios con mayor fiabilidad y confianza. Las mejoras de sincronizacin de los sitios contribuyen a garantizar proteccin/desproteccin que se utiliza la versin ms reciente del archivo. Evite de los sitios sobrescribir accidentalmente el trabajo de otros usuarios gracias a las mejoras en las funciones de proteccin y desproteccin. Para ms informacin, consulte Sincronizacin de los archivos de los sitios local y remoto en la pgina 161. Comparacin de archivos Compare archivos rpidamente para detectar qu ha cambiado. Puede comparar dos archivos locales, un archivo del equipo local y uno de un equipo remoto, o bien dos archivos de un equipo remoto. Utilice la herramienta de comparacin de archivos de Dreamweaver que prefiera tanto en plataformas Macintosh como Windows. Para ms informacin, consulte Comparacin de archivos para detectar diferencias en la pgina 125. Gracias a las nuevas opciones de pegado de Dreamweaver, es posible conservar todo el formato original creado en Microsoft Word, o bien simplemente pegar el texto. Para ms informacin, consulte Adicin de texto a un documento en la pgina 428.

Pegado especial

Referencias relativas al sitio Trabaje sin complicaciones con server-side includes en tiempo de diseo y en tiempo de ejecucin con la seguridad de que las referencias son relativas a los sitios y no a los archivos locales. Para ms informacin, consulte Configuracin de la ruta relativa de vnculos nuevos en la pgina 488. Mejoras de edicin de cdigo Obtenga un mayor control sobre el modo en que Dreamweaver ofrece sugerencias de cdigo y completa las etiquetas para que se ajusten a su estilo de codificacin.

Novedades de Dreamweaver 8

23

Dreamweaver 8 apuesta por el aprendizaje y la utilizacin de las nuevas tecnologas y es compatible con PHP 5, Flash Video, ColdFusion MX 7 y el sistema Web Publishing System de Macromedia.Integracin con las ltimas tecnologas y normasCompatibilidad con ColdFusion MX 7 La compatibilidad actualizada con ColdFusion MX 7 incluye nuevos comportamientos de servidor y sugerencias de cdigo. Para que las sugerencias y la depuracin del cdigo coincidan con la versin correcta de ColdFusion, Dreamweaver detecta automticamente la versin del servidor la primera vez que se conecta al sitio. La estrecha integracin entre Dreamweaver y ColdFusion permite aadir y quitar bases de datos directamente desde el panel Bases de datos y visualizar slo los componentes de ColdFusion definidos en el sitio actual. Para ms informacin, consulte Activacin de las mejoras de ColdFusion en la pgina 942. Aproveche la compatibilidad actualizada con PHP 5, que incluye comportamientos de servidor y sugerencias de cdigo. Inserte rpida y fcilmente un archivo de Flash Video en una pgina Web. Para ms informacin, consulte Insercin de contenido de Flash Video en la pgina 547. Realice un seguimiento de todo lo que sucede en su sitio. En Dreamweaver, los eventos notifican al servidor del sistema Web Publishing System de Macromedia para que se registren en el sistema WPS todos los cambios realizados en el sitio Web. Consulte el nuevo contenido de referencia para XML, XSLT y XPath, y el contenido actualizado para ASP y JSP.

Compatibilidad con PHP 5 Flash Video

Sistema Web Publishing System de Macromedia: notificacin y registro de eventos Material de referencia de O'Reilly actualizado

Por dnde empezarLa documentacin de Dreamweaver contiene informacin para usuarios de distintos niveles. Para sacarle el mximo provecho a la documentacin, comience leyendo las partes ms adecuadas para su nivel. Para ms informacin sobre los recursos de Dreamweaver, consulte Gua de recursos de formacin de Dreamweaver en la pgina 35.

24

Introduccin

Principiantes en el diseo WebSi usted es un principiante en el diseo Web, esta seccin le informar de las secciones de la documentacin de Dreamweaver ms adecuadas para su nivel.Para principiantes en el diseo Web:1. 2.

Primero lea los tutoriales del manual Primeros pasos con Dreamweaver. En Utilizacin de Dreamweaver (Ayuda > Utilizacin de Dreamweaver), consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41, Captulo 2, Configuracin de un sitio de Dreamweaver, en la pgina 87, Captulo 4, Administracin de archivos, en la pgina 113 y Captulo 3, Cmo crear y abrir documentos, en la pgina 101. Para aprender sobre el diseo de las pginas, vase el Captulo 9, Diseo de pginas en el modo de diseo, en la pgina 287. Para obtener informacin sobre la aplicacin de formato al texto y la insercin de imgenes en las pginas, vase el Captulo 13, Insercin y formato de texto, en la pgina 415 y el Captulo 14, Insercin de imgenes, en la pgina 459.

3.

4.

Eso es todo lo que necesita para comenzar a crear sitios Web de gran calidad. Cuando est preparado para aprender a utilizar herramientas ms avanzadas, podr continuar con el resto de los captulos sobre pginas estticas en el apartado Utilizacin de Dreamweaver. Es aconsejable que lea los captulos de pginas dinmicas slo cuando se haya familiarizado con la creacin de pginas Web.

Diseadores de sitios Web con experienciaSi usted es un diseador de sitios Web con experiencia, esta seccin le informar de las secciones de la documentacin de Dreamweaver ms adecuadas para su nivel. Existen dos mtodos distintos: uno para diseadores sin experiencia en Dreamweaver y otro para diseadores que estn familiarizados con Dreamweaver pero que desean obtener ms informacin sobre la creacin de pginas dinmicas.Para diseadores de sitios Web con experiencia que empiezan a usar Dreamweaver:1. 2.

Primero lea los tutoriales del manual Primeros pasos con Dreamweaver. En Utilizacin de Dreamweaver, consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41 para ms informacin sobre la interfaz de usuario de Dreamweaver.

Por dnde empezar

25

3.

Aunque probablemente ya conoce una buena parte del material del Captulo 2, Configuracin de un sitio de Dreamweaver, en la pgina 87 y el Captulo 4, Administracin de archivos, en la pgina 113, debera hojear estos captulos para ver cmo se aplican en Dreamweaver estos conceptos. Preste especial atencin a las secciones que tratan sobre la configuracin de un sitio de Dreamweaver. Para informacin til y detallada sobre el uso de Dreamweaver para crear pginas HTML bsicas, consulte Captulo 13, Insercin y formato de texto, en la pgina 415 y Captulo 14, Insercin de imgenes, en la pgina 459. Para informacin sobre la codificacin en Dreamweaver, vase Configuracin del entorno de codificacin en la pgina 601, Codificacin en Dreamweaver en la pgina 621, Optimizacin y depuracin del cdigo en la pgina 653 y Edicin de cdigo en la vista Diseo en la pgina 663. Lea la introduccin que aparece al comienzo de los dems captulos de Utilizacin de Dreamweaver para determinar si le interesan los temas que se abordan en ellos.

4.

5.

6.

Para diseadores de sitios Web con experiencia, familiarizados con Dreamweaver, que deseen obtener informacin sobre la creacin de pginas dinmicas:1.

Primero lea Apndice A, Aspectos bsicos de las aplicaciones Web y Tutorial: Desarrollo de una aplicacin Web en Primeros pasos con Dreamweaver. En Utilizacin de Dreamweaver, consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41 para ms informacin sobre la interfaz de usuario de Dreamweaver y, a continuacin, lea el apartado Optimizacin del espacio de trabajo para desarrollo visual en la pgina 743. Familiarcese con el flujo de trabajo de Dreamweaver en las pginas dinmicas leyendo Flujo de trabajo para el diseo de pginas dinmicas en la pgina 757. Configure un servidor Web y un servidor de aplicaciones. (Vase Captulo 23, Configuracin de una aplicacin Web, en la pgina 679.) Conecte con una base de datos. (Vase Conexin con una base de datos en la pgina 691.) Lea la introduccin que aparece al comienzo de cada uno de los captulos de Utilizacin de Dreamweaver para determinar si le interesan los temas que se abordan en ellos. Si est interesado en la personalizacin manual de Dreamweaver, lea Personalizacin de Dreamweaver en el Centro de soporte de Macromedia en www.macromedia.com/go/ customizing_dreamweaver_es. Si desea escribir extensiones para Dreamweaver, consulte Ampliacin de Dreamweaver.

2.

3.

4.

5.

6.

7.

26

Introduccin

Usuarios con experiencia en codificacin manualSi usted es un usuario con experiencia en codificacin manual, esta seccin le informar de las secciones de la documentacin de Dreamweaver ms adecuadas para su nivel.Para usuarios con experiencia en codificacin manual:1.

En Utilizacin de Dreamweaver, consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41 para ms informacin sobre la interfaz de usuario de Dreamweaver. Aunque probablemente ya conoce una buena parte del material del Captulo 2, Configuracin de un sitio de Dreamweaver, en la pgina 87 y el Captulo 4, Administracin de archivos, en la pgina 113, puede hojear estos captulos para ver cmo se aplican en Dreamweaver estos conceptos. Preste especial atencin a las secciones sobre la configuracin de un sitio de Dreamweaver. Encontrar ms informacin sobre codificacin con Dreamweaver en Captulo 19, Configuracin del entorno de codificacin, en la pgina 601, Captulo 20, Codificacin en Dreamweaver, en la pgina 621, Captulo 21, Optimizacin y depuracin del cdigo, en la pgina 653 y Captulo 22, Edicin de cdigo en la vista Diseo, en la pgina 663. Lea la introduccin que aparece al comienzo de cada uno de los captulos de Utilizacin de Dreamweaver para determinar si le interesan los temas que se abordan en ellos.

2.

3.

4.

Diseadores de aplicaciones WebSi es un diseador de aplicaciones Web con experiencia, esta seccin le informar de las secciones de la documentacin de Dreamweaver ms adecuadas para su nivel. Hay dos mtodos distintos, dependiendo de si ha usado Dreamweaver con anterioridad.Para los diseadores de aplicaciones Web que no hayan utilizado Dreamweaver:1.

Comience con una lectura rpida de Primeros pasos con Dreamweaver para familiarizarse con los aspectos bsicos del uso de Dreamweaver. En Utilizacin de Dreamweaver, consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41 para ms informacin sobre la interfaz de usuario de Dreamweaver. Aunque probablemente ya conoce una buena parte del material del Captulo 2, Configuracin de un sitio de Dreamweaver, en la pgina 87 y el Captulo 4, Administracin de archivos, en la pgina 113, puede hojear estos captulos para ver cmo se aplican en Dreamweaver estos conceptos. Preste especial atencin a las secciones sobre la configuracin de un sitio de Dreamweaver.

2.

3.

Por dnde empezar

27

4.

Configure un servidor Web y un servidor de aplicaciones utilizando Dreamweaver. (Vase Captulo 23, Configuracin de una aplicacin Web, en la pgina 679.) Conecte con una base de datos. (Vase Conexin con una base de datos en la pgina 691.) Lea la introduccin que aparece al comienzo de cada captulo de Utilizacin de Dreamweaver para determinar si le interesan los temas que se abordan en ellos.

5.

6.

Para diseadores de aplicaciones Web con experiencia que hayan utilizado Dreamweaver:1. 2.

Para empezar, consulte Novedades de Dreamweaver 8 en la pgina 20. En Utilizacin de Dreamweaver, consulte Captulo 1, Exploracin del espacio de trabajo, en la pgina 41 para ms informacin sobre la interfaz de usuario de Dreamweaver. Si est interesado en la personalizacin manual de Dreamweaver, lea Personalizacin de Dreamweaver en el Centro de soporte de Macromedia en www.macromedia.com/go/ customizing_dreamweaver_es. Si desea escribir extensiones para Dreamweaver, consulte Ampliacin de Dreamweaver.

3.

Flujo de trabajo de Dreamweaver para la creacin de sitios WebExisten muchos mtodos distintos para crear un sitio Web. El flujo de trabajo que se presenta en esta documentacin comienza por la definicin de la estrategia o la finalidad de un sitio. Si va a desarrollar aplicaciones Web, deber configurar los servidores y las bases de datos necesarias. A continuacin, debe disear el aspecto y el funcionamiento del sitio. Una vez que el diseo est finalizado, debe crear el sitio y codificar las pginas, aadiendo el contenido y la interactividad; a continuacin, vincular las pginas y comprobar si el sitio funciona y si cumple los objetivos para los que ha sido diseado. Adems, si lo desea, puede incluir pginas dinmicas. Para terminar el ciclo, publicar el sitio en un servidor. Muchos ingenieros de desarrollo tambin programan operaciones de mantenimiento peridico para asegurarse de que el sitio contina estando actualizado y operativo.

28

Introduccin

Planificacin del sitioPlanificar y organizar cuidadosamente el sitio desde el primer momento puede ayudar a ahorrar tiempo ms adelante. La organizacin del sitio no slo implica la determinacin de los archivos que van a incluirse, sino que tambin requiere un examen de las necesidades del sitio, el perfil de la audiencia y sus objetivos. Adems, deben tenerse en cuenta requisitos tcnicos tales como el acceso de los usuarios, o limitaciones del navegador, los plug-ins o la descarga de archivos. Una vez que haya organizado la informacin y determinado una estructura, podr comenzar a crear el sitio.

Utilice el panel Archivos de Dreamweaver para establecer la estructura organizativa del sitio. En el panel Archivos puede aadir, borrar y cambiar el nombre de los archivos y carpetas fcilmente con el fin de modificar la organizacin segn resulte necesario. (Vase Captulo 2, Configuracin de un sitio de Dreamweaver, en la pgina 87 y Captulo 4, Administracin de archivos, en la pgina 113.) Puede empezar por crear pginas simples que ms adelante convertir en diseos ms complejos. Cree pginas vacas nuevas o pginas basadas en diseos predefinidos. (Vase Captulo 3, Cmo crear y abrir documentos, en la pgina 101.) Configurar un sistema de forma que los miembros del equipo no puedan sobrescribir los archivos. (Vase Desproteccin y proteccin de archivos en la pgina 149.) Utilizar Design Notes para comunicarse con los miembros del equipo Web. (Vase Almacenamiento de informacin sobre archivos en Design Notes en la pgina 169.)

Si trabaja en un equipo de desarrollo Web, es posible que tambin le interesen estos temas:

Administracin de los archivos del sitioLos paneles Archivos y Activos de Dreamweaver facilitan la administracin de los archivos del sitio.

En el panel Archivos de Dreamweaver encontrar numerosas herramientas que le ayudarn a administrar el sitio, transferir archivos desde y hacia un servidor remoto, configurar un proceso de desproteccin/proteccin que evite que se sobrescriban archivos y sincronizar los archivos de los sitios local y remoto. (Vase Administracin de archivos en la pgina 113.) El panel Activos permite organizar fcilmente los activos de un sitio. A continuacin, se pueden arrastrar directamente desde el panel Activos hasta un documento de Dreamweaver. (Vase Captulo 5, Administracin de activos y bibliotecas, en la pgina 179.)

Flujo de trabajo de Dreamweaver para la creacin de sitios Web

29

Puede utilizar Dreamweaver para administrar diversos aspectos de sus sitios de Contribute. (Vase Captulo 6, Administracin de sitios de Contribute con Dreamweaver, en la pgina 203.)

Diseo de las pginas WebDreamweaver le ofrece flexibilidad para crear pginas de muestra y trabajar en el diseo definitivo de sus pginas. Elija el diseo ms apropiado, o combine las opciones de diseo de Dreamweaver para definir el aspecto de su sitio.

Puede utilizar capas o estilos de posicin CSS de Dreamweaver para crear su diseo. (Vase Captulo 7, Diseo de pginas con CSS, en la pgina 221.) Las herramientas de tabla y el modo de diseo de Dreamweaver permiten disear rpidamente pginas Web y, posteriormente, reorganizar la estructura de las pginas. (Vase Captulo 8, Presentacin de contenido en tablas, en la pgina 261 y Captulo 9, Diseo de pginas en el modo de diseo, en la pgina 287.) Para mostrar varios documentos de forma simultnea en un navegador, pueden utilizarse marcos para su organizacin. (Vase Captulo 10, Utilizacin de marcos, en la pgina 309.) Las plantillas de Dreamweaver le permiten aplicar fcilmente contenidos y diseos de pgina reutilizables a su sitio. Puede crear pginas nuevas basadas en una plantilla de Dreamweaver y actualizar su diseo de forma automtica cuando cambie la plantilla. (Vase Captulo 11, Administracin de plantillas, en la pgina 331.)

Adicin de contenido a las pginasMediante Dreamweaver, podr aadir fcilmente a las pginas Web una gran variedad de contenidos. Aada activos y elementos de diseo, como texto, imgenes, colores, pelculas, sonido y otros elementos multimedia.

Las funciones de creacin de pginas de Dreamweaver le permiten especificar propiedades de la pgina Web tales como ttulos de pgina o imagen y color de fondo. Adems, Dreamweaver le proporciona herramientas para optimizar el rendimiento de su sitio Web y probar las pginas, para asegurar la compatibilidad con distintos navegadores Web. (Vase Captulo 12, Utilizacin de pginas, en la pgina 383.) Escriba directamente en un documento de Dreamweaver o importe texto desde otros documentos, luego aplique formato al texto utilizando el inspector de propiedades de Dreamweaver. Tambin puede crear fcilmente sus propias CSS (Hojas de estilos en cascada, Cascading Style Sheets). (Vase Captulo 13, Insercin y formato de texto, en la pgina 415.)

30

Introduccin

Inserte imgenes, incluidas imgenes de sustitucin, mapas de imgenes e imgenes por capas de Fireworks, y utilice las herramientas de alineacin para situar las imgenes en la pgina. Tambin puede cambiar el tamao de las imgenes directamente en Dreamweaver. (Vase Captulo 14, Insercin de imgenes, en la pgina 459 y Captulo 16, Utilizacin con otras aplicaciones, en la pgina 511.) Con Dreamweaver puede crear vnculos HTML estndar, incluidos vnculos de anclaje y vnculos de correo electrnico, o establecer sistemas de navegacin grfica, como los mens de salto y las barras de navegacin. (Vase Captulo 15, Establecimiento de vnculos y navegacin, en la pgina 475.) Inserte cualquier otro tipo de elementos multimedia en una pgina Web, como pelculas Flash, Shockwave y QuickTime, sonido y applets. (Vase Captulo 17, Adicin de audio, vdeo y elementos interactivos, en la pgina 531.) Los comportamientos permiten realizar tareas en respuesta a eventos especficos como, por ejemplo, resaltar un botn cuando el puntero pasa por encima de l, validar un formulario cuando el usuario hace clic en el botn Enviar o abrir una segunda ventana del navegador cuando la pgina principal ha terminado de cargarse. (Vase Captulo 18, Utilizacin de comportamientos JavaScript, en la pgina 559.)

Codificacin manualLa codificacin manual de pginas Web es otro mtodo para crear las pginas. Dreamweaver ofrece sencillas herramientas de edicin visual, pero tambin ofrece un entorno de codificacin ms sofisticado. Puede utilizar el mtodo que prefiera, o una combinacin de ambos, para crear y editar sus pginas.

Puede trabajar en un entorno de codificacin sin herramientas visuales; las herramientas de codificacin le permiten crear y editar cdigo, asignarle un formato y comprobar que se ajusta a determinadas normas. (Vase Captulo 19, Configuracin del entorno de codificacin, en la pgina 601, Captulo 20, Codificacin en Dreamweaver, en la pgina 621 y Captulo 21, Optimizacin y depuracin del cdigo, en la pgina 653.) Tambin puede utilizar algunas herramientas de codificacin de Dreamweaver en la vista Diseo, el entorno de diseo visual. (Vase Captulo 22, Edicin de cdigo en la vista Diseo, en la pgina 663.)

Flujo de trabajo de Dreamweaver para la creacin de sitios Web

31

Configuracin de una aplicacin WebMuchos sitios Web contienen pginas dinmicas que permiten a los visitantes ver informacin almacenada en bases de datos, y normalmente algunos de ellos pueden aadir nueva informacin y editar informacin de estas bases de datos. Para crear este tipo de pginas, primero debe realizar una serie de pasos preliminares.

Configure un servidor Web y un servidor de aplicaciones y, a continuacin, cree o modifique un sitio de Dreamweaver. (Vase Captulo 23, Configuracin de una aplicacin Web, en la pgina 679.) Conecte con una base de datos. (Vase Conexin con una base de datos en la pgina 691).

Creacin de pginas dinmicasEn Dreamweaver se pueden definir diversas fuentes de contenido dinmico, incluidos juegos de registros extrados de bases de datos, parmetros de formularios y componentes JavaBeans. Para aadir el contenido dinmico a una pgina, basta con arrastrarlo a ella. Puede definirse que los registros de la pgina aparezcan de uno en uno o en grupos, mostrar varias pginas de registros, aadir vnculos especiales para pasar de una pgina de registros a la siguiente (o a la anterior) y crear contadores para que los usuarios puedan llevar un control de los registros.

Si no est familiarizado con la creacin de aplicaciones Web en Dreamweaver, aprenda cmo utilizar Dreamweaver para crear pginas dinmicas. (Vase Captulo 30, Optimizacin del espacio de trabajo para desarrollo visual, en la pgina 743 y Captulo 31, Flujo de trabajo para el diseo de pginas dinmicas, en la pgina 757.) Defina y muestre el contenido dinmico de sus pginas. (Vase Captulo 32, Obtencin de datos para la pgina, en la pgina 767, Captulo 33, Definicin de fuentes de contenido dinmico, en la pgina 781, Captulo 34, Adicin de contenido dinmico a pginas Web, en la pgina 805 y Captulo 35, Visualizacin de registros de la base de datos, en la pgina 817.) Puede incorporar la lgica de aplicaciones o empresarial mediante tecnologas innovadoras, como los componentes ColdFusion de Macromedia y los servicios Web. (Vase Utilizacin de componentes de ColdFusion en la pgina 1008 y Captulo 37, Utilizacin de servicios Web (slo Windows), en la pgina 871.) Si necesita ms flexibilidad, puede crear sus propios comportamientos de servidor y formularios interactivos. (Vase Captulo 38, Adicin de comportamientos de servidor personalizados, en la pgina 885 y Captulo 39, Creacin de formularios, en la pgina 911.)

32

Introduccin

Desarrollo rpido de aplicacionesDreamweaver ofrece algunas herramientas de desarrollo rpido de aplicaciones (RAD), como comportamientos de servidor y objetos de aplicaciones, que permiten crear sofisticadas aplicaciones Web sin necesidad de escribir el cdigo del lado del servidor.

Cree con rapidez pginas que realicen bsquedas y modifiquen bases de datos, y muestren los resultados. Proporcione seguridad mediante la limitacin del acceso a las pginas. (Vase Creacin rpida de aplicaciones de ColdFusion en la pgina 935, Creacin rpida de aplicaciones ASP.NET en la pgina 1017, Creacin rpida de aplicaciones ASP y JSP en la pgina 1067 y Creacin rpida de aplicaciones PHP en la pgina 1093.)

Utilizacin de Dreamweaver con otras aplicacionesDreamweaver facilita el proceso de diseo y desarrollo de pginas Web al permitirle trabajar con otras aplicaciones. Para informacin sobre cmo trabajar con otras aplicaciones, como los navegadores, los editores HTML, los editores de imgenes y las herramientas de animacin, vanse los temas siguientes:

Para informacin sobre el uso de Dreamweaver con otros editores HTML, como HomeSite o BBEdit, vase Utilizacin de un editor de HTML externo con Dreamweaver en la pgina 617. Puede especificar sus navegadores preferidos para previsualizar el sitio. (Vase Vista previa y comprobacin de pginas en los navegadores en la pgina 409.) Puede iniciar un editor de imgenes externo, como Macromedia Fireworks o Adobe Photoshop, desde Dreamweaver. (Vase Utilizacin de un editor de imgenes externo en la pgina 472.) Puede configurar Dreamweaver para que inicie un editor distinto para cada tipo de archivo. (Vase Inicio de un editor externo de archivos multimedia en la pgina 537.) Para ms informacin sobre cmo aadir interactividad al sitio mediante pelculas Macromedia Flash, vase Insercin y modificacin de un objeto de botn Flash en la pgina 540, Insercin de un objeto de texto Flash en la pgina 542 o Descarga e instalacin de elementos Flash en la pgina 544. Para informacin sobre el uso de ColdFusion, consulte Utilizacin de ColdFusion (Ayuda > Utilizacin de ColdFusion).

Utilizacin de Dreamweaver con otras aplicaciones

33

Dreamweaver y accesibilidadLa accesibilidad designa la capacidad de crear sitios y productos Web que puedan utilizar aquellas personas con discapacidades visuales, auditivas, motoras u otras. Entre los ejemplos de funciones de accesibilidad para productos de software y sitios Web podemos citar la compatibilidad con lectores de pantalla, los equivalentes textuales para grficos, los accesos directos del teclado y el uso de colores de pantalla con alto contraste, entre otros.NO TA 34

Para ms informacin acerca de dos iniciativas importantes de accesibilidad, consulte la Iniciativa de Accesibilidad para la Web del World Wide Web Consortium (www.w3.org/ wai) y la Seccin 508 de la Ley federal de insercin (Federal Rehabilitation Act) (www.section508.gov).

Dreamweaver contiene herramientas que dotan al producto de accesibilidad y herramientas que le ayudan a crear contenido accesible:Utilizacin de las funciones de accesibilidad de Dreamweaver Para diseadores Web usuarios de Dreamweaver que necesiten utilizar funciones de accesibilidad, Dreamweaver ofrece lectores de pantalla, navegacin mediante el teclado y funciones de accesibilidad del sistema operativo.

Para ms informacin, consulte Utilizacin de las funciones de accesibilidad de Dreamweaver en la pgina 70.Creacin de sitios Web accesibles

Para diseadores Web usuarios de Dreamweaver que necesiten crear contenido accesible, Dreamweaver ayuda a crear pginas accesibles que incluyen contenido til para lectores de pantalla y que cumplen las directrices gubernamentales. Dreamweaver proporciona cuadros de dilogo que le permiten introducir atributos de accesibilidad al insertar elementos de pgina (vase Optimizacin del espacio de trabajo para el diseo de pginas accesibles en la pgina 76). Por ejemplo, el cuadro de dilogo para la accesibilidad de imgenes le recuerda que aada texto equivalente para los grficos. De esta forma, cuando la imagen aparezca en una pgina para un usuario con discapacidades visuales, el lector de pantalla leer la descripcin de la imagen.

Introduccin

Dreamweaver tambin incluye pginas Web de muestra pensadas con fines de accesibilidad (vase Creacin de un documento basado en un archivo de diseo de Dreamweaver en la pgina 103) y un informe de accesibilidad que puede ejecutar para probar si sus pginas o sitios siguen las directrices de accesibilidad de la Seccin 508 (vase Comprobacin del sitio en la pgina 173).NO T A

Recuerde que ninguna herramienta de creacin puede automatizar el proceso de desarrollo. Para disear sitios Web accesibles deber comprender cules son los requisitos de accesibilidad y tomar numerosas decisiones subjetivas sobre cmo los usuarios con discapacidades interactan con las pginas Web. La mejor forma de garantizar que un sitio Web es accesible consiste en realizar una planificacin, un desarrollo, una comprobacin y una evaluacin deliberadas.

Funcin de validacin de la accesibilidad de DreamweaverLa funcin de validacin de la accesibilidad de Dreamweaver utiliza tecnologa de UsableNet. UsableNet es una empresa lder en el desarrollo de software fcil de utilizar para automatizar la comprobacin y la reparacin de problemas de usabilidad y accesibilidad. Para obtener ms ayuda con la comprobacin de la accesibilidad, pruebe LIFT for Macromedia Dreamweaver de UsableNet, una solucin completa para desarrollar sitios Web utilizables y accesibles. LIFT for Macromedia Dreamweaver de UsableNet incluye asistentes para tablas, formularios e imgenes complejas, un editor de ALT global, informes personalizables y un nuevo modo de supervisin activo que asegura la accesibilidad al contenido a medida que se escriben las pginas. Solicite una versin de demostracin de LIFT for Macromedia Dreamweaver en www.usablenet.com

Gua de recursos de formacin de DreamweaverDreamweaver incluye diversos medios para ayudarle a aprender rpidamente el funcionamiento del programa y a dominar la creacin de pginas Web. El sistema de Ayuda de Dreamweaver contiene diversos documentos que le ayudarn a aprender a utilizar Dreamweaver, Dreamweaver Extensibility y ColdFusion. Tambin hay recursos en lnea adicionales que puede consultar para crear pginas Web.

Gua de recursos de formacin de Dreamweaver

35

Acceso a la documentacin de DreamweaverEn la siguiente tabla se resume la documentacin que contiene el sistema de Ayuda de Dreamweaver. Puede comprar versiones impresas de ttulos especficos. Para ms informacin, consulte www.macromedia.com/go/buy_books (en ingls).Ttulo Descripcin/ Audiencia Dnde encontrarlo

Ver en Dreamweaver: Le ofrece una Primeros Seleccione Ayuda > Primeros introduccin bsica a pasos con pasos con Dreamweaver Dreamweaver los conceptos de Ver en lnea: http:// Dreamweaver y a la livedocs.macromedia.com/go/ interfaz, con detallados livedocs_dreamweaver_es/ tutoriales para Descargar el PDF: principiantes. Dirigido a www.macromedia.com/go/ usuarios principiantes, y dw_documentation_es tambin para usuarios con nivel intermedio y avanzado que quieran conocer las nuevas funciones. Ver en Dreamweaver: Utilizacin de Informacin completa Seleccione Ayuda > Ayuda de Dreamweaver sobre todas las Dreamweaver o Ayuda > funciones de Utilizacin de Dreamweaver Dreamweaver. Dirigida Ver en lnea: http:// a todos los usuarios de livedocs.macromedia.com/go/ Dreamweaver. livedocs_dreamweaver_es/ Descargar el PDF: www.macromedia.com/go/ dw_documentation_es Ver en Dreamweaver: Ampliacin de Describe el marco de Seleccione Ayuda > Ampliacin Dreamweaver trabajo de de Dreamweaver Dreamweaver y la Ver en lnea: http:// interfaz de livedocs.macromedia.com/go/ programacin de la livedocs_dreamweaver_es/ aplicacin (API). Descargar el PDF: Destinado a usuarios www.macromedia.com/go/ avanzados que quieren dw_documentation_es crear extensiones o personalizar la interfaz de Dreamweaver.

36

Introduccin

Ttulo

Descripcin/ Audiencia

Dnde encontrarlo

Describe la utilidad API Ver en Dreamweaver: Referencia Seleccione Ayuda > Referencia y el JavaScript API, que API de API de Dreamweaver Dreamweaver le permiten realizar Ver en lnea: http:// diversas tareas de livedocs.macromedia.com/go/ apoyo al desarrollar livedocs_dreamweaver_es/ extensiones de Descargar el PDF: Dreamweaver. www.macromedia.com/go/ Destinado a usuarios dw_documentation_es avanzados que quieren crear extensiones o personalizar la interfaz de Dreamweaver. Utilizacin de ColdFusion Contiene una seleccin Ver en Dreamweaver: Seleccione Ayuda > Utilizacin de los libros ms de ColdFusion importantes con Ver en lnea: http:// documentacin sobre livedocs.macromedia.com/go/ ColdFusion. (La lista livedocs_coldfusion/ completa est Descargar el PDF: disponible en www.macromedia.com/go/ LiveDocs.) Dirigido a cf_documentation todo aquel que est interesado en ColdFusion, desde principiantes hasta desarrolladores avanzados. Contiene muchos tipos Ver en Dreamweaver: Seleccione Ayuda > Referencia. de manual de referencia Para una lista completa de sobre HTML, modelos manuales, haga clic en el men de servidores y otros emergente Libro en el panel temas, casi todos Referencia. publicados por OReilly. Destinado a todo aquel que necesite ms informacin sobre sintaxis de cdigos, conceptos, etc.

Referencia

Gua de recursos de formacin de Dreamweaver

37

Acceso a recursos en lnea adicionales de DreamweaverEn la siguiente tabla se resumen los recursos en lnea adicionales para el aprendizaje de Dreamweaver.Recurso Descripcin/ Audiencia Dnde encontrarlo

Notas tcnicas, soporte www.macromedia.com/go/ Centro de e informacin sobre la dreamweaver_support_es soporte de Dreamweaver resolucin de problemas para usuarios de Dreamweaver. Centro de Artculos y tutoriales desarrollo de que le ayudarn a Dreamweaver mejorar sus conocimientos y a adquirir otros nuevos. Centro de recursos de documentacin de Dreamweaver Foros en lnea de Macromedia Manuales del producto en formato PDF, fe de errores, tutoriales y notas de la versin. www.macromedia.com/go/ developer_dw_es

www.macromedia.com/go/ dw_documentation_es

Debates e informacin www.macromedia.com/go/ dreamweaver_newsgroup sobre resolucin de problemas proporcionada por usuarios de Dreamweaver, representantes del servicio tcnico y el equipo de desarrollo de Dreamweaver. www.macromedia.com/go/ dreamweaver_training_es

Formacin de Cursos que ofrecen Macromedia ejercicios prcticos y situaciones del mundo real.

Para sacar el mximo provecho de los recursos de Dreamweaver, consulte Por dnde empezar en la pgina 24.

38

Introduccin

Convenciones tipogrficasEn esta gua se utilizan las convenciones tipogrficas siguientes:

Los elementos de los mens se muestran en este formato: nombre del men > nombre del elemento del men. Los elementos de los submens se muestran en este formato: nombre del men > nombre del submen > nombre del elemento del men. La fuente de cdigo indica nombres de etiquetas y atributos HTML, as como el texto literal empleado en los ejemplos. La fuente de cdigo en cursiva indica elementos reemplazables (tambin denominados metasmbolos) en el cdigo. El texto Roman en negrita permite distinguir el texto que debe introducirse literalmente.

Para una lista completa de recursos de Dreamweaver, vase Gua de recursos de formacin de Dreamweaver en la pgina 35.

Recursos tecnolgicos HTML y WebA continuacin se indican algunos recursos tiles disponibles en la Web:N OT A

Para obtener una lista de recursos de Dreamweaver, vase Gua de recursos de formacin de Dreamweaver en la pgina 35.

La especificacin de hojas de estilos en cascada de nivel 1 (CSS1)

(www.w3.org/TR/ REC-CSS1) y la especificacin de nivel 2 (CSS2) (www.w3.org/TR/REC-CSS2/) son las especificaciones oficiales para hojas de estilos del World Wide Web Consortium. es la especificacin oficial

La especificacin HTML 4.01 (www.w3.org/TR/REC-html40/)

de HTML del World Wide Web Consortium.Index DOT HTML (www.blooberry.com/indexdot/html/)

es una amplia lista de etiquetas, atributos y valores HTML, as como su compatibilidad con distintos navegadores.

La especificacin XHTML 1.0

(www.w3.org/TR/xhtml1/) es la especificacin oficial para XHTML (Lenguaje de formato de hipertexto ampliable). proporciona informacin, tutoriales y sugerencias sobre XML (Lenguaje de formato ampliable) y sobre otras tecnologas Web.

El sitio de OReilly XML.com (www.xml.com/)

(www.xfront.com/rescuing-xslt.html) ofrece una introduccin a las transformaciones XSL para nuevos usuarios.El sitio de xFront Las pginas de introduccin a Microsoft ASP (http://msdn.microsoft.com/library/en-us/ dnasp/html/ASPover.asp) proporcionan informacin sobre Active Server Pages (ASP).

Recursos tecnolgicos HTML y Web

39

La pgina de Microsoft ASP.NET (http://msdn.microsoft.com/asp.net/)

proporciona

informacin sobre ASP.NET.La pgina Sun JSP (http://java.sun.com/products/jsp/)

proporciona informacin sobre

JavaServer Pages (JSP).El sitio Web de PHP (www.php.net/) El sitio Web de MySQL

proporciona informacin sobre PHP.

(www.mysql.com/) proporciona informacin sobre MySQL.

La tabla de entidades (www.bbsinc.com/iso8859.html) ofrece una relacin de los nombres de entidades empleados en ISO 8859-1 (Latin-1). La pgina del producto Macromedia ColdFusion (www.macromedia.com/go/coldfusion/)

proporciona informacin sobre ColdFusion.La pgina del producto Macromedia JRun Server (www.macromedia.com/go/jrun/) ofrece

informacin sobre el servidor de aplicaciones JRun Java.Web Services Demystified (www.sitepoint.com/article/692) explica qu son y qu hacen los

servicios Web.JavaScript Bible,

escrita por Danny Goodman (IDG Books), es un tratado completo sobre el lenguaje JavaScript 1.2.

JavaScript: El manual JavaScript Definitive Guide, escrito por David Flanagan (OReilly & Associates), proporciona informacin sobre todas las funciones, objetos, mtodos, propiedades y manejadores de eventos JavaScript. El ndice de recursos CGI(www.cgi-resources.com/)

es una base de datos sobre todos los aspectos relativos a CGI, como scripts listos para ser utilizados, documentacin, libros e incluso contratacin de programadores. incluye una

El sitio de Common Gateway Interface (http://hoohoo.ncsa.uiuc.edu/cgi/)

introduccin a CGI.

40

Introduccin

CAPTULO 1

Exploracin del espacio de trabajoPara sacar el mximo provecho de Macromedia Dreamweaver 8, deber conocer cules son los conceptos que subyacen al rea de trabajo de Dreamweaver y cmo seleccionar opciones, utilizar inspectores y paneles y establecer las preferencias que mejor se adapten a su forma de trabajar. Este captulo contiene las siguientes secciones:Espacio de trabajo de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41 Utilizacin de la ventana de documento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54 Utilizacin de barras de herramientas, inspectores y mens contextuales . . . . . . . 58 Utilizacin de paneles y grupos de p