Adobe Dreamweaver - MX2004 Guía de Utilización [es]

Utilización de Dreamweaver

Marcas comerciales

Add Life to the Web, Afterburner, Aftershock, Andromedia, Allaire, Animation PowerPack, Aria, Attain, Authorware, Authorware Star, Backstage, Bright Tiger, Clustercats, Cold Fusion, Contribute, Design in Motion, Director, Dream Templates, Dreamweaver, Drumbeat 2000, EDJE, EJIPT, Extreme 3D, Fireworks, Flash, Fontographer, FreeHand, Generator, HomeSite, JFusion, JRun, Kawa, Know Your Site, Knowledge Objects, Knowledge Stream, Knowledge Track, LikeMinds, Lingo, Live Effects, el logotipo y el diseño de MacRecorder, Macromedia, Macromedia Action!, Macromedia Flash, el logotipo y el diseño de Macromedia M, Macromedia Spectra, el logotipo y el diseño de Macromedia xRes, MacroModel, Made with Macromedia, el logotipo y el diseño de Made with Macromedia, el logotipo y el diseño de MAGIC, Mediamaker, Movie Critic, Open Sesame!, Roundtrip HTML, Shockwave, Sitespring, SoundEdit, Titlemaker, UltraDev, Web Design 101, what the web can be y Xtra son marcas registradas o marcas comerciales de Macromedia, Inc. y pueden estar registradas en los Estados Unidos de América o en otras jurisdicciones internacionales. Otros nombres de productos, logotipos, diseños, títulos, palabras o frases mencionados en esta publicación pueden ser marcas comerciales, marcas de servicio o nombres comerciales de Macromedia, Inc. u otras entidades y pueden estar registrados en determinadas jurisdicciones.

Información de otros proveedores

Este manual contiene vínculos con sitios Web de terceros que no están 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 vínculos exclusivamente para su comodidad, por lo que la inclusión del vínculo no implica la aceptación de responsabilidad alguna por parte de Macromedia por el contenido de dichos sitios de terceros.

En http://www.macromedia.com/go/thirdparty_es/ encontrará avisos de software de terceros y/u otros términos y condiciones.

Advertencia de Apple APPLE COMPUTER, INC. NO OFRECE GARANTÍAS DE NINGÚN TIPO, NI EXPRESAS NI IMPLÍCITAS, EN

RELACIÓN CON EL PAQUETE DE SOFTWARE INFORMÁTICO ADJUNTO, SU COMERCIABILIDAD O SU ADECUACIÓN PARA UN PROPÓSITO ESPECÍFICO. ALGUNOS ESTADOS NO ADMITEN LA EXCLUSIÓN DE GARANTÍAS IMPLÍCITAS. ES POSIBLE QUE LA EXCLUSIÓN ANTERIOR NO SE APLIQUE EN SU CASO. ESTA GARANTÍA PROPORCIONA AL USUARIO DERECHOS LEGALES ESPECÍFICOS. OTROS DERECHOS QUE LE PUEDAN CORRESPONDER VARÍAN DE UN ESTADO A OTRO.

Copyright © 2003 Macromedia, Inc. Todos los derechos reservados. Este manual no se puede copiar, fotocopiar, reproducir, traducir ni convertir a ningún formato electrónico o legible por máquina, en parte o en su totalidad, sin el permiso previo y por escrito de Macromedia, Inc. Número de componente ZDW70M200SP

Agradecimientos

Directora jefe: Sheila McGinn Dirección del proyecto: Charles Nadeau Redacción: Jed Hartman, Jennifer Rowe, Chris Bedford, Charles Nadeau Edición: Lisa Stanziano, Mary Ferguson, Noreen Maher Administración de la producción: Patrice O’Neill Producción y diseño multimedia: Adam Barnett, Aaron Begley, Chris Basmajian, John Francis, Jeff Harmon Un agradecimiento especial para Jay London, Alain Dumesny, Lori Hylan-Cho, Jack Herrington, Vic Mitnick, Rebecca Hyatt,

Russ Helfand, Erik Bergman, Luciano Arruda, Sho Kuwamoto, Ken Karleskint, Scott Richards, Bonnie Loo, David Deming, Jennifer Taylor, Rosana Francescato, Randy Nielsen, Liliana Ramirez-Cortes, Masayo Noda, Scott Richards, Seungmin Lee, Vincent Truong, Veronica Luongo, a los responsables de verificar la versión beta y a los equipos de ingeniería y control de calidad de Dreamweaver.

Primera edición: septiembre de 2003 Macromedia, Inc.

600 Townsend St. San Francisco, CA 94103

CONTENIDO

PARTE I: Aspectos básicos de Dreamweaver

INTRODUCCIÓN: Bienvenido a Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . 17

Novedades de Dreamweaver MX 2004 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

Por dónde empezar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Flujo de trabajo de Dreamweaver para la creación de sitios Web . . . . . . . . . . . . . . 23

Utilización de Dreamweaver con otras aplicaciones . . . . . . . . . . . . . . . . . . . . . . . . 27

Dreamweaver y accesibilidad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

Guía de recursos de formación de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . 28

Convenciones tipográficas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

Recursos tecnológicos HTML y Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

CAPÍTULO 1: Exploración del espacio de trabajo . . . . . . . . . . . . . . . . . . . . . . . . . 33

Espacio de trabajo de Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

Utilización de la ventana de documento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

Utilización de barras de herramientas, inspectores y menús contextuales . . . . . . . . 44

Utilización de paneles y grupos de paneles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50

Utilización de las funciones de accesibilidad de Dreamweaver . . . . . . . . . . . . . . . . 52

Optimización del espacio de trabajo para el diseño de páginas accesibles . . . . . . . . 56

Utilización de guías visuales en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57

Aspectos básicos de personalización de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . 58

CAPÍTULO 2: Configuración de un sitio de Dreamweaver . . . . . . . . . . . . . . . . . . 63

Acerca de los sitios de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63

Configuración de un sitio de Dreamweaver nuevo. . . . . . . . . . . . . . . . . . . . . . . . . 65

Utilización de las opciones Avanzadas para configurar un sitio de Dreamweaver . . 66

Edición de la configuración de un sitio de Dreamweaver . . . . . . . . . . . . . . . . . . . 70

Edición de sitios Web existentes con Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . 71

CAPÍTULO 3: Cómo crear y abrir documentos . . . . . . . . . . . . . . . . . . . . . . . . . . . 73

Creación de documentos nuevos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73

Cómo guardar un nuevo documento. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76

Configuración de un tipo de documento nuevo predeterminado . . . . . . . . . . . . . . 76

Cómo abrir documentos existentes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77

Importación de un archivo HTML de Microsoft Word. . . . . . . . . . . . . . . . . . . . . 78

PARTE II: Utilización de los sitios de Dreamweaver

CAPÍTULO 4: Administración de archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81

Administración de sitios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82

Acceso a sitios, a un servidor y a unidades locales. . . . . . . . . . . . . . . . . . . . . . . . . . 84

Visualización de archivos y carpetas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87

Administración de archivos y carpetas en el panel Archivos . . . . . . . . . . . . . . . . . . 90

Utilización de un mapa visual del sitio. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Importación y exportación de sitios. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100

Eliminación de un sitio de Dreamweaver de la lista de sitios . . . . . . . . . . . . . . . . 101

Desprotección y protección de archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 101

Obtención y colocación de archivos en el servidor . . . . . . . . . . . . . . . . . . . . . . . . 104

Sincronización de los archivos de los sitios local y remoto . . . . . . . . . . . . . . . . . . 107

Cómo ocultar carpetas y archivos en el sitio. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 108

Almacenamiento de información sobre archivos en Design Notes . . . . . . . . . . . . 111

Comprobación del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115

CAPÍTULO 5: Administración de activos y bibliotecas . . . . . . . . . . . . . . . . . . . . 119

Elementos de biblioteca. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120

Utilización de activos. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121

Creación y administración de una lista de activos favoritos . . . . . . . . . . . . . . . . . 127

Utilización de los elementos de biblioteca . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 129

CAPÍTULO 6: Administración de sitios de Contribute con Dreamweaver . . . . . 137

Administración de sitios de Contribute . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 138

Preparación de un sitio para su uso con Contribute . . . . . . . . . . . . . . . . . . . . . . . 142

Administrar un sitio de Contribute con Dreamweaver. . . . . . . . . . . . . . . . . . . . . 142

Solución de problemas de un sitio de Contribute . . . . . . . . . . . . . . . . . . . . . . . . 144

Administración de archivos de Contribute con Dreamweaver . . . . . . . . . . . . . . . 145

PARTE III: Diseño de páginas

CAPÍTULO 7: Diseño de páginas con CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151

Acerca de las capas en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152

Inserción de bloques de contenido para diseño . . . . . . . . . . . . . . . . . . . . . . . . . . 153

Cambio del color de resaltado de los bloques de contenido . . . . . . . . . . . . . . . . . 154

Utilización de bloques de contenido para diseño . . . . . . . . . . . . . . . . . . . . . . . . . 155

4 Contenido

Inserción de una capa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 156

Configuración de preferencias y propiedades de capa. . . . . . . . . . . . . . . . . . . . . . 158

Administración de capas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159

Manipulación de capas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162

Conversión de capas en tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165

Utilización de reglas y cuadrículas para diseñar páginas . . . . . . . . . . . . . . . . . . . . 166

Utilización de una imagen de rastreo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167

CAPÍTULO 8: Presentación de contenido en tablas . . . . . . . . . . . . . . . . . . . . . . 169

Tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170

Inserción de una tabla y adición de contenido . . . . . . . . . . . . . . . . . . . . . . . . . . . 171

Importación y exportación de datos de tabla . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172

Selección de elementos de una tabla . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173

Utilización del modo de tablas expandidas para facilitar la edición de tablas . . . . 176

Aplicación de formato a tablas y celdas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 176

Cambio de tamaño de tablas, columnas y filas . . . . . . . . . . . . . . . . . . . . . . . . . . . 178

Adición y eliminación de filas y columnas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182

División y combinación de celdas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184

Cómo copiar, pegar y eliminar celdas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185

Ordenación de tablas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187

CAPÍTULO 9: Diseño de páginas en el modo de diseño. . . . . . . . . . . . . . . . . . . 189

Modo de diseño. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190

Alternancia entre modo estándar y modo de diseño. . . . . . . . . . . . . . . . . . . . . . . 193

Dibujo en el modo de diseño. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 194

Adición de contenido a una celda de diseño . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197

Cómo borrar los altos de celdas establecidos automáticamente . . . . . . . . . . . . . . 198

Cambio de tamaño y desplazamiento de celdas y tablas de diseño . . . . . . . . . . . . 198

Aplicación de formato a celdas y tablas de diseño . . . . . . . . . . . . . . . . . . . . . . . . 200

Establecimiento del ancho de columna . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200

Configuración de preferencias para el modo de diseño. . . . . . . . . . . . . . . . . . . . . 203

CAPÍTULO 10: Utilización de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205

Marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206

Utilización de conjuntos de marcos en la ventana de documento. . . . . . . . . . . . . 209

Creación de marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210

Selección de marcos y conjuntos de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213

Cómo abrir un documento en un marco . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215

Almacenamiento de archivos de marcos y conjuntos de marcos . . . . . . . . . . . . . . 215

Visualización y configuración de las propiedades y los atributos de los marcos. . . 216

Visualización y configuración de las propiedades de un conjunto de marcos . . . . 218

Control del contenido de los marcos con vínculos. . . . . . . . . . . . . . . . . . . . . . . . 218

Manipulación de navegadores que no pueden mostrar marcos. . . . . . . . . . . . . . . 219

Utilización de comportamientos JavaScript con marcos. . . . . . . . . . . . . . . . . . . . 220

Contenido 5

CAPÍTULO 11: Administración de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221

Plantillas de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222

Creación de una plantilla de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233

Creación de plantillas para un sitio de Contribute. . . . . . . . . . . . . . . . . . . . . . . . 236

Creación de regiones editables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 239

Creación de regiones repetidas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 241

Utilización de regiones opcionales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243

Definición de atributos de etiqueta editables . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245

Creación de una plantilla anidada . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 246

Edición y actualización de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 248

Administración de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251

Exportación e importación de contenido XML de plantillas . . . . . . . . . . . . . . . . 252

Exportación de un sitio sin formato de plantilla . . . . . . . . . . . . . . . . . . . . . . . . . 253

Aplicación o eliminación de una plantilla de un documento existente . . . . . . . . . 253

Edición de contenido de un documento basado en plantilla . . . . . . . . . . . . . . . . 254

PARTE IV: Adición de contenido a las páginas

CAPÍTULO 12: Utilización de páginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 259

Utilización de páginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260

Almacenamiento de páginas Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 263

Especificación de HTML en lugar de CSS. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 264

Configuración de propiedades de la página . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265

Utilización de colores . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 267

Selección de elementos en la ventana de documento . . . . . . . . . . . . . . . . . . . . . . 268

Automatización de tareas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271

Utilización de comportamientos de JavaScript para detectar

navegadores y plug-ins . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 276

Vista previa y comprobación de páginas en los navegadores. . . . . . . . . . . . . . . . . 277

Configuración de las preferencias de tiempo de descarga y tamaño . . . . . . . . . . . 279

CAPÍTULO 13: Inserción y formato de texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281

Aplicación de formato a texto en Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . 282

Inserción de texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 289

Aplicación de formato a párrafos y a la estructura de la página. . . . . . . . . . . . . . . 291

Aplicación de formato al texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294

Utilización de estilos de hojas de estilos en cascada . . . . . . . . . . . . . . . . . . . . . . . 299

Actualización de hojas de estilos CSS en un sitio de Contribute . . . . . . . . . . . . . 307

Comprobación de la ortografía . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 309

Cómo buscar y reemplazar texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 309

6 Contenido

CAPÍTULO 14: Inserción de imágenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 311

Imágenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312

Inserción de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 313

Cambio del tamaño de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 318

Recorte de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 319

Optimización de una imagen mediante Fireworks . . . . . . . . . . . . . . . . . . . . . . . . 319

Ajuste del brillo y del contraste de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . 320

Perfilado de una imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 320

Creación de una imagen de sustitución . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 321

Utilización de un editor de imágenes externo. . . . . . . . . . . . . . . . . . . . . . . . . . . . 322

Aplicación de comportamientos a imágenes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 322

CAPÍTULO 15: Establecimiento de vínculos y navegación . . . . . . . . . . . . . . . . . 325

Aspectos básicos de ubicación y rutas de documentos . . . . . . . . . . . . . . . . . . . . . 326

Menús de salto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 328

Barras de navegación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 329

Mapas de imágenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330

Creación de vínculos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330

Administración de vínculos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 338

Inserción de menús de salto. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 341

Utilización de las barras de navegación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 343

Utilización de los mapas de imagen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 345

Cómo adjuntar comportamientos JavaScript a vínculos. . . . . . . . . . . . . . . . . . . . 347

Comprobación de vínculos rotos, externos y huérfanos . . . . . . . . . . . . . . . . . . . . 347

Reparación de vínculos rotos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 349

Apertura de documentos vinculados en Dreamweaver . . . . . . . . . . . . . . . . . . . . . 350

CAPÍTULO 16: Utilización con otras aplicaciones. . . . . . . . . . . . . . . . . . . . . . . . 351

Integración de Fireworks y Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 352

Optimización del entorno de trabajo para Fireworks y Flash . . . . . . . . . . . . . . . . 352

Utilización de Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 353

Utilización de Flash. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 361

CAPÍTULO 17: Adición de audio, vídeo y elementos interactivos . . . . . . . . . . . . 365

Archivos multimedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 366

Inserción y edición de objetos multimedia. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 368

Inicio de un editor externo de archivos multimedia . . . . . . . . . . . . . . . . . . . . . . . 369

Utilización de Design Notes con objetos multimedia. . . . . . . . . . . . . . . . . . . . . . 371

Inserción y modificación de un objeto de botón Flash . . . . . . . . . . . . . . . . . . . . 371

Inserción de un objeto de texto Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 373

Inserción de contenido de Flash. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374

Descarga e instalación de elementos Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374

Inserción de elementos Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 375

Edición de atributos de elementos Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 375

Inserción de películas Shockwave. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 376

Adición de vídeo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 376

Adición de sonido a una página . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 376

Contenido 7

Inserción de contenido de plug-in de Netscape Navigator . . . . . . . . . . . . . . . . . . 377

Inserción de un control ActiveX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 379

Inserción de un applet de Java . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 380

Utilización de comportamientos para controlar elementos multimedia . . . . . . . . 380

CAPÍTULO 18: Utilización de comportamientos JavaScript. . . . . . . . . . . . . . . . 381

Utilización del panel Comportamientos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 382

Eventos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 382

Aplicación de un comportamiento. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 383

Cómo adjuntar un comportamiento a un texto . . . . . . . . . . . . . . . . . . . . . . . . . . 384

Cambio de un comportamiento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 385

Actualización de un comportamiento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 385

Creación de nuevas acciones . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 386

Descarga e instalación de comportamientos de terceros . . . . . . . . . . . . . . . . . . . . 386

Utilización de las acciones de comportamiento incluidas con Dreamweaver . . . . 386

PARTE V: Utilización del código de las páginas

CAPÍTULO 19: Configuración del entorno de codificación. . . . . . . . . . . . . . . . . 413

Visualización del código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 413

Utilización del espacio de trabajo orientado al codificador (sólo en Windows). . . 414

Configuración de las preferencias de visualización . . . . . . . . . . . . . . . . . . . . . . . . 415

Configuración de las preferencias de codificación . . . . . . . . . . . . . . . . . . . . . . . . 415

Personalización de los métodos abreviados de teclado . . . . . . . . . . . . . . . . . . . . . 417

Cómo abrir archivos en la vista de código de forma predeterminada . . . . . . . . . . 417

Configuración de las preferencias del validador . . . . . . . . . . . . . . . . . . . . . . . . . . 418

Administración de bibliotecas de etiquetas. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 418

Importación de etiquetas personalizadas a Dreamweaver . . . . . . . . . . . . . . . . . . . 422

Utilización de un editor de HTML externo con Dreamweaver . . . . . . . . . . . . . . 424

CAPÍTULO 20: Codificación en Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . 427

Codificación en Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 428

Escritura y edición de código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 436

Búsqueda y reemplazo de etiquetas y atributos. . . . . . . . . . . . . . . . . . . . . . . . . . . 441

Cambios rápidos en una selección de código . . . . . . . . . . . . . . . . . . . . . . . . . . . . 443

Utilización del material de consulta para lenguajes. . . . . . . . . . . . . . . . . . . . . . . . 444

Impresión del código. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 445

CAPÍTULO 21: Optimización y depuración del código . . . . . . . . . . . . . . . . . . . . 447

Limpieza del código. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 447

Verificación de que las etiquetas y llaves están equilibradas . . . . . . . . . . . . . . . . . 448

Comprobación de la compatibilidad con los navegadores . . . . . . . . . . . . . . . . . . 448

Validación de etiquetas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 451

Creación de páginas compatibles con XHTML . . . . . . . . . . . . . . . . . . . . . . . . . . 452

Utilización del depurador de ColdFusion (sólo Windows). . . . . . . . . . . . . . . . . . 453

8 Contenido

CAPÍTULO 22: Edición de código en la vista Diseño . . . . . . . . . . . . . . . . . . . . . 455

Edición de código con el inspector de propiedades . . . . . . . . . . . . . . . . . . . . . . . 455

Cambio de atributos con el inspector de etiquetas . . . . . . . . . . . . . . . . . . . . . . . . 456

Edición de código con Quick Tag Editor. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 457

Edición de código con el selector de etiquetas . . . . . . . . . . . . . . . . . . . . . . . . . . . 460

Edición de scripts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 460

Utilización de server-side includes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 462

Utilización de comportamientos JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 463

Visualización y edición del contenido de Head . . . . . . . . . . . . . . . . . . . . . . . . . . 463

PARTE VI: Preparación para crear sitios dinámicos

CAPÍTULO 23: Configuración de una aplicación Web. . . . . . . . . . . . . . . . . . . . 467

Lo que necesita para crear aplicaciones Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . 467

Configuración de un servidor Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 468

Configuración de un servidor de aplicaciones . . . . . . . . . . . . . . . . . . . . . . . . . . . 468

Creación de una carpeta raíz para la aplicación . . . . . . . . . . . . . . . . . . . . . . . . . . 471

Definición de un sitio de Dreamweaver. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 473

Conexión con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 475

CAPÍTULO 24: Conexiones de base de datos para

desarrolladores de ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477

Conexión con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477

Edición o eliminación de una conexión de base de datos . . . . . . . . . . . . . . . . . . . 478

CAPÍTULO 25: Conexiones de base de datos para

desarrolladores de ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 479

Conexión con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 479

Edición o eliminación de una conexión de base de datos . . . . . . . . . . . . . . . . . . . 482

CAPÍTULO 26: Conexiones de base de datos para desarrolladores de ASP . . 485

Conexiones de base de datos en ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 486

Creación de una conexión con DSN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 487

Creación de una conexión sin DSN . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 490

Conexión con una base de datos en un ISP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 491

Edición o eliminación de una conexión de base de datos . . . . . . . . . . . . . . . . . . . 494

CAPÍTULO 27: Conexiones de base de datos para desarrolladores de JSP . . . 495

Conexiones de base de datos en JSP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 495

Conexión con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 497

Conexión mediante un controlador ODBC . . . . . . . . . . . . . . . . . . . . . . . . . . . . 498

Edición o eliminación de una conexión de base de datos . . . . . . . . . . . . . . . . . . . 501

Contenido 9

CAPÍTULO 28: Conexiones de base de datos para desarrolladores de PHP . . 503

Conexión con una base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 503

Edición o eliminación de una conexión de base de datos . . . . . . . . . . . . . . . . . . . 504

CAPÍTULO 29: Solución de problemas de conexiones de base de datos . . . . . 505

Solución de problemas relacionados con permisos . . . . . . . . . . . . . . . . . . . . . . . . 505

Solución de problemas relacionados con mensajes de error de Microsoft . . . . . . . 507

PARTE VII: Creación de páginas dinámicas

CAPÍTULO 30: Optimización del espacio de trabajo para desarrollo visual. . . . 515

Visualización de paneles de desarrollo de aplicaciones Web . . . . . . . . . . . . . . . . . 515

Visualización de la base de datos en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . 517

Visualización de live data en la vista de Diseño . . . . . . . . . . . . . . . . . . . . . . . . . . 518

Utilización de la vista de Diseño sin datos dinámicos. . . . . . . . . . . . . . . . . . . . . . 523

Vista previa de páginas dinámicas en un navegador . . . . . . . . . . . . . . . . . . . . . . . 523

Restricción de la información de base de datos que se

muestra en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 524

CAPÍTULO 31: Flujo de trabajo para el diseño de páginas dinámicas . . . . . . . . 525

Diseño de la página. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 526

Creación de una fuente de contenido dinámico. . . . . . . . . . . . . . . . . . . . . . . . . . 526

Adición de contenido dinámico a una página Web . . . . . . . . . . . . . . . . . . . . . . . 528

Mejora de la funcionalidad de una página dinámica . . . . . . . . . . . . . . . . . . . . . . 528

Comprobación y depuración de la página . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 529

CAPÍTULO 32: Obtención de datos para la página . . . . . . . . . . . . . . . . . . . . . . 533

Utilización de una base de datos para almacenar contenido . . . . . . . . . . . . . . . . . 533

Recopilación de los datos enviados por los usuarios . . . . . . . . . . . . . . . . . . . . . . . 534

Acceso a datos almacenados en variables de sesión . . . . . . . . . . . . . . . . . . . . . . . . 539

CAPÍTULO 33: Definición de fuentes de contenido dinámico . . . . . . . . . . . . . . 545

Fuentes de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 546

Definición de un juego de registros . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 551

Definición de parámetros de URL. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 554

Definición de parámetros de formulario . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 555

Definición de variables de sesión . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 556

Definición de variables de aplicación para ASP y ColdFusion . . . . . . . . . . . . . . . 557

Utilización de una variable como fuente de datos para un juego de registros

ColdFusion. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 558

Definición de variables de servidor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 559

Creación de un caché de las fuentes de contenido . . . . . . . . . . . . . . . . . . . . . . . . 562

Cambio o eliminación de fuentes de contenido . . . . . . . . . . . . . . . . . . . . . . . . . . 563

Copia de un juego de registros de una página a otra . . . . . . . . . . . . . . . . . . . . . . 564

10 Contenido

CAPÍTULO 34: Adición de contenido dinámico a páginas Web . . . . . . . . . . . . 565

Adición de contenido dinámico. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 566

Conversión de texto en contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . 567

Conversión de imágenes en contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . 568

Conversión de atributos HTML en contenido dinámico . . . . . . . . . . . . . . . . . . 569

Conversión de parámetros de ActiveX, Flash y de otros objetos en

contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571

Edición del contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571

Eliminación de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 572

Creación de páginas dinámicas en un sitio de Contribute . . . . . . . . . . . . . . . . . . 572

CAPÍTULO 35: Visualización de registros de la base de datos . . . . . . . . . . . . . 575

Visualización de registros de la base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . 575

Utilización de formatos de datos predefinidos . . . . . . . . . . . . . . . . . . . . . . . . . . . 582

Creación de vínculos de navegación por conjuntos de registros . . . . . . . . . . . . . . 583

Visualización y ocultación de registros según los resultados del juego de

registros . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 586

Visualización de varios resultados de juego de registros . . . . . . . . . . . . . . . . . . . . 586

Creación de una tabla con un comportamiento del servidor Repetir región. . . . . 587

Creación de un contador de registros . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 588

Creación de controles Web Cuadrícula de datos y Lista de datos de ASP.NET . . 590

CAPÍTULO 36: Utilización de componentes de ColdFusion . . . . . . . . . . . . . . . 595

Componentes de ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 595

Creación visual de un componente en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . 596

Visualización de componentes de ColdFusion en Dreamweaver . . . . . . . . . . . . . 597

Edición de componentes de ColdFusion en Dreamweaver. . . . . . . . . . . . . . . . . . 598

Creación de páginas Web que utilicen componentes de ColdFusion . . . . . . . . . . 599

CAPÍTULO 37: Utilización de servicios Web (sólo Windows) . . . . . . . . . . . . . . 601

Servicios Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 602

Configuración de generadores proxy para utilizarlos con Dreamweaver . . . . . . . . 605

Adición de un proxy de servicios Web utilizando la descripción WSDL . . . . . . . 607

Adición de un servicio Web a una página . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 608

Edición de la lista de sitios de servicios Web UDDI. . . . . . . . . . . . . . . . . . . . . . . 610

CAPÍTULO 38: Adición de comportamientos de servidor personalizados. . . . . 611

Comportamientos de servidor personalizados . . . . . . . . . . . . . . . . . . . . . . . . . . . 611

Instalación de comportamientos de servidor de terceros . . . . . . . . . . . . . . . . . . . 620

Utilización del Creador de comportamientos de servidor. . . . . . . . . . . . . . . . . . . 621

Utilización de parámetros en comportamientos de servidor . . . . . . . . . . . . . . . . . 624

Colocación de bloques de código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 625

Creación de un cuadro de diálogo para un comportamiento de

servidor personalizado . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 626

Edición y modificación de comportamientos de servidor. . . . . . . . . . . . . . . . . . . 628

Contenido 11

CAPÍTULO 39: Creación de formularios. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 631

Formularios. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 631

Creación de formularios HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 635

Inserción de objetos de formulario HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 637

Inserción de objetos de formulario HTML dinámicos . . . . . . . . . . . . . . . . . . . . . 641

Validación de datos de formulario HTML. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 644

Cómo adjuntar comportamientos JavaScript a objetos de formulario HTML . . . 645

Cómo adjuntar scripts personalizados a botones de formulario HTML . . . . . . . . 645

Creación de formularios HTML accesibles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 646

Creación de formularios ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 647

PARTE VIII: Desarrollo rápido de aplicaciones

CAPÍTULO 40: Creación rápida de aplicaciones de ColdFusion . . . . . . . . . . . . 653

Desarrollo rápido de aplicaciones (todos los servidores) . . . . . . . . . . . . . . . . . . . . 653

Creación de páginas maestra-detalle (ColdFusion). . . . . . . . . . . . . . . . . . . . . . . . 658

Creación de páginas de búsqueda/resultados (ColdFusion, ASP, JSP, PHP) . . . . . 665

Creación de una página de inserción de registro (todos los servidores) . . . . . . . . . 671

Creación de páginas para actualizar un registro (ColdFusion) . . . . . . . . . . . . . . . 673

Creación de páginas para eliminar un registro (ColdFusion) . . . . . . . . . . . . . . . . 679

Utilización de procedimientos almacenados para modificar bases de datos

(ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 687

Creación de páginas que restrinjan el acceso al sitio

(ColdFusion, ASP, JSP Y PHP). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 689

CAPÍTULO 41: Creación rápida de aplicaciones ASP.NET . . . . . . . . . . . . . . . . 699

Creación de páginas maestra-detalle (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . 699

Creación de una página de búsqueda en la base de datos (ASP.NET). . . . . . . . . . 705

Creación de una página de inserción de registro (ASP.NET) . . . . . . . . . . . . . . . . 710

Creación de páginas para actualizar un registro (ASP.NET) . . . . . . . . . . . . . . . . . 710

Creación de páginas para eliminar un registro (ASP.NET) . . . . . . . . . . . . . . . . . . 717

Utilización de procedimientos almacenados para modificar bases de datos

(ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 725

Creación de páginas que restrinjan el acceso al sitio (ASP.NET) . . . . . . . . . . . . . 726

CAPÍTULO 42: Creación rápida de aplicaciones ASP y JSP. . . . . . . . . . . . . . . 729

Creación de páginas maestra-detalle (ASP y JSP). . . . . . . . . . . . . . . . . . . . . . . . . 729

Creación de páginas de búsqueda/resultados (ASP y JSP) . . . . . . . . . . . . . . . . . . 732

Creación de una página de inserción de registro (ASP y JSP). . . . . . . . . . . . . . . . 733

Creación de páginas para actualizar un registro (ASP y JSP) . . . . . . . . . . . . . . . . 733

Creación de páginas para eliminar un registro (ASP y JSP) . . . . . . . . . . . . . . . . . 738

Creación de páginas con objetos de manipulación de datos avanzados

(ASP y JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 741

Creación de páginas que restrinjan el acceso al sitio (ASP y JSP) . . . . . . . . . . . . . 745

12 Contenido

CAPÍTULO 43: Creación rápida de aplicaciones PHP . . . . . . . . . . . . . . . . . . . . 747

Creación de páginas maestra-detalle (PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 747

Creación de páginas de búsqueda/resultados (PHP). . . . . . . . . . . . . . . . . . . . . . . 752

Creación de una página de inserción de registros (PHP) . . . . . . . . . . . . . . . . . . . 752

Creación de páginas para actualizar un registro (PHP). . . . . . . . . . . . . . . . . . . . . 753

Creación de páginas para eliminar un registro (PHP) . . . . . . . . . . . . . . . . . . . . . 759

Creación de páginas que restrinjan el acceso al sitio (PHP) . . . . . . . . . . . . . . . . . 766

PARTE IX: Apéndices

APÉNDICE A: Guía de bases de datos para principiantes . . . . . . . . . . . . . . . . . 769

Bases de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 769

Aspectos básicos del diseño de bases de datos. . . . . . . . . . . . . . . . . . . . . . . . . . . . 770

Aspectos básicos de las conexiones de bases de datos . . . . . . . . . . . . . . . . . . . . . . 776

APÉNDICE B: Nociones básicas de SQL . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 781

Aspectos básicos de la sintaxis . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 781

Definición de las columnas en un juego de registros . . . . . . . . . . . . . . . . . . . . . . 783

Limitación de los registros en un juego de registros . . . . . . . . . . . . . . . . . . . . . . . 783

Clasificación de los registros en un juego de registros. . . . . . . . . . . . . . . . . . . . . . 786

Unión de tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 787

ÍNDICE ALFABÉTICO . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 789

Contenido 13

14 Contenido

PARTE I

Aspectos básicos de Dreamweaver

Aprenda a utilizar la documentación y otros recursos de Macromedia Dreamweaver MX 2004 y configure el espacio de trabajo de Dreamweaver de acuerdo con su método de trabajo. Posteriormente, planifique y configure un sitio y comience a crear páginas.

Esta parte contiene los siguientes capítulos:

Introducción, “Bienvenido a Dreamweaver,” en la página 17 Capítulo 1, “Exploración del espacio de trabajo,” en la página 33 Capítulo 2, “Configuración de un sitio de Dreamweaver,” en la página 63 Capítulo 3, “Cómo crear y abrir documentos,” en la página 73

PARTE I

INTRODUCCIÓN

Bienvenido a Dreamweaver

Macromedia Dreamweaver MX 2004 es un editor HTML profesional para diseñar, codificar y desarrollar sitios, páginas y aplicaciones Web. Tanto si desea controlar manualmente el código HTML como si prefiere trabajar en un entorno de edición visual, Dreamweaver le proporciona útiles herramientas que mejorarán su experiencia de creación Web.

Las funciones de edición visual de Dreamweaver permiten crear páginas de forma rápida, sin escribir una sola línea de código. Puede ver todos los elementos o activos del sitio y arrastrarlos desde un panel fácil de usar directamente hasta un documento. Puede agilizar el flujo de trabajo de desarrollo mediante la creación y edición de imágenes en Macromedia Fireworks o en otra aplicación de gráficos y su posterior importación directa a Dreamweaver, o bien añadir objetos Macromedia Flash.

Dreamweaver también ofrece un entorno de codificación con todas las funciones, que incluye herramientas para la edición de código (tales como coloreado de código y terminación automática de etiquetas) y material de referencia sobre HTML, hojas de estilos en cascada (CSS), JavaScript, ColdFusion Markup Language (CFML), Microsoft Active Server Pages (ASP) y JavaServer Pages (JSP). La tecnología Roundtrip HTML de Macromedia importa los documentos con código manual HTML sin modificar el formato del código. Posteriormente, si lo desea, puede formatear el código con el estilo que prefiera.

Dreamweaver le permite crear aplicaciones Web dinámicas basadas en bases de datos empleando tecnologías de servidor como CFML,ASP.NET, ASP, JSP y PHP.

Dreamweaver se puede personalizar totalmente. Puede crear sus propios objetos y comandos, modificar métodos abreviados de teclado e incluso escribir código JavaScript para ampliar las posibilidades que ofrece Dreamweaver con nuevos comportamientos, inspectores de propiedades e informes de sitios.

Este capítulo contiene las secciones siguientes:

• “Novedades de Dreamweaver MX 2004” en la página 18

• “Por dónde empezar” en la página 20

• “Flujo de trabajo de Dreamweaver para la creación de sitios Web” en la página 23

• “Utilización de Dreamweaver con otras aplicaciones” en la página 27

• “Dreamweaver y accesibilidad” en la página 27

• “Guía de recursos de formación de Dreamweaver” en la página 28

• “Convenciones tipográficas” en la página 30

• “Recursos tecnológicos HTML y Web” en la página 30

Novedades de Dreamweaver MX 2004

Dreamweaver MX 2004 contiene una nueva interfaz mejorada, junto con un mejor rendimiento del producto. También hay una gran variedad de funciones nuevas que mejoran el uso y ayudan a crear páginas, tanto si trabaja en el entorno de diseño como si lo hace en el entorno de codificación.

Interfaz de desarrollo y diseño optimizada

La interfaz de Dreamweaver es más accesible para ayudarle a mejorar la productividad y la calidad del trabajo.

Las

mejoras de la barra Insertar confieren a la barra Insertar un nuevo aspecto optimizado que

ocupa menos en el espacio de trabajo. Además, se incluye la nueva categoría Favoritos, que se puede emplear para personalizar una barra Insertar con los objetos más frecuentemente utilizados. Para más información, consulte “Barra Insertar” en la página 39.

Los

comandos Copiar y Pegar de Microsoft Word y Microsoft Excel le permiten copiar y pegar

un documento de Microsoft Word o Excel directamente en Dreamweaver. Cuando se pega un documento de Word o Excel, Dreamweaver conserva el formato y genera HTML de calidad. Para más información, consulte “Cómo copiar y pegar texto de documentos de MS Office” en

la página 290.

respuesta visual de la edición de tablas permite ver los efectos que las operaciones de cambio

de tamaño de las columnas tendrán en las tablas. La respuesta visual también simplifica la selección de elementos de tabla. Para más información sobre cómo cambiar el tamaño, consulte

“Cambio de tamaño de tablas, columnas y filas” en la página 178. Para más información acerca

del uso del modo de tablas expandidas para la selección de elementos, consulte “Utilización del

modo de tablas expandidas para facilitar la edición de tablas” en la página 176.

renovación de la interfaz de usuario maximiza el espacio de trabajo utilizable, mostrando

más claramente el contexto y el foco, a la vez que la hace más lógica y accesible. Para más información sobre el objeto espacio de trabajo de Dreamweaver, consulte “Espacio de trabajo de

Dreamweaver” en la página 34.

página de inicio permite acceder a los archivos utilizados recientemente, crear archivos nuevos

y acceder a los recursos de Dreamweaver. La página de inicio aparece cuando se inicia Dreamweaver o cuando no se tiene abierto ningún documento. Para más información sobre cómo ocultar o mostrar la página de inicio, consulte “Cómo ocultar y mostrar la página de inicio” en

la página 59.

opción del escritorio guardado ofrece la posibilidad de que Dreamweaver vuelva a abrir los

documentos con los que estaba trabajando al reiniciar Dreamweaver. Para más información sobre cómo configurar esta opción, consulte “Configuración de las preferencias generales para

Dreamweaver” en la página 60.

Gracias a la codificaciones de texto con las que es compatible Internet Explorer. Puede utilizar casi cualquier fuente de idioma instalada en el sistema en Dreamweaver, y Dreamweaver la procesará y guardará adecuadamente. Para más información sobre cómo configurar codificaciones de fuente, consulte

“Configuración de las preferencias de fuentes para la visualización de Dreamweaver” en la página 60.

compatibilidad total con Unicode, Dreamweaver en Windows admite todas las

18 Introducción: Bienvenido a Dreamweaver

El FTP seguro permite cifrar completamente todas las transferencias y evitar los accesos no autorizados a sus datos, archivos, nombres de usuario y contraseñas. Para más información sobre el establecimiento de una conexión remota mediante FTP, consulte “Configuración de una

carpeta remota” en la página 69.

Diseño de página y entorno de diseño modernizados

Dreamweaver incluye las siguientes funciones mejoradas de CSS que ofrecen un modo más sofisticado para dar estilo y añadir interactividad a los diseños, además de información para mejorar la edición visual.

validación dinámica entre navegadores comprueba automáticamente la compatibilidad

entre navegadores del documento actual al guardarlo. El usuario especifica los navegadores que desee y Dreamweaver comprueba que las páginas no utilicen etiquetas o construcciones CSS que dichos navegadores no admitan. Para más información, consulte “Comprobación de la

compatibilidad con los navegadores” en la página 448.

ficha CSS relevante muestra las reglas CSS que se aplican a la selección actual en vista de

código o vista de diseño. Haga clic en cualquier regla para ver qué atributos especifica (estilo de bordes, margen, relleno, tamaño del texto, etc). Una marca especial le indica si se ha omitido un atributo concreto y la edición en contexto permite editar rápidamente reglas que se aplican al momento en la vista de diseño. Para más información, consulte “Ficha Propiedades de CSS” en

la página 288.

visualización de diseño CSS simplifica enormemente el diseño de páginas en CSS. Puede

seleccionar con facilidad

div y otros bloques de contenido en la vista Diseño para modificar sus

propiedades en la ficha Propiedades de CSS. Para más información, consulte Capítulo 7, “Diseño

de páginas con CSS”, en la página 151.

presentación de CSS mejorada implica que Dreamweaver puede presentar disposiciones y

diseños basados en CSS más complicados y de forma más precisa. La presentación de CSS mejorada permite realizar diseños más sofisticados y utilizar las herramientas de diseño de Dreamweaver para diversas manipulaciones visuales.

panel mejorado Estilos CSS proporciona más opciones para la edición de estilos en el

documento actual. Ahora también puede aplicar estilos directamente desde el inspector de propiedades de texto. Para más información, consulte “Utilización de estilos de hojas de estilos en

cascada” en la página 299.

inspector de propiedades de texto basado en CSS lista todos los estilos disponibles para su

uso en texto, e incluye una vista previa que muestra el aspecto que tendrá el texto una vez se aplique el estilo. Para más información, consulte “Inspector de propiedades y aplicación de

formato a texto” en la página 286.

Las

propiedades de página basadas en CSS ofrecen un mayor control de las propiedades de la

página, como el aspecto de los encabezados y los vínculos, mediante modernas construcciones de codificación de CSS. Para más información, consulte “Configuración de propiedades de la

página” en la página 260.

barra de herramientas de edición de imágenes integrada permite llevar a cabo

manipulaciones básicas en la imagen y editarla desde Dreamweaver mediante la tecnología de Macromedia Fireworks. Podrá recortar, cambiar el tamaño y volver a muestrear, entre otras funciones, sin salir de Dreamweaver. Para más información, consulte “Edición de imágenes en

Dreamweaver” en la página 312.

Novedades de Dreamweaver MX 2004 19

Entorno de codificación potente y abierto

Dreamweaver proporciona las siguientes nuevas funciones para codificadores, entre las que se incluyen las mejoras en la vista Código y la posibilidad de editar archivos sin crear un sitio de Dreamweaver. Dreamweaver también incluye compatibilidad actual para las tecnologías de servidor.

inspector de etiquetas mejorado muestra una lista de las propiedades disponibles para la

selección actual, y permite llevar a cabo ediciones rápidas y de gran amplitud. Para más información, consulte “Cambio de atributos con el inspector de etiquetas” en la página 456.

edición de archivo sin sitio permite trabajar directamente en un servidor FTP o RDS sin

crear un sitio de Dreamweaver. Para más información sobre cómo hacer que Dreamweaver funcione en un servidor, véase “Configuración de Dreamweaver para que funcione sin definir un

sitio” en la página 85. Para más información sobre la configuración de un sitio de Dreamweaver,

consulte “Configuración de un sitio de Dreamweaver nuevo” en la página 65. Los

comportamientos del servidor PHP permiten crear un juego de páginas maestra/detalle y

páginas de autenticación de usuarios. Para más información, consulte “Creación de páginas

maestra-detalle (PHP)” en la página 747 y “Creación de páginas que restrinjan el acceso al sitio (PHP)” en la página 766.

admisión mejorada para controles de formulario ASP.NET ofrece nuevas y mejoradas

maneras, entre las que se incluyen nuevos inspectores de propiedades, de crear y manipular formularios Web ASP.NET en la vista Diseño. Para más información, consulte Capítulo 42,

“Creación rápida de aplicaciones ASP y JSP”, en la página 729.

menú contextual de la vista de código permite aplicar rápidamente cambios de formato al

código seleccionado. Para más información, consulte “Cambios rápidos en una selección de

código” en la página 443.

Por dónde empezar

La documentación de Dreamweaver contiene información para usuarios de distintos niveles. Para sacarle el máximo provecho a la documentación, comience leyendo las partes que sean más relevantes para su nivel.

Para más información sobre los recursos de Dreamweaver, consulte “Guía de recursos de

formación de Dreamweaver” en la página 28.

Principiantes en el diseño Web

Si usted es un principiante en el diseño Web, esta sección le informará de las secciones de la documentación de Dreamweaver más adecuadas para su nivel.

Para principiantes en el diseño Web:

1 Comience por leer los tutoriales para la creación de un sitio estático en el apartado Primeros

pasos de la Ayuda.

2 En el apartado Utilización de Dreamweaver de la Ayuda (Ayuda > Utilización de

Dreamweaver), véase el Capítulo 1, “Exploración del espacio de trabajo”, en la página 33, el

Capítulo 2, “Configuración de un sitio de Dreamweaver”, en la página 63, Capítulo 4, “Administración de archivos”, en la página 81 y el Capítulo 3, “Cómo crear y abrir documentos”, en la página 73.

20 Introducción: Bienvenido a Dreamweaver

3 Para aprender sobre el diseño de las páginas, véase el Capítulo 9, “Diseño de páginas en el modo

de diseño”, en la página 189.

4 Para obtener información sobre la aplicación de formato al texto y la inserción de imágenes en

las páginas, véase el Capítulo 13, “Inserción y formato de texto”, en la página 281 y el

Capítulo 14, “Inserción de imágenes”, en la página 311.

5 Eso es todo lo que necesita para comenzar a crear sitios Web de gran calidad. Cuando esté

preparado para aprender a utilizar herramientas más avanzadas, podrá continuar con el resto de los capítulos sobre páginas estáticas en el apartado Utilización de Dreamweaver de la Ayuda. Es aconsejable que lea los capítulos de páginas dinámicas sólo cuando se haya familiarizado con la creación de páginas Web.

Diseñadores de sitios Web con experiencia

Si usted es un diseñador de sitios Web con experiencia, esta sección le informará de las secciones de la documentación de Dreamweaver más adecuadas para su nivel. Existen dos métodos distintos: uno para diseñadores sin experiencia en Dreamweaver y otro para diseñadores que están familiarizados con Dreamweaver pero que desean obtener más información sobre la creación de páginas dinámicas.

Para diseñadores de sitios Web con experiencia que empiezan a usar Dreamweaver:

1 Comience por leer los tutoriales para la creación de un sitio estático en el apartado Primeros

pasos de la Ayuda.

2 En el apartado Utilización de Dreamweaver de la Ayuda, consulte el Capítulo 1, “Exploración

del espacio de trabajo”, en la página 33 para más información sobre la interfaz de usuario de

Dreamweaver.

3 Aunque probablemente ya conoce una buena parte del material del Capítulo 2, “Configuración

de un sitio de Dreamweaver”, en la página 63 y el Capítulo 4, “Administración de archivos”, en la página 81, puede hojear estos capítulos para ver cómo se aplican en Dreamweaver estos

conceptos. Preste especial atención a las secciones que tratan sobre la configuración de un sitio de Dreamweaver.

4 Para información útil y detallada sobre el uso de Dreamweaver para crear páginas HTML

básicas, consulte el Capítulo 13, “Inserción y formato de texto”, en la página 281 y Capítulo 14,

“Inserción de imágenes”, en la página 311.

5 Para información sobre la codificación en Dreamweaver, véase “Configuración del entorno de

codificación” en la página 413, “Codificación en Dreamweaver” en la página 427, “Optimización y depuración del código” en la página 447 y “Edición de código en la vista Diseño” en la página 455.

6 Lea la introducción que aparece al comienzo de los demás capítulos del apartado Utilización de

Dreamweaver de la Ayuda para determinar si le interesan los temas que se abordan en ellos.

Para diseñadores de sitios Web con experiencia, familiarizados con Dreamweaver, que deseen obtener información sobre la creación de páginas dinámicas:

1 Comience leyendo “Aspectos básicos de las aplicaciones Web” y el “Tutorial: Desarrollo de una

aplicación Web” en el apartado Primeros pasos de la Ayuda.

2 En el apartado Utilización de Dreamweaver de la Ayuda, consulte el Capítulo 1, “Exploración

del espacio de trabajo”, en la página 33 para más información sobre la interfaz de usuario de

Dreamweaver y, a continuación, lea el apartado “Optimización del espacio de trabajo para

desarrollo visual” en la página 515.

3 Familiarícese con el flujo de trabajo de Dreamweaver en las páginas dinámicas leyendo “Flujo

de trabajo para el diseño de páginas dinámicas” en la página 525.

Por dónde empezar 21

4 Configure un servidor Web y un servidor de aplicaciones. (Véase Capítulo 23, “Configuración

de una aplicación Web”, en la página 467.)

5 Conecte con una base de datos. (Véase “Conexión con una base de datos” en la página 475.) 6 Lea la introducción que aparece al comienzo de cada uno de los capítulos del apartado

Utilización de Dreamweaver de la Ayuda para determinar si le interesan los temas que se abordan en ellos.

7 Si está interesado en la personalización manual de Dreamweaver, lea Personalización de

Dreamweaver en el Centro de soporte de Macromedia en www.macromedia.com/go/

customizing_dreamweaver_es. Si desea escribir extensiones para Dreamweaver, consulte el

apartado Ampliación de Dreamweaver de la Ayuda.

Usuarios con experiencia en codificación manual

Si usted es un usuario con experiencia en codificación manual, esta sección le informará de las secciones de la documentación de Dreamweaver más adecuadas para su nivel.

Para usuarios con experiencia en codificación manual:

1 Comience leyendo el “Tutorial: Edición del código” en el apartado Primeros pasos de la Ayuda. 2 En el apartado Utilización de Dreamweaver de la Ayuda, consulte el Capítulo 1, “Exploración

del espacio de trabajo”, en la página 33 para más información sobre la interfaz de usuario de

Dreamweaver.

3 Aunque probablemente ya conoce una buena parte del material del Capítulo 2, “Configuración

de un sitio de Dreamweaver”, en la página 63 y el Capítulo 4, “Administración de archivos”, en la página 81, puede hojear estos capítulos para ver cómo se aplican en Dreamweaver estos

conceptos. Preste especial atención a las secciones sobre la configuración de un sitio de Dreamweaver.

4 Encontrará más información sobre codificación con Dreamweaver en Capítulo 19,

“Configuración del entorno de codificación”, en la página 413, Capítulo 20, “Codificación en Dreamweaver”, en la página 427, Capítulo 21, “Optimización y depuración del código”, en la página 447 y Capítulo 22, “Edición de código en la vista Diseño”, en la página 455.

5 Lea la introducción que aparece al comienzo de cada uno de los capítulos del apartado

Utilización de Dreamweaver de la Ayuda para determinar si le interesan los temas que se abordan en ellos.

Diseñadores de aplicaciones Web

Si es un diseñador de aplicaciones Web con experiencia, esta sección le informará de las secciones de la documentación de Dreamweaver más adecuadas para su nivel. Hay dos métodos distintos, dependiendo de si ha usado Dreamweaver con anterioridad.

Para los diseñadores de aplicaciones Web que no hayan utilizado Dreamweaver:

1 Comience con una lectura rápida del apartado Primeros pasos de la Ayuda para familiarizarse

con los aspectos básicos del uso de Dreamweaver.

2 En el apartado Utilización de Dreamweaver de la Ayuda, consulte el Capítulo 1, “Exploración

del espacio de trabajo”, en la página 33 para más información sobre la interfaz de usuario de

Dreamweaver.

22 Introducción: Bienvenido a Dreamweaver

3 Aunque probablemente ya conoce una buena parte del material del Capítulo 2, “Configuración

de un sitio de Dreamweaver”, en la página 63 y el Capítulo 4, “Administración de archivos”, en la página 81, puede hojear estos capítulos para ver cómo se aplican en Dreamweaver estos

conceptos. Preste especial atención a las secciones sobre la configuración de un sitio de Dreamweaver.

4 Configure un servidor Web y un servidor de aplicaciones utilizando Dreamweaver. (Véase

Capítulo 23, “Configuración de una aplicación Web”, en la página 467.)

5 Conecte con una base de datos. (Véase “Conexión con una base de datos” en la página 475.) 6 Lea la introducción que aparece al comienzo de cada uno de los capítulos del apartado

Utilización de Dreamweaver de la Ayuda para determinar si le interesan los temas que se abordan en ellos.

Para diseñadores de aplicaciones Web con experiencia que hayan utilizado Dreamweaver:

1 Para empezar, consulte el “Novedades de Dreamweaver MX 2004” en la página 18. 2 En el apartado Utilización de Dreamweaver de la Ayuda, lea el Capítulo 1, “Exploración del

espacio de trabajo”, en la página 33 para más información sobre nuevos aspectos de la interfaz

de usuario de Dreamweaver.

3 Si está interesado en la personalización manual de Dreamweaver, lea “Personalización de

Dreamweaver” en el Centro de soporte de Macromedia en www.macromedia.com/go/

customizing_dreamweaver_es. Si desea escribir extensiones para Dreamweaver, consulte el

apartado Ampliación de Dreamweaver de la Ayuda.

Flujo de trabajo de Dreamweaver para la creación de sitios Web

Existen muchos métodos distintos para crear un sitio Web. El flujo de trabajo que se presenta en esta documentación comienza por la definición 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 continuación, debe diseñar el aspecto y el funcionamiento del sitio. Una vez que el diseño esté finalizado, debe crear el sitio y codificar las páginas, añadiendo el contenido y la interactividad; a continuación, vinculará las páginas y comprobará si el sitio funciona y si cumple los objetivos para los que ha sido diseñado. Además, si lo desea, puede incluir páginas dinámicas. Para terminar el ciclo, publicará el sitio en un servidor. Muchos ingenieros de desarrollo también programan operaciones de mantenimiento periódico para asegurarse de que el sitio continúa estando actualizado y operativo.

Planificación del sitio

Planificar y organizar cuidadosamente el sitio desde el primer momento puede ayudar a ahorrar tiempo más adelante. La organización del sitio no sólo implica la determinación de los archivos que van a incluirse, sino que también requiere un examen de las necesidades del sitio, el perfil de la audiencia y sus objetivos. Además, deben tenerse en cuenta requisitos técnicos 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 información 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 añadir, borrar y cambiar el nombre de los archivos y carpetas fácilmente con el fin de modificar la organización según resulte necesario. (Véase Capítulo 2,

“Configuración de un sitio de Dreamweaver”, en la página 63 y Capítulo 4, “Administración de archivos”, en la página 81.)

Flujo de trabajo de Dreamweaver para la creación de sitios Web 23

• Puede empezar por crear páginas simples que más adelante convertirá en diseños más

complejos. Cree páginas vacías nuevas o páginas basadas en diseños predefinidos. (Véase

Capítulo 3, “Cómo crear y abrir documentos”, en la página 73.)

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

• Configurar un sistema de forma que los miembros del equipo no puedan sobrescribir los

archivos. (Véase “Desprotección y protección de archivos” en la página 101.)

• Utilizar Design Notes para comunicarse con los miembros del equipo Web. (Véase

“Almacenamiento de información sobre archivos en Design Notes” en la página 111.)

Administración de los archivos del sitio

Los paneles Archivos y Activos de Dreamweaver facilitan la administración de los archivos del sitio.

• En el panel Archivos de Dreamweaver encontrará numerosas herramientas que le ayudarán a

administrar el sitio, transferir archivos desde y hacia un servidor remoto, configurar un proceso de desprotección/protección que evite que se sobrescriban archivos y sincronizar los archivos de los sitios local y remoto. (Véase “Administración de archivos” en la página 81.)

• El panel Activos permite organizar fácilmente los activos de un sitio. A continuación, se

pueden arrastrar directamente desde el panel Activos hasta un documento de Dreamweaver. (Véase Capítulo 5, “Administración de activos y bibliotecas”, en la página 119.)

• Puede utilizar Dreamweaver para administrar diversos aspectos de sus sitios de Contribute.

(Véase Capítulo 6, “Administración de sitios de Contribute con Dreamweaver”, en la página

137.)

Diseño de las páginas Web

Dreamweaver le ofrece flexibilidad para crear páginas de muestra y trabajar en el diseño definitivo de sus páginas. Elija el diseño más apropiado, o combine las opciones de diseño de Dreamweaver para definir el aspecto de su sitio.

• Puede utilizar capas o estilos de posición CSS de Dreamweaver para crear su diseño. (Véase

Capítulo 7, “Diseño de páginas con CSS”, en la página 151.)

• Las herramientas de tabla y el modo de diseño de Dreamweaver permiten diseñar rápidamente

páginas Web y, posteriormente, reorganizar la estructura de las páginas. (Véase Capítulo 8,

“Presentación de contenido en tablas”, en la página 169 y Capítulo 9, “Diseño de páginas en el modo de diseño”, en la página 189.)

• Para mostrar varios documentos de forma simultánea en un navegador, pueden utilizarse

marcos para su organización. (Véase Capítulo 10, “Utilización de marcos”, en la página 205.)

• Las plantillas de Dreamweaver le permiten aplicar fácilmente contenidos y diseños de página

reutilizables a su sitio. Puede crear páginas nuevas basadas en una plantilla de Dreamweaver y actualizar su diseño de forma automática cuando cambie la plantilla. (Véase Capítulo 11,

“Administración de plantillas”, en la página 221.)

24 Introducción: Bienvenido a Dreamweaver

Adición de contenido a las páginas

Mediante Dreamweaver, podrá añadir fácilmente a las páginas Web una gran variedad de contenidos. Añada activos y elementos de diseño, como texto, imágenes, colores, películas, sonido y otros elementos multimedia.

• Las funciones de creación de páginas de Dreamweaver le permiten especificar propiedades de

la página Web tales como títulos de página o imagen y color de fondo. Además, Dreamweaver le proporciona herramientas para optimizar el rendimiento de su sitio Web y probar las páginas para asegurar la compatibilidad con distintos navegadores Web. (Véase Capítulo 12,

“Utilización de páginas”, en la página 259.)

• 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. También puede crear fácilmente sus propias CSS (Hojas de estilos en cascada, Cascading Style Sheets). (Véase Capítulo 13, “Inserción y formato de texto”, en la página 281.)

• Inserte imágenes, incluidas imágenes de sustitución, mapas de imágenes e imágenes por capas

de Fireworks y utilice las herramientas de alineación para situar las imágenes en la página. También puede cambiar el tamaño de las imágenes directamente en Dreamweaver. (Véase

Capítulo 14, “Inserción de imágenes”, en la página 311 y Capítulo 16, “Utilización con otras aplicaciones”, en la página 351.)

• Con Dreamweaver puede crear vínculos HTML estándar, incluidos vínculos de anclaje y

vínculos de correo electrónico, o establecer sistemas de navegación gráfica, como los menús de salto y las barras de navegación. (Véase Capítulo 15, “Establecimiento de vínculos y

navegación”, en la página 325.)

• Inserte cualquier otro tipo de elementos multimedia en una página Web, como películas Flash,

Shockwave y QuickTime, sonido y applets. (Véase Capítulo 17, “Adición de audio, vídeo y

elementos interactivos”, en la página 365.)

• Los comportamientos permiten realizar tareas en respuesta a eventos específicos como, por

ejemplo, resaltar un botón cuando el puntero pasa por encima de él, validar un formulario cuando el usuario hace clic en el botón Enviar o abrir una segunda ventana del navegador cuando la página principal ha terminado de cargarse. (Véase Capítulo 18, “Utilización de

comportamientos JavaScript”, en la página 381.)

Codificación manual

La codificación manual de páginas Web es otro método para crear las páginas. Dreamweaver ofrece sencillas herramientas de edición visual, pero también ofrece un entorno de codificación más sofisticado. Puede utilizar el método que prefiera, o una combinación de ambos, para crear y editar sus páginas.

• Puede trabajar en un entorno de codificación sin herramientas visuales; las herramientas de

codificación le permiten crear y editar código, asignarle un formato y comprobar que se ajusta a determinadas normas. (Véase Capítulo 19, “Configuración del entorno de codificación”, en

la página 413, Capítulo 20, “Codificación en Dreamweaver”, en la página 427 y Capítulo 21, “Optimización y depuración del código”, en la página 447.)

• También puede utilizar algunas herramientas de codificación de Dreamweaver en la vista

Diseño, el entorno de diseño visual. (Véase Capítulo 22, “Edición de código en la vista

Diseño”, en la página 455.)

Flujo de trabajo de Dreamweaver para la creación de sitios Web 25

Configuración de una aplicación Web

Muchos sitios Web contienen páginas dinámicas que permiten a los visitantes ver información almacenada en bases de datos, y normalmente algunos de ellos pueden añadir nueva información y editar información de estas bases de datos. Para crear este tipo de páginas, primero debe realizar una serie de pasos preliminares.

• Configure un servidor Web y un servidor de aplicaciones y, a continuación, cree o modifique

un sitio de Dreamweaver. (Véase Capítulo 23, “Configuración de una aplicación Web”, en

la página 467.)

• Conecte con una base de datos. (Véase “Conexión con una base de datos” en la página 475).

Creación de páginas dinámicas

En Dreamweaver se pueden definir diversas fuentes de contenido dinámico, incluidos juegos de registros extraídos de bases de datos, parámetros de formularios y componentes JavaBeans. Para añadir el contenido dinámico a una página, basta con arrastrarlo a ella.

Puede definirse que los registros de la página aparezcan de uno en uno o en grupos, mostrar varias páginas de registros, añadir vínculos especiales para pasar de una página 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 creación de aplicaciones Web en Dreamweaver, aprenda cómo

utilizar Dreamweaver para crear páginas dinámicas. (Véase Capítulo 30, “Optimización del

espacio de trabajo para desarrollo visual”, en la página 515 y Capítulo 31, “Flujo de trabajo para el diseño de páginas dinámicas”, en la página 525.)

• Defina y muestre el contenido dinámico de sus páginas. (Véase Capítulo 32, “Obtención de

datos para la página”, en la página 533, Capítulo 33, “Definición de fuentes de contenido dinámico”, en la página 545, Capítulo 34, “Adición de contenido dinámico a páginas Web”, en la página 565 y Capítulo 35, “Visualización de registros de la base de datos”, en la página 575.)

• Puede incorporar la lógica de aplicaciones o empresarial mediante tecnologías innovadoras,

como los componentes ColdFusion de Macromedia y los servicios Web. (Véase Capítulo 36,

“Utilización de componentes de ColdFusion”, en la página 595 y Capítulo 37, “Utilización de servicios Web (sólo Windows)”, en la página 601.)

• Si necesita más flexibilidad, puede crear sus propios comportamientos de servidor y

formularios interactivos. (Véase Capítulo 38, “Adición de comportamientos de servidor

personalizados”, en la página 611 y Capítulo 39, “Creación de formularios”, en la página 631.)

Desarrollo rápido de aplicaciones

Dreamweaver ofrece algunas herramientas de desarrollo rápido de aplicaciones (RAD), como comportamientos de servidor y objetos de aplicaciones, que permiten crear sofisticadas aplicaciones Web sin necesidad de escribir el código del lado del servidor.

• Cree con rapidez páginas que realicen búsquedas y modifiquen bases de datos, y muestren los

resultados. Proporcione seguridad mediante la limitación del acceso a las páginas. (Véase

“Creación rápida de aplicaciones de ColdFusion” en la página 653, “Creación rápida de aplicaciones ASP.NET” en la página 699, “Creación rápida de aplicaciones ASP y JSP” en la página 729 y “Creación rápida de aplicaciones PHP” en la página 747.)

26 Introducción: Bienvenido a Dreamweaver

Utilización de Dreamweaver con otras aplicaciones

Dreamweaver facilita el proceso de diseño y desarrollo de páginas Web al permitirle trabajar con otras aplicaciones. Para información sobre cómo trabajar con otras aplicaciones, como los navegadores, los editores HTML, los editores de imágenes y las herramientas de animación, véanse los temas siguientes:

• Para información sobre el uso de Dreamweaver con otros editores HTML, como HomeSite o

BBEdit, véase “Utilización de un editor de HTML externo con Dreamweaver” en

la página 424.

• Puede especificar sus navegadores preferidos para previsualizar el sitio. (Véase “Vista previa y

comprobación de páginas en los navegadores” en la página 277.)

• Puede iniciar un editor de imágenes externo, como Macromedia Fireworks o Adobe

Photoshop, desde Dreamweaver. (Véase “Utilización de un editor de imágenes externo” en

la página 322.)

• Puede configurar Dreamweaver para que inicie un editor distinto para cada tipo de archivo.

(Véase “Inicio de un editor externo de archivos multimedia” en la página 369.)

• Para más información sobre cómo añadir interactividad al sitio mediante películas Macromedia

Flash, véase “Inserción y modificación de un objeto de botón Flash” en la página 371,

“Inserción de un objeto de texto Flash” en la página 373 o “Descarga e instalación de elementos Flash” en la página 374.

• Para aprender a añadir animación al sitio mediante películas Macromedia Shockwave, véase

“Inserción de películas Shockwave” en la página 376.

• Para información sobre el uso de ColdFusion, véase la ayuda de ColdFusion en Dreamweaver

(Ayuda > Utilización de ColdFusion).

Dreamweaver y accesibilidad

La 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 gráficos, los accesos directos del teclado y el uso de colores de pantalla con alto contraste, entre otros.

Nota: para más información 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 Sección 508 de la Ley federal de inserción (Federal Rehabilitation Act) (www.section508.gov).

Dreamweaver contiene herramientas que dotan al producto de accesibilidad y herramientas que le ayudan a crear contenido accesible:

Utilización de las funciones de accesibilidad de Dreamweaver Para diseñadores Web

usuarios de Dreamweaver que necesiten utilizar funciones de accesibilidad, Dreamweaver ofrece lectores de pantalla, navegación mediante el teclado y funciones de accesibilidad del sistema operativo.

Para más información, consulte el “Utilización de las funciones de accesibilidad de Dreamweaver”

en la página 52.

Creación de sitios Web accesibles Para diseñadores Web usuarios de Dreamweaver que

necesiten crear contenido accesible, Dreamweaver ayuda a crear páginas accesibles que incluyen contenido útil para lectores de pantalla y que cumplen las directrices gubernamentales.

Dreamweaver y accesibilidad 27

Dreamweaver proporciona cuadros de diálogo que le permiten introducir atributos de accesibilidad al insertar elementos de página (véase “Optimización del espacio de trabajo para el

diseño de páginas accesibles” en la página 56). Por ejemplo, el cuadro de diálogo para la

accesibilidad de imágenes le recuerda que añada texto equivalente para los gráficos. De esta forma, cuando la imagen aparezca en una página para un usuario con discapacidades visuales, el lector de pantalla leerá la descripción de la imagen.

Dreamweaver también incluye páginas Web de muestra pensadas con fines de accesibilidad (véase

“Creación de un documento basado en un archivo de diseño de Dreamweaver” en la página 74) y

un informe de accesibilidad que puede ejecutar para probar si sus páginas o sitios siguen las directrices de accesibilidad de la Sección 508 (véase “Comprobación del sitio” en la página 115).

Nota: recuerde que ninguna herramienta de creación puede automatizar el proceso de desarrollo. Para diseñar sitios Web accesibles deberá comprender cuáles son los requisitos de accesibilidad y tomar numerosas decisiones subjetivas sobre cómo los usuarios con discapacidades interactúan con las páginas Web. La mejor forma de garantizar que un sitio Web sea accesible consiste en realizar una planificación, un desarrollo, una comprobación y una evaluación deliberadas.

Función de validación de la accesibilidad de Dreamweaver

La función de validación de la accesibilidad de Dreamweaver MX utiliza tecnología de UsableNet. UsableNet es una empresa líder en el desarrollo de software fácil de utilizar para automatizar la comprobación y la reparación de problemas de usabilidad y accesibilidad. Para obtener más ayuda con la comprobación de la accesibilidad, pruebe LIFT for Macromedia Dreamweaver de UsableNet, una solución completa para desarrollar sitios Web utilizables y accesibles. Lift for Macromedia Dreamweaver de UsableNet incluye asistentes para tablas, formularios e imágenes complejas, un editor de ALT global, informes personalizables y un nuevo modo de supervisión activo que asegura la accesibilidad al contenido a medida que se escriben las páginas. Solicite una versión de demostración de Lift for Macromedia Dreamweaver en www.usablenet.com

Guía de recursos de formación de Dreamweaver

Dreamweaver incluye diversos recursos para ayudarle a aprender rápidamente el funcionamiento del programa y a dominar la creación de sitios y páginas Web:

• “Sistemas de ayuda de Dreamweaver” en la página 28

• “Recursos del sitio Web de Macromedia” en la página 29

• “Manuales y formación adicionales” en la página 29

Para sacar el máximo provecho de los recursos de Dreamweaver, véase “Por dónde empezar” en

la página 20.

Nota: para obtener una lista de recursos HTML y Web, véase “Recursos tecnológicos HTML y

Web” en la página 30.

Sistemas de ayuda de Dreamweaver

Para acceder a los sistemas de ayuda de Dreamweaver, utilice el menú Ayuda. La Ayuda de Dreamweaver aparece en el visor de la ayuda de su sistema operativo: Microsoft HTML Help (Windows) o Apple Help (Macintosh).

La ayuda de Dreamweaver incluye los siguientes sistemas de ayuda:

28 Introducción: Bienvenido a Dreamweaver

El apartado Primeros pasos de la Ayuda se ha diseñado para conducirle por el proceso de creación de un sitio Web sencillo, pero funcional, utilizando Dreamweaver. Va dirigido a usuarios que han creado páginas Web pero no están familiarizados con determinados aspectos de Dreamweaver. Contiene tutoriales sobre la creación y edición de páginas estáticas sencillas, edición manual de código y creación de aplicaciones Web dinámicas. Esta guía se proporciona como un manual impreso, como parte del sistema de ayuda y como un archivo PDF.

El apartado

Utilización de Dreamweaver de la Ayuda proporciona información completa sobre

todas las funciones de Dreamweaver, optimizada para su uso en línea. El apartado

Ampliación de Dreamweaver de la Ayuda ofrece información sobre el modelo de

objeto de documento de Dreamweaver. El apartado

Referencia API de Dreamweaver de la Ayuda ofrece información sobre las API

(interfaces de programación de aplicación) que permiten que los desarrolladores de JavaScript y C creen extensiones para Dreamweaver.

Temas relacionados

• “Manuales y formación adicionales” en la página 29

Recursos del sitio Web de Macromedia

El sitio Web de Macromedia contiene los siguientes recursos como ayuda a los usuarios de Dreamweaver:

El sitio Web del Dreamweaver. El sitio Web del Centro de soporte de Dreamweaver en www.macromedia.com/go/

dreamweaver_support_es/ se actualiza de forma periódica con la información más reciente sobre

Dreamweaver, así como con sugerencias de usuarios expertos, ejemplos, consejos, actualizaciones e información sobre temas avanzados. Visite este sitio Web con frecuencia para conocer las últimas noticias sobre Dreamweaver y aprender a sacar el máximo provecho del programa.

Centro de desarrolladores de Macromedia en www.macromedia.com/go/developer_es/

proporciona herramientas y tutoriales, entre otras cosas, para todos los productos Macromedia. Los foros en línea de Dreamweaver le permiten intercambiar ideas sobre aspectos técnicos y

compartir consejos útiles con otros usuarios de Dreamweaver. Si desea información sobre cómo acceder a los foros consulte el sitio Web de Macromedia en www.macromedia.com/go/

dreamweaver_newsgroup.

Encontrará predeterminada de Dreamweaver en el sitio Web de Macromedia en www.macromedia.com/go/

dreamweaver_mx_shortcuts.

Centro de soporte de Dreamweaver le ayuda a sacar el máximo partido de

gráficos que describen los métodos abreviados de teclado en la configuración

Temas relacionados

• “Sistemas de ayuda de Dreamweaver” en la página 28

Manuales y formación adicionales

Puede utilizar manuales y formación adicionales para mejorar su dominio de Dreamweaver; también puede encontrar documentación de Dreamweaver en formato PDF e impreso en línea:

Guía de recursos de formación de Dreamweaver 29

Los manuales de Macromedia Press permiten mejorar sus conocimientos de Dreamweaver. Consulte los últimos manuales escritos por expertos en el sitio Web de Macromedia en

www.macromedia.com/go/dw2004_help_mmp.

Formación y certificación de Macromedia Dreamweaver contiene ejercicios prácticos y

situaciones del mundo real. Elija entre formación con profesor o en línea, o combine ambas posibilidades para crear la ruta de aprendizaje que le resulte más eficaz. Aprenda más en el sitio

Web de Macromedia en www.macromedia.com/go/dreamweaver_training_es.

Los

PDF de Dreamweaver, disponibles en el CD del producto, constituyen un juego completo

de documentación de Dreamweaver. Algunos temas de referencia no se incluyen en la versión PDF de Utilización de Dreamweaver; para más información sobre ellos, consulte el apartado Utilización de Dreamweaver de la Ayuda.

Los

manuales de Dreamweaver, que no se proporcionan con el producto, están disponibles para

su compra en línea. Para adquirir copias impresas de la documentación de Dreamweaver, véase el

sitio Web de Macromedia en www.macromedia.com/go/books_and_training/.

Temas relacionados

• “Sistemas de ayuda de Dreamweaver” en la página 28

• “Recursos del sitio Web de Macromedia” en la página 29

Convenciones tipográficas

En esta guía se utilizan las convenciones tipográficas siguientes:

• Los elementos de los menús se muestran en este formato: nombre del menú > nombre del

elemento del menú. Los elementos de los submenús se muestran en este formato: nombre del menú > nombre del submenú > nombre del elemento del menú.

• La fuente de código indica nombres de etiquetas y atributos HTML, así como el texto literal

empleado en los ejemplos.

• La fuente de código en cursiva indica elementos reemplazables (también denominados

metasímbolos) en el código.

• El texto Roman en negrita permite distinguir el texto que debe introducirse literalmente.

Para una lista completa de recursos de Dreamweaver, véase “Guía de recursos de formación de

Dreamweaver” en la página 28.

Recursos tecnológicos HTML y Web

A continuación se indican algunos recursos útiles disponibles en la Web:

Nota: para obtener una lista de recursos de Dreamweaver, véase “Guía de recursos de formación de

Dreamweaver” en la página 28.

La especificación de hojas de estilos en cascada de nivel 1 (CSS1)

CSS1) y

la especificación de nivel 2 (CSS2) (www.w3.org/TR/REC-CSS2/) son las

especificaciones oficiales para hojas de estilos del World Wide Web Consortium.

La especificación HTML 4.01 (www.w3.org/TR/REC-html40/) es la especificación oficial 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.

30 Introducción: Bienvenido a Dreamweaver

(www.w3.org/TR/REC-

+ 784 hidden pages