MANUAL DE ADOBE DREAMWEAVER CS3
Contenido
Capítulo 1: Introducción
Instalación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Ayuda de Adobe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . 1
Recursos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Novedades . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .10
Capítulo 2: Espacio de trabajo
Flujo de trabajo y espacio de trabajo de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .12
Utilización de la ventana de documento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .23
Utilización de barras de herramientas, menús contextuales y paneles . . . . . . . . . . . . . . . . . . . . . .26
Personalización del espacio de trabajo de Dreamweaver CS3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .32
Capítulo 3: Utilización de los sitios de Dreamweaver
Configuración de un sitio de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .37
Utilización de un mapa visual del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .48
Administración de sitios de Contribute con Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ..52
Utilización de archivos sin definir ningún sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ..58
Opciones de la ficha Básicas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .60
Capítulo 4: Creación y administración de archivos
Cómo crear y abrir documentos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .64
Administración de archivos y carpetas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .73
Obtención y colocación de archivos en el servidor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. .82
Desprotección y protección de archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .86
Sincronización de archivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .89
Comparación de archivos para detectar diferencias . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .90
Recuperación de versiones anteriores de archivos (usuarios de Contribute) . . . . . . . . . . . . . . . .93
Cómo ocultar carpetas y archivos en el sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .94
Almacenamiento de información sobre archivos en Design Notes . . . . . . . . . . . . . . . . . . . . . . . . . .96
Comprobación del sitio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . .99
Capítulo 5: Administración de activos y bibliotecas
Activos y bibliotecas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .103
Utilización de activos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .104
Creación y administración de una lista de activos favoritos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .108
Utilización de los elementos de biblioteca . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .110
Capítulo 6: Creación de páginas con CSS
Aspectos básicos de las hojas de estilos en cascada . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ..114
Creación y administración de CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .118
Diseño de páginas con CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .137
Utilización de etiquetas div . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .152
Animación de elementos PA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .156
Capítulo 7: Maquetación de páginas con HTML
Utilización de ayudas visuales al diseñar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .163
Presentación de contenido en tablas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .166
iv
Diseño de páginas en el modo de diseño . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .180
Utilización de marcos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .190
Capítulo 8: Adición de contenido a las páginas
Utilización de páginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .203
Adición y aplicación de formato al texto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .215
Adición y modificación de imágenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .230
Inserción de contenido de Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .242
Adición de contenido de Flash Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .251
Adición de sonido . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. .254
Adición de otros objetos multimedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .256
Capítulo 9: Establecimiento de vínculos y navegación
Acerca del establecimiento de vínculos y la navegación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .264
Vinculación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .266
Menús de salto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . .274
Barras de navegación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .276
Mapas de imágenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .277
Solución de problemas de vínculos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .279
Capítulo 10: Obtención de vista previa de páginas
Obtención de vista previa de páginas en navegadores . . . . . . . . . . . . . . . . . . . . . . . . . . . .282
Obtención de vista previa de páginas en dispositivos móviles . . . . . . . . . . . . . . . . . . . . .284
Capítulo 11: Utilización del código de las páginas
Codificación en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .285
Configuración del entorno de codificación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .291
Personalización del entorno de codificación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .292
Escritura y edición de código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . . . . . .297
Contracción del código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . . . . . . . .307
Optimización y depuración del código . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . . .309
Edición de código en la vista Diseño . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .313
Utilización del contenido de Head para páginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .319
Utilización de server-side includes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . . . . .322
Administración de bibliotecas de etiquetas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .324
Importación de etiquetas personalizadas a Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . .327
Capítulo 12: Cómo añadir comportamientos JavaScript
Utilización de comportamientos JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .329
Aplicación de comportamientos incorporados en Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . .332
Capítulo 13: Utilización con otras aplicaciones
Integración con otras aplicaciones . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .347
Utilización de Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .348
Utilización con Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .354
Utilización de Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .361
Utilización con Bridge . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .362
Utilización de Device Central . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .364
Capítulo 14: Creación y administración de plantillas
Plantillas de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .366
Reconocimiento de plantillas y documentos basados en plantillas . . . . . . . . . . . . . . . . . . . . . . . .370
v
Creación de una plantilla de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .373
Creación de regiones editables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .376
Creación de regiones repetidas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .377
Utilización de regiones opcionales . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .379
Definición de atributos de etiqueta editables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381
Creación de una plantilla anidada . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . .383
Edición, actualización y eliminación de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .385
Exportación e importación de contenido de plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . . .388
Aplicación o eliminación de una plantilla de un documento existente . . . . . . . . . . . . . . . . . . . . .389
Edición de contenido de un documento basado en plantilla . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .391
Sintaxis de plantilla . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .393
Configuración de preferencias de edición para plantillas . . . . . . . . . . . . . . . . . . . . . . . . . . . .394
Capítulo 15: Visualización de datos XML
Acerca de XML y XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . . . .396
Realización de transformaciones XSL en el servidor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .403
Realización de transformaciones XSL en el cliente . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .419
Entidades de caracteres no presentes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .. . . . . . . .421
Capítulo 16: Creación visual de páginas de Spry
Acerca del framework de Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .423
Adición de widgets de Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .423
Utilización del widget de acordeón . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .425
Utilización del widget de barra de menús . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .427
Utilización del widget de panel que puede contraerse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .432
Utilización del widget de paneles en fichas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .434
Utilización del widget de campo de texto de validación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .436
Utilización del widget de área de texto de validación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .441
Utilización del widget de selección de validación . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .444
Utilización del widget de casilla de verificación de validación . . . . . . . . . . . . . . . . . . . . . . . . . . . . .447
Visualización de datos con Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .450
Adición de efectos de Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .457
Capítulo 17: Preparación para crear sitios dinámicos
Aspectos básicos de las aplicaciones Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .461
Instalación de un servidor Web local . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .468
Configuración de una aplicación Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .471
Conexiones de base de datos para desarrolladores de ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . .477
Conexiones de base de datos para desarrolladores de ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .479
Conexiones de base de datos para desarrolladores de PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .485
Conexiones de base de datos para desarrolladores de ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . .487
Conexiones de base de datos para desarrolladores de JSP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .489
Solución de problemas de conexiones de base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .493
Eliminación de scripts de conexión . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .498
Capítulo 18: Fuentes de datos para aplicaciones Web
Utilización de una base de datos para almacenar contenido . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .499
Recopilación de los datos enviados por los usuarios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .500
Acceso a datos almacenados en variables de sesión . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .503
vi
Capítulo 19: Creación de páginas dinámicas
Optimización del espacio de trabajo para desarrollo visual . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .506
Diseño de páginas dinámicas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .509
Introducción a las fuentes de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .510
Paneles de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .513
Definición de fuentes de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .515
Adición de contenido dinámico a las páginas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .530
Cambio de contenido dinámico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .534
Visualización de registros de la base de datos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .536
Visualización de Live Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .545
Utilización de servicios Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .549
Adición de comportamientos de servidor personalizados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .554
Creación de formularios . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .565
Capítulo 20: Creación visual de aplicaciones
Creación de páginas maestra y detalle (todos los servidores) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .578
Creación de páginas de búsqueda y resultados (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . .587
Creación de una página de búsqueda en la base de datos (ASP.NET) . . . . . . . . . . . . . . . . . . . . . .592
Creación de una página de inserción de registro (todos los servidores) . . . . . . . . . . . . . . . . . . . .596
Creación de páginas para actualizar un registro (todos los servidores) . . . . . . . . . . . . . . . . . . . . .600
Creación de páginas para eliminar un registro (todos los servidores) . . . . . . . . . . . . . . . . . . . . . .605
Creación de páginas con objetos de manipulación avanzados (ColdFusion, ASP,
ASP.NET, JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .613
Creación de una página de registro (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . .620
Creación de una página de conexión (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . .622
Creación de una página para acceso de usuarios autorizados (ColdFusion, ASP, JSP, PHP) . . .624
Protección de una carpeta de su aplicación (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .627
Utilización de componentes de ColdFusion (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .627
Utilización de JavaBeans (JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .633
Capítulo 21: Creación de formularios ASP.NET y ColdFusion
Creación de formularios ColdFusion MX 7 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .635
Creación de formularios ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .646
Creación de controles Web Cuadrícula de datos y Lista de datos de ASP.NET . . . . . . . . . . . . . . .651
Capítulo 22: Automatización de tareas
Automatización de tareas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .658
Capítulo 23: Accesibilidad
Dreamweaver y accesibilidad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .663
Funciones de accesibilidad de Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .664
Diseño de páginas accesibles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .666
Capítulo 24: Métodos abreviados y extensiones
Métodos abreviados de teclado . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .667
Extensiones . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .669
Índice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .670
1
Capítulo 1: Introducción
Si no ha instalado el nuevo software, comience leyendo la información relativa a la instalación y otros aspectos preliminares.
Antes de comenzar a utilizar el software, dedique unos instantes a leer la introducción a la Ayuda de Adobe y a los
numerosos recursos disponibles para los usuarios. Dispone de acceso a vídeos formativos, plug-ins, plantillas, comunidades
de usuarios, seminarios, tutoriales y agregadores RSS, entre otros muchos recursos.
Instalación
Requisitos
❖ Para consultar los requisitos completos del sistema y las recomendaciones para el software de Adobe®, consulte el archivo
Read Me del disco de la instalación.
Instalar el software
1 Cierre todas las aplicaciones Adobe que estén abiertas en su equipo.
2 Inserte el disco de instalación en la unidad de disco y siga las instrucciones de la pantalla.
Nota: para obtener más información, consulte el archivo Read Me en el disco de la instalación.
Activar el software
Si tiene una licencia de un solo usuario para el software de Adobe, se le pedirá que active el software; éste es un proceso
sencillo y anónimo que debe completar en un plazo de 30 días desde el inicio del software.
Para obtener más información acerca de la activación del producto, consulte el archivo Léame del disco de instalación o
visite el sitio Web de Adobe en http://www.adobe.com/go/products/activation_es.
1 Si el cuadro de diálogo Activación aún no está abierto, elija Ayuda > Activar.
2 Siga las instrucciones que aparecen en pantalla.
Nota: si desea instalar el software en otro equipo, primero debe desactivarlo en el equipo inicial. Elija Ayuda > Desactivar.
Registrarse
Registre su producto para recibir soporte adicional para la instalación, notificaciones de actualizaciones y otros servicios.
❖ Para registrarse, siga las instrucciones en pantalla del cuadro de diálogo Registro que aparece tras instalar y activar el
software.
Si decide aplazar el registro, puede registrarse en cualquier momento seleccionando Ayuda > Registro.
Ayuda de Adobe
Recursos de la ayuda de Adobe
La documentación del software de Adobe está disponible en varios formatos.
Ayuda del producto y LiveDocs
La Ayuda del producto proporciona acceso a toda la documentación y a las instrucciones disponibles cuando se adquirió
el software. También está disponible en el menú Ayuda del software de Adobe.
DREAMWEAVER CS3
Guía del usuario
2
La Ayuda de LiveDocs incluye todo el contenido de la Ayuda del producto además de actualizaciones y Enlaces a
instrucciones adicionales en Internet. Para algunos productos, también añadir comentarios a los temas en la Ayuda de
LiveDocs. Busque la Ayuda de LiveDocs de su producto en el Centro de recursos de ayuda de Adobe en la dirección
www.adobe.com/go/documentation_es.
La mayoría de las versiones de la Ayuda del producto y de LiveDocs permite buscar en los sistemas de ayuda de varios
productos. Los temas también pueden incluir Enlaces a contenido importante en Internet o a temas de la Ayuda de otro
producto.
Considere la ayuda, tanto la incluida en el producto como la que está disponible en Internet, un lugar centralizado desde el
que acceder a contenido adicional y las comunidades de usuarios. La versión más completa y actualizada de la Ayuda
siempre se encuentra en Internet.
Documentación de Adobe PDF
La Ayuda del producto está disponible también en formato PDF para que pueda imprimirla fácilmente.Otros documentos,
como las guías de instalación y los informes técnicos, también se proporcionan en formato PDF.
Toda la documentación en PDF está disponible en el Centro de recursos de ayuda de Adobe en
www.adobe.com/go/documentation_es. Para ver la documentación PDF incluida con el software, busque en la carpeta
Documentos en el DVD de instalación o de contenido.
Documentación impresa
Se pueden adquirir las ediciones impresas de la Ayuda del producto en la tienda de Adobe, en la dirección
www.adobe.com/go/store_es. En la tienda de Adobe encontrará también libros publicados por los socios editores de
Adobe.
Con todos los productos de Adobe Creative Suite® 3 se incluye una guía de flujo de trabajo impresa y los productos de
Adobe independientes pueden incluir una guía de introducción impresa.
Usar la Ayuda del producto
La Ayuda del producto está disponible a través delmenú Ayuda. Después de iniciar el visor de la Ayuda de Adobe, haga clic
en Examinar para ver la Ayuda de otros productos de Adobe instalados en su equipo.
Estas funciones de la Ayuda facilitan el aprendizaje entre productos:
• Los temas pueden contener Enlaces a sistemas de Ayuda de otros productos de Adobe o a contenido adicional en
Internet.
DREAMWEAVER CS3
Guía del usuario
3
• Algunos temas se comparten entre dos o más productos. Por ejemplo, si ve un tema de ayuda con un icono de Adobe
Photoshop® CS3 y un icono de Adobe After Effects® CS3, sabrá que el tema describe funciones que son similares en los
dos productos o describe flujos de trabajo entre productos.
• Puede buscar en los sistemas de Ayuda de varios productos.
Si busca una frase, como “herramienta para formas”, incluya la frase entre comillas para ver sólo los temas que contienen
todas las palabras de la frase.
Ayuda de Adobe
A. Botones Atrás/Adelante (Enlaces visitados anteriormente) B. Subtemas expandibles C. Iconos que indican un tema común D. Botones
Anterior/Siguiente (temas en orden secuencial)
Funciones de accesibilidad
El contenido de la Ayuda de Adobe está accesible a personas discapacitadas (por ejemplo, con problemas de movilidad,
ceguera o dificultades de visión). La Ayuda del producto admite funciones de accesibilidad estándar:
• El usuario puede cambiar el tamaño del texto con comandos de menú contextual estándar.
• Los Enlaces están subrayados para puedan reconocerse más fácilmente.
• Si el texto del vínculo no concuerda con el título del destino, se hace referencia al título en el atributo Título de la etiqueta
de anclaje. Por ejemplo, los Enlaces Anterior y Siguiente incluyen los títulos de los temas anterior y siguiente.
• El contenido admite el modo de alto contraste.
• Los gráficos sin rótulos incluyen texto alternativo.
• Cada marco tiene un título que indica su finalidad.
• Las etiquetas HTML estándar definen la estructura de contenido para herramientas de lectura de pantalla o de
conversión de texto a voz.
• Las hojas de estilos controlan el formato, de modo que no hay fuentes incrustadas.
Métodos abreviados
Ayuda de Adobe
A. Botones Atrás/Adelante (Enlaces visitados anteriormente) B. Subtemas expandibles C. Iconos que indican un tema común D. Botones
Anterior/Siguiente (temas en orden secuencial)
Funciones de accesibilidad
El contenido de la Ayuda de Adobe está accesible a personas discapacitadas (por ejemplo, con problemas de movilidad,
ceguera o dificultades de visión). La Ayuda del producto admite funciones de accesibilidad estándar:
• El usuario puede cambiar el tamaño del texto con comandos de menú contextual estándar.
• Los Enlaces están subrayados para puedan reconocerse más fácilmente.
• Si el texto del vínculo no concuerda con el título del destino, se hace referencia al título en el atributo Título de la etiqueta
de anclaje. Por ejemplo, los Enlaces Anterior y Siguiente incluyen los títulos de los temas anterior y siguiente.
• El contenido admite el modo de alto contraste.
• Los gráficos sin rótulos incluyen texto alternativo.
• Cada marco tiene un título que indica su finalidad.
• Las etiquetas HTML estándar definen la estructura de contenido para herramientas de lectura de pantalla o de
conversión de texto a voz.
• Las hojas de estilos controlan el formato, de modo que no hay fuentes incrustadas.
Métodos abreviados de teclado para los controles de las barras de herramientas de la Ayuda (Windows)
Botón Atrás Alt + Flecha izquierda
Botón Adelante Alt + Flecha derecha
Imprimir Ctrl+P
Botón Acerca de Ctrl+I
C
D
B
A
DREAMWEAVER CS3
Guía del usuario
4
Menú Examinar Alt+flecha abajo o Alt+flecha arriba para ver la Ayuda de otra aplicación
Cuadro Buscar Ctrl+S para colocar el punto de inserción en el cuadro Buscar
Métodos abreviados de teclado para navegación por la Ayuda (Windows)
• Para desplazarse por los paneles, pulse Ctrl+Tab (hacia delante) y Mayús+Ctrl+Tab (hacia atrás).
• Para desplazarse por los Enlaces de un panel y resaltarlos, pulse Tab (hacia delante) o Mayús+Tab (hacia atrás).
• Para activar un vínculo resaltado, pulse Intro.
• Para agrandar el texto, pulse Ctrl+signo de igual.
• Para reducir el tamaño del texto, pulse Ctrl+Guión.
Elección de los documentos adecuados de la Ayuda
En la siguiente lista se resume la documentación disponible en el menú Ayuda. Utilice esta lista para determinar el sistema
de Ayuda en el que encontrará la respuesta adecuada.
• La Ayuda de Dreamweaver (denominada Utilización de Dreamweaver) va dirigida a todos los usuarios y ofrece
información completa sobre todas las funciones de Adobe® Dreamweaver® CS3.
• Ampliación de Dreamweaver, que describe el entorno de trabajo y la interfaz de programación de aplicaciones (API) de
Dreamweaver, va dirigido a usuarios avanzados que deseen crear extensiones o personalizar la interfaz de Dreamweaver.
• Referencia API de Dreamweaver documenta la API de utilidades y la API de JavaScript que los usuarios avanzados
emplean para crear extensiones y personalizar la interfaz.
• La Ayuda de Spry Framework describe la creación de conjuntos de datos Ajax, widgets y efectos con el entorno de trabajo
de Spry e incluyemuestras de código y materiales predefinidos para comenzar a trabajar rápidamente. Estos documentos
no son específicos de Dreamweaver. Para ver temas de Spry específicos para Dreamweaver, consulte Utilización de
Dreamweaver.
• La Ayuda de ColdFusion es una selección de manuales del juego de documentación de Macromedia® ColdFusion® de
Adobe (el juego completo está disponible en LiveDocs). Estos documentos de Ayuda están pensados tanto para usuarios
sin experiencia como para desarrolladores avanzados interesados en ColdFusion.
• Referencia proporciona acceso a manuales de referencia sobreHTML,modelos de servidor y otros temas. Están pensados
para todos los que necesitan información adicional sobre sintaxis o conceptos de codificación, etc.
Recursos
Adobe Video Workshop
Adobe Creative Suite 3 VideoWorkshop ofrece más de 200 vídeos de formación que tratan una amplia gama de temas para
profesionales de la impresión, la Web y de vídeo.
DREAMWEAVER CS3
Guía del usuario
5
Puede utilizar Adobe Video Workshop para obtener información acerca de cualquier producto de Creative Suite 3. En
muchos de estos vídeos se muestra cómo utilizar varias aplicaciones Adobe a la vez.
A. Botones Atrás/Adelante (Enlaces visitados anteriormente) B. Subtemas expandibles C. Iconos que indican un tema común D. Botones
Anterior/Siguiente (temas en orden secuencial)
Funciones de accesibilidad
El contenido de la Ayuda de Adobe está accesible a personas discapacitadas (por ejemplo, con problemas de movilidad,
ceguera o dificultades de visión). La Ayuda del producto admite funciones de accesibilidad estándar:
• El usuario puede cambiar el tamaño del texto con comandos de menú contextual estándar.
• Los Enlaces están subrayados para puedan reconocerse más fácilmente.
• Si el texto del vínculo no concuerda con el título del destino, se hace referencia al título en el atributo Título de la etiqueta
de anclaje. Por ejemplo, los Enlaces Anterior y Siguiente incluyen los títulos de los temas anterior y siguiente.
• El contenido admite el modo de alto contraste.
• Los gráficos sin rótulos incluyen texto alternativo.
• Cada marco tiene un título que indica su finalidad.
• Las etiquetas HTML estándar definen la estructura de contenido para herramientas de lectura de pantalla o de
conversión de texto a voz.
• Las hojas de estilos controlan el formato, de modo que no hay fuentes incrustadas.
Métodos abreviados de teclado para los controles de las barras de herramientas de la Ayuda (Windows)
Botón Atrás Alt + Flecha izquierda
Botón Adelante Alt + Flecha derecha
Imprimir Ctrl+P
Botón Acerca de Ctrl+I
C
D
B
A
DREAMWEAVER CS3
Guía del usuario
4
Menú Examinar Alt+flecha abajo o Alt+flecha arriba para ver la Ayuda de otra aplicación
Cuadro Buscar Ctrl+S para colocar el punto de inserción en el cuadro Buscar
Métodos abreviados de teclado para navegación por la Ayuda (Windows)
• Para desplazarse por los paneles, pulse Ctrl+Tab (hacia delante) y Mayús+Ctrl+Tab (hacia atrás).
• Para desplazarse por los Enlaces de un panel y resaltarlos, pulse Tab (hacia delante) o Mayús+Tab (hacia atrás).
• Para activar un vínculo resaltado, pulse Intro.
• Para agrandar el texto, pulse Ctrl+signo de igual.
• Para reducir el tamaño del texto, pulse Ctrl+Guión.
Elección de los documentos adecuados de la Ayuda
En la siguiente lista se resume la documentación disponible en el menú Ayuda. Utilice esta lista para determinar el sistema
de Ayuda en el que encontrará la respuesta adecuada.
• La Ayuda de Dreamweaver (denominada Utilización de Dreamweaver) va dirigida a todos los usuarios y ofrece
información completa sobre todas las funciones de Adobe® Dreamweaver® CS3.
• Ampliación de Dreamweaver, que describe el entorno de trabajo y la interfaz de programación de aplicaciones (API) de
Dreamweaver, va dirigido a usuarios avanzados que deseen crear extensiones o personalizar la interfaz de Dreamweaver.
• Referencia API de Dreamweaver documenta la API de utilidades y la API de JavaScript que los usuarios avanzados
emplean para crear extensiones y personalizar la interfaz.
• La Ayuda de Spry Framework describe la creación de conjuntos de datos Ajax, widgets y efectos con el entorno de trabajo
de Spry e incluyemuestras de código y materiales predefinidos para comenzar a trabajar rápidamente. Estos documentos
no son específicos de Dreamweaver. Para ver temas de Spry específicos para Dreamweaver, consulte Utilización de
Dreamweaver.
• La Ayuda de ColdFusion es una selección de manuales del juego de documentación de Macromedia® ColdFusion® de
Adobe (el juego completo está disponible en LiveDocs). Estos documentos de Ayuda están pensados tanto para usuarios
sin experiencia como para desarrolladores avanzados interesados en ColdFusion.
• Referencia proporciona acceso a manuales de referencia sobreHTML,modelos de servidor y otros temas. Están pensados
para todos los que necesitan información adicional sobre sintaxis o conceptos de codificación, etc.
Recursos
Adobe Video Workshop
Adobe Creative Suite 3 VideoWorkshop ofrece más de 200 vídeos de formación que tratan una amplia gama de temas para
profesionales de la impresión, la Web y de vídeo.
DREAMWEAVER CS3
Guía del usuario
5
Puede utilizar Adobe Video Workshop para obtener información acerca de cualquier producto de Creative Suite 3. En
muchos de estos vídeos se muestra cómo utilizar varias aplicaciones Adobe a la vez.
Cuando inicie Adobe VideoWorkshop, elija los productos de los que desea obtener información y los temas que desea ver.
Puede obtener información detallada sobre cada vídeo para ayudarle a definir su aprendizaje.
Comunidad
Comunidad de presentadores
Con esta versión, Adobe Systems ha invitado a la comunidad de sus usuarios a que comparta su experiencia y sus
conocimientos. Adobe y lynda.compresentan tutoriales, sugerencias y trucos de diseñadores y programadores destacados,
como Joseph Lowery, Katrin Eismann y Chris Georgenes. Podrá ver y oír a expertos de Adobe como Lynn Grillo, Greg
Rewis y Russell Brown. En total, más de 30 expertos de productos comparten sus conocimientos.
DREAMWEAVER CS3
Guía del usuario
6
Tutoriales y archivos fuente
Adobe Video Workshop incluye formación para usuarios principiantes y experimentados. También encontrará vídeos
sobre las nuevas funciones y técnicas principales. Cada vídeo cubre un único tema y suele durar entre tres y cinco minutos.
La mayoría de los vídeos vienen acompañados de archivos de origen y de un tutorial con ilustraciones para que el usuario
pueda imprimir los pasos detallados y realizar una prueba por sí solo siguiendo el tutorial.
Uso de Adobe Video Workshop
Puede acceder a Adobe Video Workshop a través del DVD que se facilita con el producto Creative Suite 3. También está
disponible en línea en http://www.adobe.com/go/learn_videotutorials_es. Adobe añadirá periódicamente nuevos vídeos a
Video Workshop en línea, de modo que puede visitar la página Web para comprobar si hay novedades.
Vídeos de Dreamweaver CS3
Adobe Video Workshop abarca una gran variedad de temas de Adobe Dreamweaver® CS3, entre los que se incluyen los
siguientes:
• Uso y personalización de diseños basados en CSS
• Uso de widgets Spry
• Diseño de formularios con CSS
• Solución de problemas de publicación
• Creación de rollovers
Los vídeos muestran también cómo utilizar Dreamweaver CS3 con otro software de Adobe:
• Diseño de sitios Web con Dreamweaver y Photoshop
• Uso de plantillas de Dreamweaver con Contribute®
• Importación, copiado y pegado entre aplicaciones Web
Para acceder a tutoriales de vídeo de Adobe Creative Suite 3, visite Adobe Video Workshop en
www.adobe.com/go/learn_videotutorials_es.
Extras
Tiene acceso a una amplia variedad de recursos que le ayudarán a obtener el máximo partido de su software de Adobe.
Algunos de estos recursos se instalan en su PC durante el proceso de instalación, pero puede encontrar muestras y
documentos de ayuda adicionales en el disco de instalación o de contenido. También puede disponer de recursos
adicionales exclusivos en línea por la comunidad de Adobe Exchange, en www.adobe.com/go/exchange_es.
Recursos instalados
Durante la instalación del software, se instalan una serie de recursos en la carpeta de la aplicación. Para ver esos archivos,
desplácese a la carpeta de la aplicación en su equipo.
• Windows®: [unidad de inicio]\Archivos de programa\Adobe\[aplicación de Adobe]
• Mac OS®: [unidad de arranque]/Aplicaciones/[aplicación de Adobe]
La carpeta de la aplicación puede contener los siguientes recursos:
Plugins Los módulos plugin son pequeños programas de software que amplían o añaden funciones al software. Una vez
instalados, los módulos plugin aparecen como opciones en los menús Importar o Exportar, como formatos de archivo en
los cuadros de diálogo Abrir, Guardar como y Exportar original, o como filtros en los submenús Filtro. Por ejemplo, en la
carpeta Plugins incluida en la carpeta Photoshop CS3 se instalan automáticamente una serie de complementos de efectos
especiales.
Ajustes preestablecidos Los ajustes preestablecidos incluyen una gran variedad de herramientas, preferencias, efectos e
imágenes útiles. Los ajustes preestablecidos del producto incluyen pinceles, muestras, grupos de colores, símbolos, formas
personalizadas, estilos de gráficos y capas, patrones, texturas, acciones, espacios de trabajo, etc. El contenido de los ajustes
preestablecidos se encuentra en toda la interfaz de usuario. Algunos ajustes preestablecidos (como las bibliotecas de
DREAMWEAVER CS3
Guía del usuario
7
pinceles de Photoshop) sólo están disponibles cuando se selecciona la herramienta correspondiente. Si no desea crear un
efecto o imagen desde el principio, vaya a las bibliotecas de ajustes preestablecidos como fuente de inspiración.
Plantillas Los archivos de plantilla pueden abrirse y examinarse desde Adobe Bridge CS3, abrirse desde la pantalla de
bienvenida o abrirse directamente desde el menú Archivo. Según el producto, los archivos de plantilla abarcan desde
membretes, boletines y sitiosWeb hasta menús de DVD y botones de vídeo. Cada archivo de plantilla se crea de un modo
profesional y representa un ejemplo del uso óptimo de las funciones del producto. Las plantillas pueden ser un recurso
valioso cuando tenga que iniciar inmediatamente un proyecto.
Ejemplos Los archivos de ejemplo incluyen diseños más complejos y son muy útiles para ver cómo funcionan las nuevas
características. Estos archivos muestran el abanico de posibilidades creativas disponibles para usted.
Fuentes Con el producto Creative Suite se incluyen varias fuentes y familias de fuentes OpenType®. Las fuentes se copian
en el equipo durante la instalación:
• Windows: [unidad de inicio]\Windows\Fonts
• Mac OS X: [unidad de inicio]/Librería/Fonts
para obtener más información sobre la instalación de fuentes, consulte el archivo Read Me en el DVD de instalación.
Contenido del DVD
El DVD de instalación o contenido incluido con el producto contiene recursos adicionales que puede utilizar con el
software. La carpeta Extras contiene archivos específicos del producto como plantillas, imágenes, ajustes preestablecidos,
acciones, plugins y efectos, junto con subcarpetas de fuentes y fotografías de existencias. La carpeta Documentation
contiene la versión en PDF de la Ayuda, información técnica y otros documentos como hojas de muestras, guías de
referencia e información específica de funciones.
Adobe Exchange
Para consultarmás contenido gratuito, visitewww.adobe.com/go/exchange_es, una comunidad en línea donde los usuarios
descargan y comparten miles de complementos, extensiones y acciones de tipo gratuito, así como otro contenido que se
puede utilizar con productos de Adobe.
Bridge Home
Bridge Home, una de las novedades de Adobe Bridge CS3, proporciona información actualizada sobre todo el software de
Adobe Creative Suite 3 en un único y cómodo lugar. Inicie Adobe Bridge y haga clic en el icono Bridge Home situado en
la parte superior del panel Favoritos para acceder a las sugerencias, noticias y recursos más recientes para las herramientas
de Creative Suite.
ET VERO EOS ET ACCUSAM ET JUSTO
DUO DOLORES ET EA REBUM. STET CLITA KASD.
ET COSETETUR SADIPSCING
01 PelletirInc.
CORE INVESTMENT SPECTRUM
Vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan
et iusto odio dignissim qui.
RETIREMENT SAVING PLAN
Vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan
et iusto odio dignissim qui.
Your Investment Guide
Are you leaving money on the table?
01
Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum
claritatem. Investigationes demonstraverunt lectores legere me lius quod ii
legunt saepius. Claritas est etiam processus.
Travel Earth Best 100 places to see on the planet
in your lifetime
volute
ipsummy
, commy
re eugiarud
tem
eraesexer
n ullutet
Vel: Ad : Vulputate:
SURVICE MENU
NULCHE
vero dio eum
nulche
agiamet ad lorperit
sum a
$45
agiamet ad atin utet
vero dio eum
nulche suma
agaimet ad eum
nullam
$25
lorperit sum a
agiamet ad lorperit
vero dio
eum nullam
$35
SUCCIVEROS
sucicvero dio
vero dio eum
nulche suma
$15
eum nullam
vero dio eum
nulche suma
agaimet ad eum
nullam
$35
N
eum nullam
$35
SUCCIVEROS
sucicvero dio
vero dio eum
nulche suma
$15
eum nullam
vero dio eum
nulche suma
agaimet ad eum
nullam
$35
Casiopia
SpA
DREAMWEAVER CS3
Guía del usuario
8
Nota: Bridge Home puede que no esté disponible en todos los idiomas.
Adobe Design Center
AdobeDesign Center ofrece artículos, fuentes de inspiración e instrucciones de expertos del sector, diseñadores destacados
y socios editores de Adobe. Cada mes se añade nuevo contenido.
Encontrará cientos de tutoriales sobre el diseño de productos y conocerá sugerencias y técnicas a través de vídeos, tutoriales
HTML y capítulos de libros de ejemplos.
Las nuevas ideas son la esencia de Think Tank, Dialog Box y Gallery:
• En los artículos de Think Tank se contempla la implicación de los diseñadores con la tecnología y lo que su experiencia
significa para el diseño, las herramientas de diseño y la sociedad.
• En Dialog Box, los expertos comparten nuevas ideas sobre gráficos en movimiento y diseño digital.
• En Gallery se muestra cómo los artistas transmiten el diseño en movimiento.
DREAMWEAVER CS3
Guía del usuario
9
Visite Adobe Design Center en www.adobe.com/designcenter.
Centro de desarrolladores de Adobe
El Centro de desarrolladores de Adobe proporciona muestras, tutoriales, artículos y recursos de la comunidad para los
desarrolladores que crean aplicaciones complejas en Internet, sitios Web, contenido de dispositivos móviles y otros
proyectos mediante los productos de Adobe. El Centro de desarrolladores contiene también recursos para los
programadores que desarrollan plugins para los productos de Adobe.
Además de código de ejemplo y tutoriales, encontrará canales RSS, seminarios en línea, SDK, guías de scripting y otros
recursos técnicos.
Visite el Centro de desarrolladores de Adobe en www.adobe.com/go/developer_es.
Servicio de atención al cliente
Visite el sitioWeb Adobe Support en www.adobe.com/es/support para buscar información sobre solución de problemas del
producto y conocer las opciones de servicio técnico gratuitas o bajo pago. Siga el vínculo de formación para acceder a los
libros de Adobe Press, recursos de formación, programas de certificación de software de Adobe y mucho más.
Descargas
Visite www.adobe.com/go/downloads_es para obtener actualizaciones gratuitas, versiones de prueba y otros programas de
software útiles. Asimismo, la tienda de Adobe (en www.adobe.com/go/store_es) proporciona acceso a miles de plugins de
programadores de otros productos que le ayudarán a automatizar las tareas, personalizar los flujos de trabajo, crear efectos
profesionales, etc.
Adobe Labs
Adobe Labs le ofrece la oportunidad de experimentar y evaluar tecnologías y productos nuevos y en desarrollo de Adobe.
En Adobe Labs, tendrá acceso a recursos como:
• Versiones preliminares de software y tecnología
• Ejemplos de código y prácticas recomendadas que agilizan su aprendizaje
• Versiones preliminares de productos y documentación técnica
• Foros, contenido wiki y otros recursos de colaboración que le ayudarán a interactuar con programadores afines
DREAMWEAVER CS3
Guía del usuario
10
Adobe Labs fomenta un proceso de desarrollo de software en colaboración. En este entorno, los clientes empiezan a ser
productivos rápidamente con los nuevos productos y tecnologías.Adobe Labs también es un foro para ofrecer comentarios
iniciales, que los equipos de desarrollo de Adobe utilizan para crear software que cumple las necesidades y las expectativas
de la comunidad.
Visite Adobe Labs en www.adobe.com/go/labs_es.
Comunidades de usuarios
En las comunidades de usuarios se incluyen foros, blogs y otros medios para que los usuarios compartan tecnologías,
herramientas e información. Los usuarios pueden plantear preguntas y conocer cómo otros usuarios obtienen el máximo
rendimiento de su software. Hay foros de usuario a usuario disponibles en inglés, francés, alemán y japonés; también hay
blogs disponibles en una amplia variedad de idiomas.
Para participar en los foros o blogs, visite www.adobe.com/es/communities.
Novedades
Principales funciones nuevas de Adobe Dreamweaver CS3
Framework de Spry para Ajax
Con Adobe® Dreamweaver® CS3, puede diseñar visualmente, desarrollar y desplegar interfaces de usuario empleando el
framework de Spry para Ajax. El framework de Spry para Ajax es una biblioteca JavaScript que proporciona a los
diseñadoresWeb la capacidad de crear páginas que ofrezcan una experiencia más completa a los usuarios. A diferencia de
otros frameworks Ajax, Spry es accesible tanto para diseñadores como para desarrolladores, ya que es en un 99% código
HTML. Consulte “Creación visual de páginas de Spry” en la página 423.
Widgets de Spry
Los widgets de Spry son componentes comunes de interfaz de usuario listos para ser utilizados que puede personalizar
mediante CSS y, posteriormente, añadir a sus páginasWeb. Con Dreamweaver, puede añadir a las páginas diversos widgets
de Spry, incluidas listas y tablas gestionadas mediante XML, acordeones, interfaces en fichas y elementos de formulario con
validación. Consulte “Adición de widgets de Spry” en la página 423.
Efectos de Spry
Los efectos de Spry ofrecen un método sencillo y elegante para mejorar el aspecto y el funcionamiento de un sitio Web.
Puede aplicarlos prácticamente a cualquier elemento de una página HTML. Puede añadir efectos de Spry para aumentar o
reducir el tamaño de elementos; hacer que se desvanezcan o resaltarlos; modificar visualmente un elemento de una página
durante un período de tiempo determinado, etc. Consulte “Adición de efectos de Spry” en la página 457.
Integración de Photoshop CS3 avanzada
Dreamweaver incluye integración avanzada con Photoshop CS3. Los diseñadores ahora pueden simplemente seleccionar
cualquier parte de un diseño en Photoshop (que abarque incluso varias capas) y pegarla directamente en una página de
Dreamweaver. Dreamweaver muestra un cuadro de diálogo en el que puede especificar las opciones de optimización de la
imagen. Si en algún momento necesita editar la imagen, sólo tendrá que hacer doble clic en ella para abrir el archivo PSD
con las capas originales y modificarla en Photoshop. Consulte “Utilización con Photoshop” en la página 354.
Comprobación de compatibilidad con navegadores
La nueva función Comprobación de compatibilidad con navegadores de Dreamweaver genera informes que identifican
problemas de representación relacionados con CSS en diversos navegadores. En la vista Código, los problemas se indican
mediante un subrayado verde para que sepa dónde se encuentran exactamente. Una vez que haya identificado el problema,
podrá resolverlo rápidamente si conoce la solución o visitar Adobe CSS Advisor si necesita más información. Consulte
“Comprobación de problemas de representación de CSS con distintos navegadores” en la página 133.
DREAMWEAVER CS3
Guía del usuario
11
Adobe CSS Advisor
El sitioWeb de Adobe CSS Advisor contiene información sobre los problemas de CSS más recientes y puede obtener acceso
a él directamente desde la interfaz de usuario deDreamweaver durante el proceso de Comprobación de compatibilidad con
navegadores.Más que un foro, una página estilo wiki o un grupo de debate, CSS Advisor facilita la adición de comentarios
con sugerencias y mejoras al contenido existente, así como la incorporación de nuevos problemas que puedan beneficiar a
toda la comunidad de usuarios. Consulte “Comprobación de problemas de representación de CSS con distintos
navegadores” en la página 133.
Diseños CSS
Dreamweaver ofrece un conjunto de diseños CSS predefinidos que le permiten crear páginas con rapidez y le ayudan a
conocer el diseño de páginas CSS mediante amplios comentarios en línea incluidos en el código. La mayoría de los diseños
de sitios existentes en la Web pueden agruparse en tres categorías: diseños de una, dos o tres columnas, cada uno de ellos
con una serie de elementos adicionales (como los encabezados y pies de página). Dreamweaver ofrece ahora una lista
completa de diseños esenciales que puede personalizar para adaptarlos a sus necesidades.Consulte “Creación de una página
con un diseño CSS” en la página 140.
Administración de CSS
La función de administración de CSS facilita el traslado de reglas CSS de un documento a otro, de la sección head de un
documento a una hoja externa, entre archivos CSS externos, etc. También puede convertir CSS en línea en reglas CSS y
colocarlas en el lugar en el que sean necesarias simplemente arrastrándolas y colocándolas. Consulte “Desplazamiento de
reglas CSS” en la página 130 y “Conversión de CSS en línea en una regla CSS” en la página 131.
Adobe Device Central
Adobe Device Central, que se encuentra integrado en Dreamweaver y en el resto de productos de software de la familia
Creative Suite 3, simplifica la creación de contenido móvil permitiéndole un acceso rápido a especificaciones técnicas
esenciales para cada dispositivo y reduciendo el texto y las imágenes de la página HTML para mostrar una representación
precisa de cómo aparecerían en el dispositivo. Consulte “Obtención de vista previa de páginas en dispositivos móviles” en
la página 284.
Adobe Bridge CS3
Utilice Dreamweaver con Adobe Bridge CS3 para administrar imágenes y activos de manera sencilla y coherente. Adobe
Bridge ofrece un acceso centralizado a los archivos de proyectos, aplicaciones y parámetros de configuración, además de
prestaciones de asignación y búsqueda de etiquetas demetadatos XMP. Gracias a sus funciones para organizar y compartir
archivos, además del acceso a Adobe Stock Photos, Adobe Bridge proporciona un flujo de trabajo más eficiente y le permite
un mayor control de sus proyectos de impresión, Web, vídeo y móvil. Consulte “Utilización con Bridge” en la página 362.
12
Capítulo 2: Espacio de trabajo
El espacio de trabajo de Adobe® Dreamweaver® CS3 contiene barras de herramientas, inspectores y paneles que le permiten
crear páginas Web. Puede personalizar el aspecto general y el comportamiento del espacio de trabajo.
Flujo de trabajo y espacio de trabajo de Dreamweaver
Introducción al flujo de trabajo de Dreamweaver
Puede utilizar varios métodos para crear un sitio Web; éste es uno de ellos:
Planificación y configuración del sitio
Determine la ubicación de los archivos y examine las necesidades del sitio, el perfil de la audiencia y sus objetivos. Además,
tenga en cuenta requisitos técnicos como el acceso de los usuarios, las 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.
(Véase “Utilización de los sitios de Dreamweaver” en la página 37.)
Organización y administración de los archivos del sitio
En el panel Archivos puede añadir, borrar y cambiar el nombre de los archivos y carpetas fácilmente con el fin demodificar
la organización según resulte necesario. Allí 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. El panel Activos permite organizar fácilmente
los activos de un sitio, que se pueden arrastrar directamente desde el panel hasta un documento de Dreamweaver. Puede
utilizar Dreamweaver para administrar diversos aspectos de sus sitios de Adobe® Contribute®. (Véase “Administración de
archivos y carpetas” en la página 73 y “Administración de activos y bibliotecas” en la página 103.)
Diseño de las páginas Web
Elija el diseñomás apropiado, o combine las opciones de diseño de Dreamweaver para definir el aspecto de su sitio. En la
creación de su diseño puede utilizar elementos PA, estilos de posición CSS o diseños CSS predefinidos de Dreamweaver.
Las herramientas de tabla le permite diseñar páginas rápidamente y, posteriormente, reorganizar la estructura de las
mismas. Paramostrar varios documentos de forma simultánea en un navegador, pueden utilizarsemarcos para diseñar los
documentos. Por último, 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 “Creación de páginas con CSS” en la página 114 y “Maquetación de
páginas con HTML” en la página 163.)
Adición de contenido a las páginas
Añada activos y elementos de diseño, como texto, imágenes, imágenes de sustitución, mapas de imágenes, colores, películas,
sonido, vínculos HTML, menús de salto y mucho más. Puede utilizar funciones de creación de páginas incrustadas para
dichos elementos, como títulos y fondos, escribir directamente en la página o importar contenido desde otros documentos.
Dreamweaver también proporciona comportamientos para llevar a cabo tareas en respuesta a eventos específicos, como la
validación de un formulario cuando el visitante hace clic en el botón Enviar o abrir una segunda ventana del navegador
cuando la página principal ha terminado de cargarse. Por último, Dreamweaver incluye herramientas para maximizar el
rendimiento del sitio Web y para la comprobación de las páginas, con objeto de garantizar su compatibilidad con
navegadores Web distintos. (Véase “Adición de contenido a las páginas” en la página 203.)
Creación de páginas mediante la introducción manual de código
La codificación manual de páginas Web es otro método de crear páginas. Dreamweaver ofrece sencillas herramientas de
edición visual, pero también incluye 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. (Véase “Utilización del código de las páginas” en la página 285.)
DREAMWEAVER CS3
Guía del usuario
13
Configuración de una aplicación Web para contenido dinámico
Muchos sitios Web contienen páginas dinámicas que permiten a los visitantes ver información almacenada en bases de
datos y que suelen permitirles añadir y editar información. Para crear esas páginas, debe configurar primero un servidor y
una aplicaciónWeb, crear omodificar un sitio deDreamweaver y conectarse a una base de datos. (Véase “Preparación para
crear sitios dinámicos” en la página 461.)
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 establecer 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. Puede incorporar lógica de aplicaciones o empresarial mediante
tecnologías como Macromedia® ColdFusion® de Adobe® y servicios Web. Si necesita más flexibilidad, puede crear sus
propios comportamientos de servidor y formularios interactivos. (Véase “Creación de páginas dinámicas” en la
página 506.)
Comprobación y publicación
La comprobación de las paginas es un proceso continuo que se lleva a cabo durante todo el ciclo de desarrollo. Al final del
ciclo, publicará el sitio en un servidor. Muchos desarrolladores también programan operaciones de mantenimiento
periódico para asegurarse de que el sitio se mantiene actualizado y operativo. (Véase “Obtención y colocación de archivos
en el servidor” en la página 82.)
Introducción al diseño del espacio de trabajo
El espacio de trabajo de Dreamweaver permite ver las propiedades de los documentos y los objetos. Además, colocamuchas
de las operaciones más frecuentes en barras de herramientas para que pueda realizar cambios en los documentos
rápidamente.
En Windows®, Dreamweaver proporciona un diseño integrado en una única ventana. En el espacio de trabajo integrado,
todas las ventanas y paneles están integrados en una única ventana de la aplicación de mayor tamaño.
Véase también
“Utilización de barras de herramientas, menús contextuales y paneles” en la página 26
“Elección del diseño del espacio de trabajo (Windows)” en la página 32
“Elección del diseño del espacio de trabajo (Macintosh)” en la página 32
“Visualización de documentos en fichas (Macintosh)” en la página 32
Introducción a los elementos del espacio de trabajo
El espacio de trabajo incluye los siguientes elementos.
Nota: Dreamweaver ofrece otros muchos paneles, inspectores y ventanas. Para abrir los paneles, inspectores y ventanas, utilice
elmenú Ventana. Si no encuentra un panel, un inspector o una ventana que hayamarcado como abierto, seleccione Ventana
> Organizar paneles para disponer ordenadamente todos los paneles abiertos.
Ventana de bienvenida Le permite abrir un documento reciente o crear un documento nuevo. Desde la pantalla de
bienvenida, también puede profundizar sus conocimientos sobreDreamweaver mediante una visita guiada o un tutorial del
producto.
Barra Insertar Contiene botones para la inserción de diversos tipos de objeto, como imágenes, tablas y elementos PA, en un
documento. Cada objeto es un fragmento de código HTML que le permite establecer diversos atributos al insertarlo. Por
ejemplo, puede insertar una tabla haciendo clic en el botón Tabla de la barra Insertar. Si lo prefiere, puede insertar objetos
utilizando el menú Insertar en lugar de la barra Insertar.
A B C D
E F G
DREAMWEAVER CS3
Guía del usuario
15
Barra de herramientas Documento Contiene botones que proporcionan opciones para diferentes vistas de la ventana de
documento (como la vista Diseño y la vista Código), diversas opciones de visualización y algunas operaciones comunes
como la obtención de una vista previa en un navegador.
Barra de herramientas Estándar (No semuestra en el diseño de espacio de trabajo predeterminado.)Contiene botones para
las operaciones más habituales de los menúsArchivo y Edición:Nuevo,Abrir,Guardar,Guardar todo,Cortar,Copiar, Pegar,
Deshacer y Rehacer. Para mostrar la barra de herramientas Estándar, seleccione Ver > Barras de herramientas > Estándar.
Barra de herramientas Codificación (Sólo se muestra en la vista Código.) Contiene botones que le permiten realizar
numerosas operaciones de codificación estándar.
Barra de herramientas Representación de estilos (Oculta de manera predeterminada.) Contiene botones que le permiten
ver cómo aparecería el diseño en distintos tipos demedios si utilizase hojas de estilos dependientes de losmedios. También
contiene un botón que le permite activar o desactivar estilos de hojas de estilos en cascada (CSS).
Ventana de documento Muestra el documento actual mientras lo está creando y editando.
Inspector de propiedades Le permite ver y cambiar diversas propiedades del objeto o texto seleccionado. Cada tipo de
objeto tiene diferentes propiedades. El inspector de propiedades no está ampliado de forma predeterminada en el diseño
del espacio de trabajo del codificador.
Selector de etiquetas Situado en la barra de estado de la parte inferior de la ventana de documento. Muestra la jerarquía
de etiquetas que rodea a la selección actual.Haga clic en cualquier etiqueta de la jerarquía para seleccionar la etiqueta y todo
su contenido.
Grupos de paneles Conjuntos de paneles relacionados agrupados bajo un encabezado común. Para ampliar un grupo de
paneles, haga clic en la flecha de ampliación situada a la izquierda del nombre del grupo; para desacoplar un grupo de
paneles, arrastre el punto de sujeción situado en el borde izquierdo de la barra de título del grupo.
Panel Archivos Le permite administrar los archivos y las carpetas, tanto si forman parte de un sitio de Dreamweaver como
si se encuentran en un servidor remoto. El panel Archivos también proporciona acceso a todos los archivos del disco local,
como ocurre en el Explorador de Windows (Windows) o en el Finder (Macintosh).
Véase también
“Utilización de la ventana de documento” en la página 23
“Utilización de barras de herramientas, menús contextuales y paneles” en la página 26
“Grupos de paneles” en la página 29
Introducción a la ventana de documento
La ventana de documento muestra el documento actual. Puede elegir entre una de las vistas siguientes:
Vista Diseño Un entorno para el diseño visual de la página, la edición visual y el desarrollo rápido de aplicaciones. En esta
vista, Dreamweaver muestra una representación visual del documento completamente editable, similar a la que aparecería
en un navegador. Puede configurar la vista Diseño para que muestre el contenido dinámico mientras trabaja en el
documento.
Vista Código Un entorno de codificación manual para escribir y editar código HTML, JavaScript, código de lenguaje de
servidor, como por ejemplo PHP o ColdFusion Markup Language (CFML), y otros tipos de código.
Vistas Código y Diseño Le permite ver las dos vistas, Código y Diseño, para el mismo documento en una sola ventana.
Cuando la ventana de documento tiene una barra de título, éstamuestra el título de la página y, entre paréntesis, el nombre
y la ruta del archivo. Si se han realizado cambios que aún no se han guardado, Dreamweaver incluye un asterisco después
del nombre del archivo.
Cuando se maximiza la ventana de documento en el diseño integrado de espacio de trabajo (sóloWindows), no aparece la
barra de título; eneste caso, el título de la página y el nombre y la rutadel archivo aparecenenla barra de título de la ventana
principal del espacio de trabajo.
DREAMWEAVER CS3
Guía del usuario
16
Cuando una ventana de documento estámaximizada, aparecen fichas en la parte superior de la misma con los nombres de
archivo de todos los documentos abiertos. Para cambiar a un documento, haga clic en su ficha.
Véase también
“Utilización de la ventana de documento” en la página 23
“Codificación en Dreamweaver” en la página 285
“Visualización de live data en la vista de Diseño” en la página 545
Introducción a la barra de herramientas Documento
La barra de herramientas Documento contiene botones que permiten alternar entre diferentes vistas del documento
rápidamente: vista Código, vista Diseño y una vista dividida que muestra las vistas Código y Diseño.
La barra de herramientas contiene también algunos comandos y opciones relativos a la visualización del documento y a su
transferencia entre los sitios local y remoto.
A. Mostrar vista de código B. Mostrar vistas de código y diseño C. Mostrar vista de diseño D. Título del documento E. Administración de
archivos F. Vista previa/Depurar en explorador G. Actualizar vista de diseño H. Ver opciones I. Ayudas visuales J. Validar formato
K. Comprobar compatibilidad con navegadores
En la barra de herramientas Documento, aparecen las siguientes opciones:
Mostrar vista de código Sólo muestra la vista Código en la ventana de documento.
Mostrar vistas de código y diseño Divide la ventana de documento entre las vistas Código y Diseño. Cuando seleccione
esta vista combinada, se encontrará disponible la opción Vista de diseño encima del menú Ver.
Mostrar vista de diseño Sólo muestra la vista Diseño en la ventana de documento.
Nota: Si trabaja con XML, JavaScript, CSS u otros tipos de archivos basados en código, no podrá ver los archivos en la vista
Diseño y los botones Diseño y Dividir aparecerán atenuados.
Título del documento Permite introducir un título para el documento, que aparecerá en la barra de título del navegador. Si
el documento ya tiene título, éste aparecerá en dicho campo.
Administración de archivos Muestra el menú emergente Administración de archivos.
Vista previa/Depurar en explorador Le permite obtener una vista previa o depurar el documento en un navegador.
Seleccione un navegador en el menú emergente.
Actualizar vista de diseño Actualiza la vista Diseño tras realizar cambios en la vista Código. Los cambios realizados en la
vista Código no aparecerán de forma automática en la vista Diseño hasta que se efectúen determinadas acciones, como
guardar el archivo o hacer clic en este botón.
Nota: La actualización también actualiza funciones de código que dependen delDOM(modelo de objeto de documento), como
la capacidad para seleccionar las etiquetas inicial y final de un bloque de código.
Ver opciones Permite definir las opciones de las vistas Código y Diseño, y establecer qué vista va a aparecer en la parte
superior de la ventana. Las opciones del menú corresponden a la vista actual: la vista Diseño, la vista Código o ambas.
Ayudas visuales Permite utilizar distintas ayudas visuales para el diseño de las páginas.
Validar formato Permite validar el documento actual o una etiqueta seleccionada.
Comprobar compatibilidad con navegadores Le permite comprobar si el CSS es compatible con diferentes navegadores.
A B C D E F G H I J K
DREAMWEAVER CS3
Guía del usuario
17
Véase también
“Visualización de barras de herramientas” en la página 26
“Personalización del entorno de codificación” en la página 292
“Visualización y edición del contenido de Head” en la página 319
“Utilización de ayudas visuales al diseñar” en la página 163
Introducción a la barra de herramientas Estándar
La barra de herramientas Estándar contiene botones para las operaciones más habituales de los menús Archivo y Edición.
Nuevo, Abrir,Guardar,Guardar todo, Cortar, Copiar, Pegar,Deshacer y Rehacer. Estos botones se utilizan del mismomodo
que los comandos de menú equivalentes.
Véase también
“Visualización de barras de herramientas” en la página 26
“Cómo crear y abrir documentos” en la página 64
Introducción a la barra de estado
La barra de estado, situada en la parte inferior de la ventana de documento, proporciona información adicional sobre el
documento que está creando.
A. Selector de etiquetas B. Herramienta Seleccionar C. HerramientaMano D. Herramienta Zoom E. Establecer nivel de aumento F. Menú
emergente Tamaño de ventana G. Tamaño del documento y tiempo de descarga estimado
Selector de etiquetas Muestra la jerarquía de etiquetas que rodea a la selección actual. Haga clic en cualquier etiqueta de
la jerarquía para seleccionar la etiqueta y todo su contenido. Haga clic en para seleccionar todo el cuerpo del
documento. Para definir los atributos class o id para una etiqueta en el selector de etiquetas, haga clic con el botón de
derecho del ratón (Windows) omantenga presionada la tecla Control y haga clic (Macintosh) en la etiqueta y elija una clase
o un ID del menú contextual.
Herramienta Seleccionar Activa y desactiva la herramienta Mano.
Herramienta Mano Permite hacer clic en el documento y arrastrarlo por la ventana de documento.
Herramienta Zoom y menú emergente Establecer nivel de aumento Permiten establecer un nivel de aumento para el
documento.
Menú emergente Tamaño de ventana (Sólo visible en la vista Diseño.) Permite cambiar el tamaño de la ventana de
documento a dimensiones predeterminadas o personalizadas.
Tamaño del documento y tiempo de descarga Muestra la estimación del tamaño del documento y del tiempo de descarga
de la página, incluidos todos los archivos dependientes, como imágenes y otros archivos multimedia.
Véase también
“Definición del tamaño de ventana y la velocidad de conexión” en la página 25
“Utilización de Acercar y Alejar” en la página 212
“Cambio del tamaño de la ventana de documento” en la página 24
“Configuración de las preferencias de tiempo de descarga y tamaño” en la página 213
A B C D E F G
DREAMWEAVER CS3
Guía del usuario
18
Introducción a la barra Insertar
La barra Insertar contiene botones para crear e insertar objetos, como tablas, elementos PA e imágenes. Al pasar el puntero
sobre un botón, aparece una descripción de la herramienta con el nombre del botón.
Los botones están organizados en varias categorías entre las que puede cambiar haciendo clic en las fichas situadas en la
parte superior de la barra Insertar. Si el documento actual contiene código de servidor, como los documentos ASP o CFML,
aparecen también otras categorías. Cuando se inicia Dreamweaver, se abre la última categoría con la que ha trabajado.
Algunas categorías tienen botones conmenús emergentes. Al seleccionar una opción de unmenú emergente, dicha opción
se convierte en la acción predeterminada del botón. Por ejemplo, si seleccionaMarcador de posición de imagen en el menú
emergente del botón Imagen, la siguiente vez que haga clic en el botón Imagen, Dreamweaver insertará un marcador de
posición de imagen. Siempre que seleccione una nueva opción del menú emergente cambiará la acción predeterminada del
botón.
La barra Insertar está organizada en las categorías siguientes:
Categoría Común Permite crear e insertar los objetos que se utilizan con más frecuencia, como las imágenes y las tablas.
Categoría Diseño Permite insertar tablas, etiquetas div, marcos y widgets de Spry. También puede elegir dos vistas para
tablas: Estándar (valor predeterminado) y Tablas expandidas.
Categoría Formularios Contiene botones que permiten crear formularios e insertar elementos de formulario, incluidos
widgets de validación de Spry.
Categoría Datos Permite insertar objetos de datos de Spry y otros elementos dinámicos, como juegos de registros, regiones
repetidas y grabar formularios de inserción y actualización.
Categoría Spry Contiene botones para crear páginas de Spry, incluidos objetos de datos y widgets de Spry.
Categoría Texto Permite insertar diversas etiquetas de formato de texto y listas, como b, em, p, h1 y ul.
Categoría Favoritos Permite agrupar y organizar los botones de la barra Insertar que utiliza conmás frecuencia en un lugar
común.
Categorías de código de servidor Sólo están disponibles para las páginas que emplean un lenguaje de servidor
determinado, como ASP, ASP.NET, CFML Basic, CFML Flow, CFML Advanced, JSP y PHP. Cada una de estas categorías
contiene objetos de código de servidor que pueden insertarse en la vista Código.
Véase también
“Utilización de la barra Insertar” en la página 26
“Creación visual de páginas de Spry” en la página 423
DREAMWEAVER CS3
Guía del usuario
19
Introducción a la barra de herramientas Codificación
La barra de herramientas Codificación contiene botones que le permiten realizar numerosas operaciones de codificación
estándar, como ampliar y contraer las selecciones de código, resaltar código no válido, insertar o eliminar comentarios,
aplicar sangría al código e insertar fragmentos de código utilizados recientemente. La barra de herramientas Codificación
sólo está visible en la vista Código y aparece verticalmente en el lado izquierdo de la ventana de documento.
No puede desacoplar ni mover la barra de herramientas Codificación, pero sí puede ocultarla.
También puede modificar la barra de herramientas Codificación para que muestre más botones (como Ajustar texto,
Caracteres ocultos y Sangría automática) u ocultar botones que no desea utilizar. Para ello, no obstante, deberá editar el
archivo XML que genera la barra de herramientas. Para más información, consulte Ampliación de Dreamweaver.
Véase también
“Visualización de barras de herramientas” en la página 26
“Inserción de código con la barra de herramientas Codificación” en la página 300
Introducción a la barra de herramientas Representación de estilos
La barra de herramientas Representación de estilos (oculta de manera predeterminada) contiene botones que le permiten
ver cómo aparecería el diseño en distintos tipos demedios si utilizase hojas de estilos dependientes de losmedios. También
contiene un botón con el que es posible activar o desactivar los estilos CSS. Para mostrar la barra de herramientas,
seleccione Ver > Barras de herramientas > Representación de estilos.
Esta barra de herramientas sólo funciona si los documentos utilizan hojas de estilos dependientes de los medios. Por
ejemplo, su hoja de estilos puede especificar una regla para imprimir y otra regla distinta para los dispositivos de mano.
Para obtenermás información acerca de la creación de hojas de estilos dependientes de losmedios, consulte el sitioWeb de
World Wide Web Consortium en www.w3.org/TR/CSS21/media.html.
De manera predeterminada, Dreamweaver muestra el diseño para una pantalla (que muestra cómo se representa una
página en la pantalla del equipo). Puede ver las representaciones para los diferentes soportes haciendo clic en los
correspondientes botones de la barra de herramientas Representación de estilos.
Representar tipo de medio Screen Muestra cómo aparece la página en la pantalla de un equipo.
Representar tipo de medio Print Muestra cómo aparece la página en una hoja de papel impresa.
DREAMWEAVER CS3
Guía del usuario
20
Representar tipo de medio Handheld Muestra cómo aparece la página en un dispositivo demano, como un teléfonomóvil
o un dispositivo BlackBerry.
Representar tipo de medio Projection Muestra cómo aparece la página en un dispositivo de proyección.
Representar tipo de medio TTY Muestra cómo aparece la página en un teletipo.
Representar tipo de medio TV Muestra cómo aparece la página en la pantalla de televisión.
Alternar visualización de estilos CSS Le permite activar o desactivar estilos CSS. Este botón funciona de manera
independiente a los demás botones de medios.
Para ver un tutorial sobre el diseño de hojas de estilos para impresión y dispositivos móviles, consulte
www.adobe.com/go/vid0156_es.
Véase también
“Visualización de barras de herramientas” en la página 26
Descripción general del inspector de propiedades
El inspector de propiedades permite examinar y editar las propiedades más comunes del elemento de página seleccionado
actualmente, como texto o un objeto insertado. El contenido del inspector de propiedades es distinto en función del
elemento seleccionado. Por ejemplo, si selecciona una imagen de la página, el inspector de propiedades cambiará para
mostrar las propiedades de la imagen (por ejemplo, la ruta de archivo de la imagen, el ancho y el alto de la imagen, el borde
que rodea la imagen en caso de que lo haya, etc.).
El inspector de propiedades se encuentra en el borde inferior del espacio de trabajo de forma predeterminada, pero puede
colocarlo en el borde superior del espacio de trabajo o convertirlo en un panel flotante del espacio de trabajo.
Véase también
“Acoplamiento y desacoplamiento de paneles y grupos de paneles” en la página 30
“Utilización del inspector de propiedades” en la página 28
DREAMWEAVER CS3
Guía del usuario
21
Descripción general del panel Archivos
Utilice el panel Archivos para ver y administrar los archivos del sitio de Dreamweaver.
Al visualizar sitios, archivos o carpetas en el panel Archivos, puede cambiar el tamaño del área de visualización y expandir
o contraer el panelArchivos. Cuando el panelArchivos se contrae,muestra el contenido del sitio local, el sitio remoto o el
servidor de prueba como una lista de archivos. Cuando se expande, muestra el sitio local, además del sitio remoto o el
servidor de prueba. El panel Archivos también puede mostrar un mapa visual del sitio local.
Para sitios de Dreamweaver, también puede personalizar el panel Archivos cambiando la vista (sitio local o sitio remoto)
que aparece de forma predeterminada en el panel contraído.
Véase también
“Utilización de archivos en el panel Archivos” en la página 76
DREAMWEAVER CS3
Guía del usuario
22
Introducción al panel Estilos CSS
El panel Estilos CSS le permite supervisar las reglas y propiedades CSS que afectan a un elemento de página actualmente
seleccionado (modo Actual) o las reglas y propiedades que afectan a todo un documento (modo Todo). Un botón situado
enlaparte superior delpanel EstilosCSS lepermite cambiar entre estosdosmodos. El panelEstilosCSS también le permite
modificar propiedades CSS tanto en modo Todo como en modo Actual.
Puede cambiar el tamaño de cualquiera de los paneles arrastrando los bordes que los separan.
En modo Actual, el panel Estilos CSS muestra tres secciones: un resumen del panel Selección que muestra las propiedades
deCSS de la selección actual del documento, un panel Reglas quemuestra la ubicación de las propiedades seleccionadas (o
una cascada de reglas para la etiqueta seleccionada, en función de la selección) y un panel Propiedades que le permite editar
las propiedades CSS al definir reglas para la selección.
Enmodo Todo, el panel Estilos CSSmuestra tres secciones: un panel Todas las reglas arriba y un panel Propiedades abajo.
El panel Todas las reglas muestra una lista de reglas definidas en el documento actual, así como las reglas definidas en las
hojas de estilo adjuntas al documento actual. El panel Propiedades le permite editar propiedades CSS para cualquier regla
seleccionada en el panel Todas las reglas.
Todos los cambios que realice en el panel Propiedades se aplican de forma inmediata; de este modo, puede previsualizar el
trabajo a medida que lo vaya llevando a cabo.
Véase también
“Creación y administración de CSS” en la página 118
Introducción a las guías visuales
Dreamweaver proporciona varios tipos de guías visuales para ayudarle a diseñar documentos y predecir de forma
aproximada cuál será su apariencia en los navegadores. Puede seguir uno de estos procedimientos:
• Ajustar instantáneamente el tamaño deseado para una ventana de documento y comprobar si caben los elementos en la
página.
• Utilizar una imagen de rastreo como fondo de la página para ayudarle a copiar un diseño creado en una aplicación de
edición de ilustraciones o imágenes como Adobe® Photoshop® o Adobe® Fireworks®.
• Utilizar las reglas y guías para proporcionar una pista visual que permita colocar y cambiar el tamaño de los elementos
de página con precisión.
DREAMWEAVER CS3
Guía del usuario
23
• Utilizar la cuadrícula para lograr una mayor precisión en la colocación y ajuste del tamaño de elementos con posición
absoluta (elementos PA).
Las marcas de cuadrícula de la página le ayudan a alinear los elementos PA y, cuando está activada la función de ajuste,
permiten ajustar automáticamente los elementos PA con el punto más próximo de la cuadrícula al moverlas o ajustar su
tamaño. (Los demás objetos, como las imágenes y los párrafos, no se ajustan a la cuadrícula.) El ajuste funciona
independientemente de que la cuadrícula esté visible.
Véase también
“Utilización de ayudas visuales al diseñar” en la página 163
Usuarios de GoLive
Si ha utilizado GoLive y desea cambiar a Dreamweaver, quizá desee consultar una introducción en línea al espacio y flujo
de trabajo de Dreamweaver, así como comentarios sobre formas de migrar su sitio a Dreamweaver. Para más información,
consulte http://www.adobe.com/go/learn_dw_golive_es.
Utilización de la ventana de documento
Cambio de vista en la ventana de documento
La ventana de documento permite visualizar documentos en la vista Código, en la vista Diseño o en ambas.
Véase también
“Introducción a la ventana de documento” en la página 15
Cambio a la vista Código
❖ Siga uno de estos procedimientos:
• Seleccione Ver > Código.
• En la barra de herramientas Documento, haga clic en el botón Mostrar vista de Código .
Cambio a la vista Diseño
❖ Siga uno de estos procedimientos:
• Seleccione Ver > Diseño.
• En la barra de herramientas Documento, haga clic en el botón Mostrar vista de Diseño .
Visualización de las vistas Código y Diseño
❖ Siga uno de estos procedimientos:
• Seleccione Ver > Código y diseño.
• En la barra de herramientas Documento, haga clic en el botón Mostrar vistas de Código y Diseño .
Cambio de la vista Código a la vista Diseño y viceversa
❖ Presione Control+comilla invertida (`).
Si aparecen ambas vistas en la ventana de documento, este método abreviado de teclado permite pasar de una vista a otra.
Ventanas de documento en cascada o en mosaico
Si tiene varios documentos abiertos a la vez, puede organizarlos en cascada o en mosaico.
DREAMWEAVER CS3
Guía del usuario
24
Véase también
“Elección del diseño del espacio de trabajo (Windows)” en la página 32
“Visualización de documentos en fichas (Macintosh)” en la página 32
“Almacenamiento de diseños de espacio de trabajo personalizados” en la página 33
Ventanas de documento en cascada
❖ Seleccione Ventana > Cascada.
Ventanas de documento en mosaico
• (Windows) Seleccione Ventana > Mosaico horizontal o Ventana > Mosaico vertical.
• (Macintosh) Seleccione Ventana > Mosaico.
Cambio del tamaño de la ventana de documento
La barra de estadomuestra las dimensiones actuales de la ventana de documento (en píxeles). Para diseñar una página cuyo
mejor aspecto se logra con un tamaño específico, puede ajustar la ventana de documento con cualquiera de los tamaños
predeterminados, editar dichos tamaños o crear otros nuevos.
Establecimiento de un tamaño predeterminado para la ventana de documento
❖ Elija uno de los tamaños del menú emergente Tamaño de ventana situado en la parte inferior de la ventana de
documento.
Nota: (Sólo Windows) Se puede maximizar la ventana de documento de forma que ocupe completamente la zona del
documento en la ventana integrada. Cuando una ventana de documento está maximizada, no puede cambiarse su tamaño.
El tamaño de la ventana indicado corresponde a las dimensiones internas de la ventana del navegador, sin bordes. El tamaño
delmonitor figura entre paréntesis. Por ejemplo, la opción "536 x 196 (640 x 480, Predeterminado)" es el tamaño de ventana
que se debe utilizar si los visitantes van a hacer uso de Microsoft Internet Explorer o Netscape Navigator en su
configuración predeterminada con un monitor de 640 x 480.
Si no desea asignar un tamaño tan preciso, utilice los métodos estándar de su sistema operativo, como arrastrar la esquina
inferior derecha de una ventana.
Modificación de los valores que aparecen en el menú emergente Tamaño de ventana
1 Elija Editar tamaños en el menú emergente Tamaño de ventana.
2 Haga clic en cualquiera de los valores de ancho o altura de la lista de tamaños de ventana y escriba un valor nuevo.
Para hacer que la ventana de documento se ajuste sólo a un ancho específico (sin modificar la altura), seleccione un valor
de altura y elimínelo.
3 Haga clic en el cuadro Descripción para introducir texto descriptivo sobre un tamaño específico.
Adición de un valor al menú emergente Tamaño de ventana
1 Elija Editar tamaños en el menú emergente Tamaño de ventana.
2 Haga clic en el espacio en blanco situado debajo del último valor de la columna Ancho.
3 Introduzca valores en Ancho y Altura.
DREAMWEAVER CS3
Guía del usuario
25
Para establecer sólo el Ancho o la Altura, sencillamente deje un campo vacío.
4 Haga clic en el campo Descripción para introducir el texto descriptivo sobre el tamaño añadido.
Por ejemplo, puede escribir SVGA o PC estándar junto a la entrada correspondiente a un monitor de 800 x 600 píxeles, y
Mac 17 pulg. junto a la entrada correspondiente a unmonitor de 832 x 624 píxeles. La mayoría de los monitores se pueden
ajustar a varias dimensiones de píxeles.
Definición del tamaño de ventana y la velocidad de conexión
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 Seleccione Barra de estado en la lista Categoría de la izquierda.
3 Defina cualquiera de las opciones siguientes:
Tamaños de ventana Permite personalizar los tamaños de las ventanas que aparecen en el menú emergente de la barra de
estado.
Velocidad de conexión Determina la velocidad de conexión (en kilobits por segundo) empleada para calcular el tamaño de
descarga. El tamaño de descarga de la página se muestra en la barra de estado.Cuando hay una imagen seleccionada en la
ventana de documento, aparece su tamaño de descarga en el inspector de propiedades.
Véase también
“Introducción a la barra de estado” en la página 17
“Cambio del tamaño de la ventana de documento” en la página 24
Informes en Dreamweaver
Dreamweaver permite ejecutar informes para buscar contenido, solucionar problemas o probar el contenido. Puede
generar los siguientes tipos de informes:
Buscar Permite buscar etiquetas, atributos y texto específico en las etiquetas.
Validación Permite comprobar si existen errores de código o de sintaxis.
Revisión del navegador de destino Permite probar el código HTML en los documentos para comprobar si hay alguna
etiqueta o atributo que sean incompatibles con los navegadores de destino.
Verificador de vínculos Permite encontrar y arreglar vínculos rotos, externos y huérfanos.
Informes de sitios Permite mejorar el flujo de trabajo y probar los atributos HTML del sitio. Los informes de flujo de
trabajo incluyen información sobre protección, sobre documentos modificados recientemente y sobre Design Notes; los
informes HTML incluyen etiquetas de fuentes anidadas combinables, la opción de accesibilidad, texto alternativo que falta,
etiquetas anidadas repetidas, etiquetas vacías eliminables y documentos sin título.
Registro FTP Permite ver toda la actividad de transferencia de archivos mediante FTP.
Depuración del servidor Permite ver información para depurar una aplicación Macromedia® ColdFusion® de Adobe®.
Véase también
“Búsqueda de etiquetas, atributos o texto en el código” en la página 304
“Comprobación del sitio” en la página 99
“Validación de etiquetas” en la página 311
“Comprobación de la compatibilidad con los navegadores” en la página 311
“Localización de vínculos rotos, externos y huérfanos” en la página 279
“Colocación de archivos en un servidor remoto” en la página 84
DREAMWEAVER CS3
Guía del usuario
26
“Obtención de archivos de un servidor remoto” en la página 83
“Utilización del depurador de ColdFusion (sólo Windows)” en la página 312
Utilización de barras de herramientas, menús
contextuales y paneles
Visualización de barras de herramientas
Utilice las barras de herramientas Documento y Estándar para realizar operaciones relacionadas con documentos y de
edición estándar, la barra de herramientas Codificación para insertar código rápidamente y la barra de herramientas
Representación de estilos para mostrar la página tal y como aparecería en diferentes tipos de soportes. Si lo desea, puede
seleccionar la opción de mostrar u ocultar las barras de herramientas.
• Seleccione Ver > Barras de herramientas y, después, seleccione la barra de herramientas que desee.
• Haga clic con el botón derecho del ratón (Windows) o mantenga presionada la tecla Control y haga clic (Macintosh) en
cualquiera de las barras de herramientas en el menú contextual.
Nota: Paramostrar u ocultar la barra de herramientasCodificación en el inspector de código (Ventana > Inspector de código),
debe seleccionar la barra de herramientas Codificación del menú emergente Ver opciones situado en la parte superior del
inspector.
Véase también
“Introducción a la barra de herramientas Documento” en la página 16
“Introducción a la barra de herramientas Estándar” en la página 17
“Introducción a la barra de herramientas Codificación” en la página 19
“Introducción a la barra de herramientas Representación de estilos” en la página 19
Utilización de la barra Insertar
La barra Insertar contiene botones para crear e insertar objetos como tablas e imágenes. Los botones están organizados en
categorías.
Véase también
“Introducción a la barra Insertar” en la página 18
“Edición de etiquetas mediante editores de etiquetas” en la página 302
“Selección y visualización de elementos de la ventana de documento” en la página 208
Visualización u ocultación de la barra Insertar
• Seleccione Ventana > Insertar.
• Haga clic con el botón derecho del ratón (Windows) o haga clic mientras presiona la tecla Control (Macintosh) en la
barra Insertar o en la barra de herramientas Documento, Estándar o Codificación y, a continuación, seleccione Barra
Insertar.
Nota: Si utiliza determinados tipos de archivos, como XML, JavaScript, Java y CSS, la barra Insertar y la opción vista Diseño
están atenuadas, ya que no pueden insertarse elementos en esos archivos de código.
Visualización de los botones de una categoría determinada
❖ Haga clic en los nombres de las categorías en la parte superior de la barra Insertar.
DREAMWEAVER CS3
Guía del usuario
27
Visualización del menú emergente de un botón
❖ Haga clic en la flecha abajo, situada junto al icono del botón.
Visualización de las categorías de la barra Insertar en forma de menú
❖ Haga clic con el botón derecho del ratón (Windows) o haga clic mientras presiona la tecla Control (Macintosh) en una
ficha de categoría de la barra Insertar y, a continuación, seleccione Mostrar como menús.
Visualización de las categorías de la barra Insertar en forma de fichas
❖ Haga clic en la flecha situada junto al nombre de categoría en el extremo izquierdo de la barra Insertar y, a continuación,
seleccione Mostrar como fichas.
Inserción de un objeto
1 Seleccione la categoría adecuada en el lado izquierdo de la barra Insertar.
2 Siga uno de estos procedimientos:
• Haga clic en un botón de objeto o arrastre el icono correspondiente hasta la ventana de documento.
• Haga clic en la flecha de un botón y seleccione una opción del menú.
Dependiendo del objeto de que se trate, aparecerá un cuadro de diálogo de inserción de objeto, que solicitará que se busque
un archivo o se especifiquen los parámetros del objeto. Otra posibilidad es que Dreamweaver inserte código en el
documento o abra un panel o un editor de etiquetas para especificar información antes de insertar el código.
Para algunos objetos, no aparece ningún cuadro de diálogo si se inserta el objeto en vista Diseño, pero aparece un editor de
etiquetas si se utiliza la vista Código. Con algunos objetos, al insertar el objeto en vista Diseño, Dreamweaver cambia a la
vista Código antes de insertar el objeto.
Nota:Algunos objetos, como anclajes connombre, no aparecen cuando se abre la página en la ventana deunnavegador. Puede
mostrar iconos en la vista Diseño que marquen las ubicaciones de dichos objetos invisibles.
Omisión del cuadro de diálogo de inserción de objetos e inserción de un objeto marcador de posición vacío
❖ Haga clic mientras presiona la tecla Control (Windows) u Opción (Macintosh) en el botón del objeto.
Por ejemplo, para insertar un marcador de posición para una imagen sin especificar un archivo de imagen, haga clic en el
botón Imagen mientras presiona la tecla Control u Opción.
Nota: Este procedimiento no permite omitir todos los cuadros de diálogo de inserción de objetos. Muchos objetos,
incluidas barras de navegación, elementos PA, botones Flash y conjuntos de marcos, no permiten insertar marcadores de
posición ni objetos con valores predeterminados.
Modificación de las preferencias de la barra Insertar
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 En la categoría General del cuadro de diálogo Preferencias, desactive Mostrar diálogo al insertar objetos para suprimir
cuadros de diálogo al insertar objetos como imágenes, tablas, scripts y elementos de encabezado, o mantenga presionada la
tecla Control (Windows) o la tecla Opción (Macintosh) mientras esté creando el objeto.
Cuando se inserta un objeto con esta opción desactivada, el objeto recibe valores de atributo predeterminados. Después de
insertar el objeto, utilice el inspector de propiedades para cambiar sus propiedades.
DREAMWEAVER CS3
Guía del usuario
28
Adición, eliminación o administración de archivos en la categoría Favoritos de la barra Insertar
1 Seleccione una categoría en la barra Insertar.
2 Haga clic con el botón derecho del ratón (Windows) o haga clicmientras presiona la tecla Control (Macintosh) en el área
donde aparecen los botones (no en el nombre de la categoría) y, a continuación, seleccione Personalizar objetos.
3 Realice los cambios necesarios y haga clic en Aceptar. Si no se encuentra en la categoría Favoritos, selecciónela para ver
los cambios que haya realizado.
• Para añadir un objeto, selecciónelo en el panel Objetos disponibles de la izquierda y, a continuación, haga clic en la flecha
situada entre los dos paneles o haga doble clic en el objeto en el panel Objetos disponibles.
Nota: Los objetos se añaden de uno en uno. No se puede seleccionar un nombre de categoría, como por ejemplo Común, para
añadir una categoría completa a la lista de favoritos.
• Para suprimir un objeto o separador, seleccione el objeto que desee en el panel Objetos favoritos, situado a la derecha y,
a continuación, haga clic en el botónQuite el objeto seleccionado de la lista de objetos favoritos que está encima del panel.
• Paramover un objeto, seleccione el objeto que desee en el panelObjetos favoritos, situado a la derecha, y, a continuación,
haga clic en el botón de flecha arriba o abajo que está encima del panel.
• Para añadir un separador debajo de un objeto, seleccione el objeto que desee en el panel Objetos favoritos, situado a la
derecha y, a continuación, haga clic en el botón Añadir separador que está debajo del panel.
Inserción de objetos mediante los botones de la categoría Favoritos
❖ Seleccione la categoría Favoritos en el lado izquierdo de la barra Insertar y, a continuación, haga clic en el botón
correspondiente a un objeto que haya añadido a Favoritos.
Utilización del inspector de propiedades
El inspector de propiedades permite examinar y editar las propiedadesmás comunes del elemento de página seleccionado,
como texto o un objeto insertado. El contenido del inspector de propiedades es distinto en función del elemento
seleccionado.
Nota: Utilice el inspector de etiquetas para ver y editar todos los atributos asociados con una propiedad de etiqueta
determinada.
Véase también
“Descripción general del inspector de propiedades” en la página 20
“Acoplamiento y desacoplamiento de paneles y grupos de paneles” en la página 30
“Cambio de atributos con el inspector de etiquetas” en la página 314
Visualización y ocultación del inspector de propiedades
❖ Seleccione Ventana > Propiedades.
Ampliación o contracción del inspector de propiedades
❖ Haga clic en la flecha de ampliación, situada en la esquina inferior derecha del inspector de propiedades.
Visualización y cambio de las propiedades de un elemento de página
1 Seleccione el elemento de página en la ventana de documento.
Es posible que tenga que ampliar el inspector de propiedades para ver todas las propiedades del elemento seleccionado.
2 Cambie las propiedades que desee en el inspector de propiedades.
Nota: Para información sobre propiedades específicas, seleccione un elemento en la ventana de documento y, a continuación,
haga clic en el icono de ayuda, situado en la esquina superior derecha del inspector de propiedades.
DREAMWEAVER CS3
Guía del usuario
29
3 Si los cambios realizados no se aplican inmediatamente en la ventana de documento, aplíquelos mediante uno de estos
procedimientos:
• Haga clic fuera de los campos de texto de edición de propiedades.
• Presione Intro (Windows) o Retorno (Macintosh).
• Presione el tabulador para cambiar a otra propiedad.
Utilización de menús contextuales
Los menús contextuales proporcionan acceso rápido a los comandos y las propiedades más útiles relacionados con la
ventana o el objeto con el que esté trabajando. En losmenús contextuales sólo aparecen los comandos pertinentes para la
selección actual.
1 Haga clic con el botón derecho del ratón (Windows) o haga clic mientras presiona la tecla Control (Macintosh) en el
objeto o ventana.
2 Seleccione un comando en el menú contextual.
Grupos de paneles
En Dreamweaver, los paneles se organizan en grupos. El panel seleccionado en un grupo de paneles aparece como una
ficha. Cada grupo de paneles puede ampliarse o contraerse y acoplarse o desacoplarse con otros grupos de paneles.
Los grupos de paneles también se pueden acoplar a la ventana de aplicación integrada (sólo en Windows). Esto facilita el
acceso a los paneles sin saturar el espacio de trabajo.
Nota: Cuando un grupo de paneles está flotando (desacoplado), aparece una barra en blanco estrecha en la parte superior del
mismo. En esta documentación, el término “barra de título del grupo de paneles” hace referencia al área en la que aparece el
nombre del grupo de paneles y no a esta barra en blanco estrecha.
Visualización de paneles y grupos de paneles
Si lo desea, puede mostrar u ocultar grupos de paneles y paneles en el espacio de trabajo.
DREAMWEAVER CS3
Guía del usuario
30
Ampliación o contracción de un grupo de paneles
• Haga clic en la flecha de ampliación, situada en el lado izquierdo de la barra de título del grupo de paneles .
• Haga clic en el título del grupo de paneles para contraer el grupo de paneles.
Cierre de un grupo de paneles a fin de que no aparezca en la pantalla
❖ Seleccione Cerrar grupo de paneles en el menú Opciones de la barra de título del grupo de paneles.
Cómo abrir un grupo de paneles o un panel que no se vea en la pantalla
❖ En el menú Ventana, seleccione el nombre de un panel.
Una marca de verificación al lado de un elemento de este menú indica que el elemento señalado se encuentra abierto,
aunque puede estar oculto detrás de otras ventanas.
Si no encuentra un panel, un inspector o una ventana que haya marcado como abierto, seleccione Ventana >
Organizar paneles para disponer ordenadamente todos los paneles abiertos.
Ocultación de todos los grupos de paneles
❖ Seleccione Ventana > Ocultar paneles.
Selección de un panel de un grupo de paneles ampliado
❖ Haga clic en el nombre del panel.
Visualización del menú Opciones de un grupo de paneles
❖ Amplíe el grupo de paneles haciendo clic en el nombre o en la flecha de ampliación.
El menú Opciones sólo está visible cuando el grupo de paneles está ampliado.
Algunas opciones están disponibles en el menú contextual del grupo de paneles aunque el grupo esté ampliado; haga-clic
con el botón derecho del ratón (Windows) o mientras pulsa la tecla Control (Macintosh) en la barra de título del grupo de
paneles para ver el menú contextual.
Acoplamiento y desacoplamiento de paneles y grupos de paneles
Puede mover paneles y grupos de paneles como desee, así como organizarlos para que floten en el espacio de trabajo o se
acoplen en él.
La mayoría de los paneles sólo pueden acoplarse a la derecha o a la izquierda del área de la ventana de documento del
espacio de trabajo integrado, mientras que otros (como el inspector de propiedades y la barra Insertar), sólo pueden
acoplarse al borde superior o inferior de la ventana integrada.
Nota: No podrá desacoplar el panel Archivos si está en modo ampliado. Para contraer el panel Archivos antes de desacoplarlo,
haga clic en el botón Expandir/contraer (situado en el extremo derecho de la parte superior del panel). Si cierra el panel
Archivos mientras está desacoplado, desaparece de la interfaz. Para recuperarlo, presione F8 o seleccione Ventana > Archivos.
Desacoplamiento de un grupo de paneles
❖ Arrastre el grupo de paneles por los puntos de sujeción (situados en el borde izquierdo de la barra de título del grupo
de paneles) hasta que el contorno indique que ya no está acoplado.
Nota: Si desacopla el inspector de propiedades, su formato cambia y deja de tener una barra de sujeción o barra de títulos,
aunque puede hacer clic en cualquier lugar del panel para arrastrarlo y acoplarlo de nuevo.
Minimización o restauración de un panel o un grupo de paneles
❖ Haga clic en el título subrayado del panel para minimizar el panel. Haga clic de nuevo para restaurarlo a su tamaño
completo.
DREAMWEAVER CS3
Guía del usuario
31
Cómo volver a acoplar un panel o grupo
❖ Arrastre el grupo de paneles por la barra de título hacia la parte izquierda o derecha del espacio de trabajo hasta que
aparezca un contorno negro oscuro y luego suéltelo. Es posible que tenga que arrastrarlo hacia arriba para que aparezca el
contorno negro y poder así añadirlo al conjunto de paneles ya mostrados.
Nota:Algunos paneles, como el inspector de propiedades y el panel Resultados, deben acoplarse encima o debajo de la ventana
de documento, no a la izquierda o la derecha.
Acoplamiento de un grupo de paneles a otro (espacio de trabajo flotante) o a la ventana integrada (sólo enWindows)
❖ Arrastre el grupo de paneles por la barra de sujeción hasta que su contorno indique que está acoplado.
Desacoplamiento de un panel de un grupo
❖ Seleccione Agrupar con > Nuevo grupo de paneles en el menú Opciones de la barra de título del grupo de paneles.
También puede desacoplar un panel arrastrándolo fuera del grupo de paneles.
Acoplamiento de un panel en otro grupo
1 Seleccione el panel que desee mover haciendo clic en su ficha.
2 Seleccione el grupo de paneles de destino en el submenú Agrupar con del menú Opciones del grupo de paneles.
El nombre del comando Agrupar con cambia en función del nombre del panel activo.
Cómo arrastrar un grupo de paneles flotante (desacoplado) sin acoplarlo
❖ Arrastre el grupo de paneles por la barra situada encima de su barra de título.
El grupo de paneles no se acopla mientras no se arrastre por sus puntos de sujeción.
Cambio de tamaño y de nombre de los grupos de paneles
Puede cambiar el tamaño y el nombre de los grupos de paneles en función de sus necesidades.
Cambio de tamaño de los grupos de paneles
• Para los paneles flotantes, arrastre el conjunto de grupos de paneles para ajustar su tamaño tal como lo haría con una
ventana del sistema operativo.
Por ejemplo, puede arrastrar el área de ajuste de tamaño de la esquina inferior derecha del conjunto de grupos de paneles.
• Para los paneles acoplados, arrastre la barra de separación que hay entre los paneles y la ventana de documento.
Maximización de un grupo de paneles
• Seleccione Maximizar grupo de paneles en el menú Opciones de la barra de título del grupo de paneles.
• Haga doble clic en cualquier lugar de la barra de título del grupo de paneles.
Cambio de nombre de un grupo de paneles
1 Seleccione Cambiar nombre de grupo de paneles en el menú Opciones de la barra de título del grupo de paneles.
2 Escriba el nombre nuevo y haga clic en Aceptar.
DREAMWEAVER CS3
Guía del usuario
32
Almacenamiento de grupos de paneles
Dreamweaver le permite guardar y restaurar diferentes grupos de paneles con el fin de personalizar el espacio de trabajo
para diversas actividades. Al guardar un diseño de espacio de trabajo, Dreamweaver recuerda los paneles con el diseño
especificado, así como otros atributos, como las posiciones y tamaños de los paneles, su estado contraído o ampliado, la
posición y el tamaño de la ventana de la aplicación, y la posición y el tamaño de la ventana de documento.
Véase también
“Almacenamiento de diseños de espacio de trabajo personalizados” en la página 33
Personalización del espacio de trabajo de Dreamweaver
CS3
Elección del diseño del espacio de trabajo (Windows)
Puede pasar de un espacio de trabajo a otro en cualquier momento.
❖ Seleccione Ventana > Diseño del espacio de trabajo y seleccione cualquiera de los siguientes diseños de espacio de
trabajo:
Diseñador Un espacio de trabajo integrado que utiliza MDI (Interfaz para Múltiples Documentos, Multiple Document
Interface) en el que todas las ventanas de documentos y todos los paneles están integrados en una ventana de aplicación
más grande, con los grupos de paneles apilados a la derecha.
Programador El mismo espacio de trabajo integrado que el de Diseñador, pero con los grupos de paneles apilados a la
izquierda; es un diseño similar al que utilizan Adobe®HomeSite® y ColdFusion, en el que la ventana de documentomuestra
de forma predeterminada la vista Código.
Nota: Puede acoplar los grupos de paneles a ambos lados del espacio de trabajo en cualquiera de los diseños del espacio de
trabajo.
Pantalla doble Permite organizar un diseño si dispone de un segundo monitor. Este diseño coloca todos los paneles en el
monitor secundario y mantiene la ventana de documento y el inspector de propiedades en el principal.
Elección del diseño del espacio de trabajo (Macintosh)
Puede pasar de un espacio de trabajo a otro en cualquier momento.
❖ Seleccione Ventana > Diseño del espacio de trabajo y seleccione uno de los siguientes diseños de espacio de trabajo:
Predeterminado Un espacio de trabajo integrado.
Pantalla doble Permite organizar un diseño si dispone de un segundo monitor. Este diseño coloca todos los paneles en el
monitor secundario y mantiene la ventana de documento y el inspector de propiedades en el principal.
Visualización de documentos en fichas (Macintosh)
Puede ver varios documentos en una sola ventana de documento mediante las fichas que identifican a cada uno de ellos.
También puede mostrarlos como parte de un espacio de trabajo flotante en el que cada documento aparece en su propia
ventana.
Cómo abrir un documento que se encuentra en una ficha en una ventana independiente
❖ Haga clic en la ficha con el botón derecho del ratón (Windows) o haga clic mientras presiona la tecla Control (Macintosh)
y seleccione Mover a nueva ventana en el menú contextual.
Combinación de documentos independientes en ventanas con fichas
❖ Seleccione Ventana > Combinar como fichas.
DREAMWEAVER CS3
Guía del usuario
33
Cambio de la configuración predeterminada de documento en ficha
1 Seleccione Dreamweaver > Preferencias y, posteriormente, seleccione la categoría General.
2 Seleccione o anule la selección de Abrir documentos en fichas y haga clic en Aceptar.
Dreamweaver no modifica la visualización de documentos abiertos al cambiar las preferencias. No obstante, los
documentos que se abran después de seleccionar una nueva preferencia se mostrarán conforme a la preferencia
seleccionada.
Almacenamiento de diseños de espacio de trabajo personalizados
Dreamweaver le permite guardar y restaurar diferentes conjuntos de paneles con el fin de personalizar el espacio de trabajo
para diversas actividades. Al guardar un diseño de espacio de trabajo, Dreamweaver recuerda los paneles con el diseño
especificado, así como otros atributos, como las posiciones y tamaños de los paneles, su estado contraído o ampliado, la
posición y el tamaño de la ventana de la aplicación.
Véase también
“Grupos de paneles” en la página 29
“Elección del diseño del espacio de trabajo (Windows)” en la página 32
Almacenamiento de diseños de espacio de trabajo personalizados
1 Ordene los paneles del modo que desee.
2 Seleccione Ventana > Diseño del espacio de trabajo > Guardar disposición de paneles.
3 Introduzca un nombre para el diseño y haga clic en Aceptar.
Cambio a otro diseño de espacio de trabajo personalizado
❖ Seleccione Ventana > Diseño del espacio de trabajo y seleccione el diseño personalizado.
Cambio de nombre o eliminación de un diseño de espacio de trabajo personalizado
1 Seleccione Ventana > Diseño del espacio de trabajo > Administrar.
2 Seleccione un diseño y siga uno de estos procedimientos:
• Para cambiar el nombre de un diseño, haga clic en el botón Cambiar nombre, introduzca un nuevo nombre para el diseño
y haga clic en Aceptar.
• Para eliminar un diseño, haga clic en el botón Eliminar.
Ocultación y visualización de la ventana de bienvenida
La pantalla de bienvenida aparece al iniciar Dreamweaver y siempre que no se tiene abierto ningún documento. Puede optar
por ocultar la pantalla de bienvenida y volver a mostrarla posteriormente. Cuando la pantalla de bienvenida está oculta y
no se tienen documentos abiertos, la ventana de documento está en blanco.
Ocultación de la ventana de bienvenida
❖ Seleccione en la página de inicio la opción No volver a mostrar en la pantalla de bienvenida.
Visualización de la ventana de bienvenida
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 Seleccione la opción Mostrar pantalla de bienvenida.
Personalización de Dreamweaver en sistemas multiusuario
Puede personalizar Dreamweaver para que se ajuste a sus necesidades, incluso en un sistema operativomultiusuario como
Windows XP o Mac OS X.
DREAMWEAVER CS3
Guía del usuario
34
Dreamweaver impide que la configuración personalizada de un usuario afecte a la configuración personalizada de otro
usuario. Para lograr este objetivo, la primera vez que ejecute Dreamweaver en uno de los sistemas operativos multiusuario
que reconoce, la aplicación creará copias de diversos archivos de configuración. Estos archivos de configuración se
almacenan en una carpeta de su propiedad.
Por ejemplo, en Windows XP se almacenan en C:\Documents and Settings\nombre del usuario\Application
Data\Adobe\Dreamweaver 9\Configuration (que puede estar dentro de una carpeta oculta).
En Mac OS X, se almacenan en la carpeta inicial del usuario; concretamente en Users/nombre del
usuario/Library/Application Support/Adobe/Dreamweaver 9/Configuration.
Si reinstala o actualiza Dreamweaver, Dreamweaver creará automáticamente copias de seguridad de los archivos de
configuración de usuario existentes para que, en el caso de que haya personalizado dichos archivos manualmente, continúe
teniendo acceso a los cambios realizados.
Configuración de preferencias generales para Dreamweaver
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 Defina cualquiera de las opciones siguientes:
Abrir documentos en fichas Abre todos los documentos en una sola ventana con fichas que le permiten cambiar de un
documento a otro (sólo Macintosh).
Mostrar pantalla de bienvenida Muestra la pantalla de bienvenida de Dreamweaver cuando se inicia Dreamweaver o
cuando no se tiene abierto ningún documento.
Volver a abrir documentos al iniciar Abre todos los documentos que estaban abiertos en el momento en que se cerró
Dreamweaver. Si esta opción no está seleccionada,Dreamweavermuestra la pantalla de bienvenida o una pantalla en blanco
al iniciarse (en función del valor de Mostrar pantalla de bienvenida).
Advertir al abrir archivos de sólo lectura Avisa cuando se abre un archivo de sólo lectura (bloqueado). Elija entre
desbloquear/proteger el archivo, ver el archivo o cancelar.
Actualizar vínculos al mover archivos Determina qué sucede al mover, cambiar el nombre o eliminar un documento del
sitio. Establezca esta preferencia para actualizar siempre los vínculos de manera automática, para no actualizarlos nunca o
para que se muestre un mensaje que pregunte si desea actualizarlos. (Consulte “Actualización automática de vínculos” en
la página 271.)
Mostrar diálogo al insertar objetos Determina siDreamweaver solicita la introducción de información adicional al insertar
imágenes, tablas, películas de Shockwave y otros objetos utilizando la barra Insertar o el menú Insertar. Si esta opción está
desactivada, no aparecerá el cuadro de diálogo y deberá emplear el inspector de propiedades para especificar el archivo de
origen para imágenes, el número de filas de una tabla, etc. Para imágenes de sustitución y HTML de Fireworks, siempre
aparece un cuadro de diálogo cuando inserta el objeto, independientemente de la configuración de esta opción. (Para anular
temporalmente esta configuración, haga clic mientras presiona la tecla Control (Windows) o mientras presiona la tecla
Comando (Macintosh) durante la creación e inserción de objetos.)
Permitir entrada en línea de doble byte Permite introducir texto de doble byte directamente en la ventana de documento
si utiliza un kit de lenguaje o entorno de desarrollo que facilite texto de doble byte (como los caracteres japoneses). Cuando
esta opción está desactivada, aparece una ventana para introducir y convertir texto de doble byte. El texto aparecerá en la
ventana de documento cuando sea aceptado.
Cambiar párrafo sencillo tras el encabezado Especifica que al presionar Intro (Windows) o Retorno (Macintosh) al final de
un párrafo de encabezado en la vista Diseño, se cree un nuevo párrafo con la etiqueta p. (Un párrafo de encabezado es el
que cuenta con una etiqueta de encabezado, como h1 o h2.) Si se desactiva esta opción, al presionar Intro o Retorno al final
de un párrafo de encabezado, se crea un nuevo párrafo con lamisma etiqueta de encabezado (lo que permite escribir varios
encabezados seguidos y luego volver para especificar los detalles).
Permitir múltiples espacios consecutivos Especifica que al introducir uno o varios espacios en modo Diseño, se creen
espacios indivisibles que aparecen en un navegador como espacios múltiples. (Por ejemplo, puede introducir dos espacios
entre frases, tal y como lo haría con una máquina de escribir.) Esta opción está diseñada principalmente para gente que está
acostumbrada a teclear en un procesador de textos. Si está desactivada, varios espacios se consideran un espacio único
(puesto que así lo hacen los navegadores).
DREAMWEAVER CS3
Guía del usuario
35
Utilizar y en lugar de y Especifica que Dreamweaver debe aplicar la etiqueta strong cuando realice
una acción que aplicaría normalmente la etiqueta b, y que debe aplicar la etiqueta em cuando realiza una acción que aplicaría
normalmente la etiqueta i. Estas acciones incluyen hacer clic en los botones Negrita o Cursiva en el inspector de
propiedades de texto en modo HTML y elegir Texto > Estilo > Negrita o Texto > Estilo > Cursiva. Para utilizar las etiquetas
b y i en sus documentos, desactive esta opción.
Nota: El World Wide Web Consortium desaconseja el uso de las etiquetas b y i; las etiquetas strong y em proporcionan más
información semántica que las etiquetas b y i.
Utilizar CSS en lugar de etiquetas HTML Especifica que Dreamweaver utiliza estilos CSS en lugar de etiquetas HTML al
aplicar formato al texto con el inspector de propiedades. De manera predeterminada, Dreamweaver aplica formato al texto
mediante CSS. Cada vez que se define una fuente, un tamaño o un color para una selección de texto, se crea un nuevo estilo
específico para el documento que posteriormente se encuentra disponible en el menú emergente Estilo del inspector de
propiedades. Las únicas excepciones son negrita y cursiva, para las que Dreamweaver utiliza etiquetasHTML en lugar de CSS.
Aunque el documento esté vinculado a una hoja de estilos externa, las nuevas declaraciones de estilo se escribirán en el
encabezado del documento, no en el archivo CSS.
Este comportamiento general puede ser distinto en las siguientes situaciones:
• Si el documento ya aplica formato a todo el texto mediante etiquetas font, Dreamweaver utilizará etiquetas font y
modificará la etiqueta body para utilizar código HTML.
• Si la etiqueta body del documento utiliza código HTML para establecer el aspecto de la página pero la página no usa
exclusivamente etiquetas font, Dreamweaver utilizará CSS para aplicar formato al texto.
Si anula la selección de esta opción,Dreamweaver utilizará etiquetasHTML, como, por ejemplo, etiquetas font, para aplicar
formato al texto y código HTML en la etiqueta body para establecer el aspecto de la página.
Advertir al colocar regiones editables entre etiquetas
o
- Especifica si debe mostrarse un mensaje de
advertencia al guardar una plantilla de Dreamweaver que tiene una región editable dentro de una etiqueta de párrafo o
encabezado. El mensaje indica que los usuarios no podrán crear más párrafos en la región. Está activada de manera
predeterminada.
Centrar Especifica si los elementos deben centrarse con divalign="center" o la etiqueta center al hacer clic en el botón
Alinear al centro del inspector de propiedades.
Nota:Oficialmente, a partir de la especificación HTML4.01 ya no se utiliza ninguno de estosmétodos para centrar; para poder
centrar texto, deberá utilizar los estilos CSS. A partir de la especificación XHTML1.0 de transición, ambosmétodos son todavía
válidos técnicamente, pero ya no lo son en la especificación XHTML 1.0 estricta.
Número máximo de pasos de Historial Determina el número de pasos que el panel Historial mantiene y muestra. (El valor
predeterminado suele ser válido para la mayoría de los usuarios.) Si supera el número máximo de pasos definido para el
panel Historial, se eliminarán los pasos más antiguos. (Para más información, consulte “Automatización de tareas” en la
página 658.)
Diccionario ortográfico Muestra los diccionarios ortográficos disponibles. Si un diccionario contienemúltiples variantes o
convenciones ortográficas (por ejemplo, español de México o español de Colombia), dichas variantes se enumerarán por
separado en el menú emergente Diccionario ortográfico.
Véase también
“Introducción al diseño del espacio de trabajo” en la página 13
“Actualización automática de vínculos” en la página 271
DREAMWEAVER CS3
Guía del usuario
36
Configuración de las preferencias de fuentes para documentos de Dreamweaver
La codificación de un documento determina el aspecto que tendrá en un navegador. Las preferencias de fuentes de
Dreamweaver le permiten ver una codificación determinada con la fuente y en el tamaño que prefiera. Las fuentes que elija
no afectan al aspecto que tendrá el documento cuando se muestre en un navegador. Para información sobre la
configuración de codificaciones predeterminadas para nuevos documentos, véase “Cómo crear y abrir documentos” en la
página 64.
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 Seleccione Fuentes en la lista Categoría de la izquierda.
3 Seleccione un tipo de codificación (por ejemplo, Europeo occidental o Japonés) en la lista de configuración de fuentes.
Nota: Para mostrar un idioma asiático, deberá utilizar un sistema operativo que admita fuentes de doble byte.
4 Seleccione una fuente y un tamaño para cada categoría de la codificación seleccionada.
Nota: Para que una fuente aparezca en los menús emergentes de fuentes, ésta deberá estar instalada en el equipo. Por ejemplo,
para ver texto en japonés deberá contar con una fuente japonesa instalada.
Fuente proporcional La fuente que Dreamweaver utiliza para mostrar texto normal (por ejemplo, texto en párrafos,
encabezados y tablas). El valor predeterminado depende de las fuentes que estén instaladas en el sistema. Para la mayoría
de los sistemas de Estados Unidos, el valor predeterminado es Times New Roman 12 pt. (medio) enWindows y Times 12
pt. en Mac OS.
Fuente fija La fuente que utiliza Dreamweaver para mostrar texto en etiquetas pre, code y tt. El valor predeterminado
depende de las fuentes que estén instaladas en el sistema. Para la mayoría de los sistemas de Estados Unidos, el valor
predeterminado es Courier New 10 pt. (pequeño) en Windows y Monaco 12 pt. en Mac OS.
Vista de Código La fuente utilizada para todo el texto que aparece en la vista Código del inspector de código. El valor
predeterminado depende de las fuentes que estén instaladas en el sistema.
Véase también
“Aspectos básicos de la codificación del documento” en la página 205
Personalización de colores de resaltado
Utilice las preferencias Resaltando para personalizar los colores que identifican regiones de plantillas, elementos de
biblioteca, etiquetas de terceros, elementos de diseño y código en Dreamweaver.
Véase también
“Utilización del selector de colores” en la página 211
“Cambio del color de resaltado de las etiquetas div” en la página 154
Cambio del color de resaltado
1 Seleccione Edición > Preferencias y seleccione la categoría Resaltando.
2 Haga clic en el cuadro de color situado junto al objeto al que desea cambiar de color y, a continuación, utilice el selector
de color para seleccionar un nuevo color, o especifique un valor hexadecimal.
Activación o desactivación del resaltado de un objeto
1 Seleccione Edición > Preferencias y seleccione la categoría Resaltando.
2 Active o desactive la opción Mostrar situada junto al objeto para el que desea activar o desactivar el color de resaltado.
advertencia al guardar una plantilla de Dreamweaver que tiene una región editable dentro de una etiqueta de párrafo o
encabezado. El mensaje indica que los usuarios no podrán crear más párrafos en la región. Está activada de manera
predeterminada.
Centrar Especifica si los elementos deben centrarse con divalign="center" o la etiqueta center al hacer clic en el botón
Alinear al centro del inspector de propiedades.
Nota:Oficialmente, a partir de la especificación HTML4.01 ya no se utiliza ninguno de estosmétodos para centrar; para poder
centrar texto, deberá utilizar los estilos CSS. A partir de la especificación XHTML1.0 de transición, ambosmétodos son todavía
válidos técnicamente, pero ya no lo son en la especificación XHTML 1.0 estricta.
Número máximo de pasos de Historial Determina el número de pasos que el panel Historial mantiene y muestra. (El valor
predeterminado suele ser válido para la mayoría de los usuarios.) Si supera el número máximo de pasos definido para el
panel Historial, se eliminarán los pasos más antiguos. (Para más información, consulte “Automatización de tareas” en la
página 658.)
Diccionario ortográfico Muestra los diccionarios ortográficos disponibles. Si un diccionario contienemúltiples variantes o
convenciones ortográficas (por ejemplo, español de México o español de Colombia), dichas variantes se enumerarán por
separado en el menú emergente Diccionario ortográfico.
Véase también
“Introducción al diseño del espacio de trabajo” en la página 13
“Actualización automática de vínculos” en la página 271
DREAMWEAVER CS3
Guía del usuario
36
Configuración de las preferencias de fuentes para documentos de Dreamweaver
La codificación de un documento determina el aspecto que tendrá en un navegador. Las preferencias de fuentes de
Dreamweaver le permiten ver una codificación determinada con la fuente y en el tamaño que prefiera. Las fuentes que elija
no afectan al aspecto que tendrá el documento cuando se muestre en un navegador. Para información sobre la
configuración de codificaciones predeterminadas para nuevos documentos, véase “Cómo crear y abrir documentos” en la
página 64.
1 Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
2 Seleccione Fuentes en la lista Categoría de la izquierda.
3 Seleccione un tipo de codificación (por ejemplo, Europeo occidental o Japonés) en la lista de configuración de fuentes.
Nota: Para mostrar un idioma asiático, deberá utilizar un sistema operativo que admita fuentes de doble byte.
4 Seleccione una fuente y un tamaño para cada categoría de la codificación seleccionada.
Nota: Para que una fuente aparezca en los menús emergentes de fuentes, ésta deberá estar instalada en el equipo. Por ejemplo,
para ver texto en japonés deberá contar con una fuente japonesa instalada.
Fuente proporcional La fuente que Dreamweaver utiliza para mostrar texto normal (por ejemplo, texto en párrafos,
encabezados y tablas). El valor predeterminado depende de las fuentes que estén instaladas en el sistema. Para la mayoría
de los sistemas de Estados Unidos, el valor predeterminado es Times New Roman 12 pt. (medio) enWindows y Times 12
pt. en Mac OS.
Fuente fija La fuente que utiliza Dreamweaver para mostrar texto en etiquetas pre, code y tt. El valor predeterminado
depende de las fuentes que estén instaladas en el sistema. Para la mayoría de los sistemas de Estados Unidos, el valor
predeterminado es Courier New 10 pt. (pequeño) en Windows y Monaco 12 pt. en Mac OS.
Vista de Código La fuente utilizada para todo el texto que aparece en la vista Código del inspector de código. El valor
predeterminado depende de las fuentes que estén instaladas en el sistema.
Véase también
“Aspectos básicos de la codificación del documento” en la página 205
Personalización de colores de resaltado
Utilice las preferencias Resaltando para personalizar los colores que identifican regiones de plantillas, elementos de
biblioteca, etiquetas de terceros, elementos de diseño y código en Dreamweaver.
Véase también
“Utilización del selector de colores” en la página 211
“Cambio del color de resaltado de las etiquetas div” en la página 154
Cambio del color de resaltado
1 Seleccione Edición > Preferencias y seleccione la categoría Resaltando.
2 Haga clic en el cuadro de color situado junto al objeto al que desea cambiar de color y, a continuación, utilice el selector
de color para seleccionar un nuevo color, o especifique un valor hexadecimal.
Activación o desactivación del resaltado de un objeto
1 Seleccione Edición > Preferencias y seleccione la categoría Resaltando.
2 Active o desactive la opción Mostrar situada junto al objeto para el que desea activar o desactivar el color de resaltado.
.jpg)