- Guía del usuario de Dreamweaver
- Introducción
- Dreamweaver y Creative Cloud
- Espacios de trabajo y vistas de Dreamweaver
- Configuración de sitios
- Acerca de los sitios de Dreamweaver
- Configuración de una versión local del sitio
- Conectar con servidores de publicación
- Configuración de un servidor de prueba
- Importación y exportación de la configuración de un sitio de Dreamweaver
- Traer sitios web existentes desde un servidor remoto a la raíz del sitio local
- Funciones de accesibilidad en Dreamweaver
- Ajustes avanzados
- Configuración de las preferencias de sitio para transferir archivos
- Especificación de la configuración del servidor proxy en Dreamweaver
- Sincronizar la configuración de Dreamweaver con Creative Cloud
- Uso de Git en Dreamweaver
- Administrar archivos
- Creación y apertura de documentos
- Administración de archivos y carpetas
- Carga de archivos al servidor y descarga desde el mismo
- Desprotección y protección de archivos
- Sincronizar archivos
- Comparación de archivos para detectar diferencias
- Ocultación de archivos y carpetas en el sitio de Dreamweaver
- Activación de Design Notes para sitios de Dreamweaver
- Prevención de la posible actuación repentina de Gatekeeper
- Maquetación y diseño
- Usar ayudas visuales al diseñar
- Información sobre el uso de CSS para diseñar la página
- Diseño de sitios web interactivos con Bootstrap
- Creación y uso de consultas de medios en Dreamweaver
- Presentación de contenido en tablas
- Colores
- Diseño interactivo mediante diseños de cuadrícula fluida
- Extract en Dreamweaver
- CSS
- Aspectos básicos de las hojas de estilos en cascada
- Diseño de páginas con el Diseñador de CSS
- Uso de preprocesadores de CSS en Dreamweaver
- Configuración de las preferencias de estilos CSS en Dreamweaver
- Mover reglas CSS en Dreamweaver
- Conversión de CSS en línea en una regla CSS en Dreamweaver
- Uso de etiquetas div
- Aplicación de degradados al fondo
- Creación y edición de efectos de transición de CSS3 en Dreamweaver
- Formatear código
- Contenido de página y activos
- Definición de las propiedades de la página
- Configuración de propiedades de encabezado CSS y propiedades de vínculo CSS
- Uso de texto
- Buscar y reemplazar texto, etiquetas y atributos
- Panel DOM
- Editar en la Vista en vivo
- Codificación de documentos en Dreamweaver
- Selección y visualización de elementos de la ventana de documento
- Configuración de las propiedades de texto en el inspector de propiedades
- Revisión ortográfica de una página web
- Uso de las reglas horizontales en Dreamweaver
- Añadir y modificar combinaciones de fuentes en Dreamweaver.
- Trabajo con activos
- Inserción y actualización de fechas en Dreamweaver
- Creación y gestión de activos favoritos en Dreamweaver
- Insertar y editar imágenes en Dreamweaver
- Adición de objetos multimedia
- Adición de vídeos en Dreamweaver
- Insertar vídeo HTML5
- Insertar archivos SWF
- Adición de efectos de sonido
- Insertar audio HTML5 en Dreamweaver
- Trabajar con elementos de bibliotecas
- Uso de texto árabe y hebreo en Dreamweaver
- Establecimiento de vínculos y navegación
- Widgets y efectos de jQuery
- Programación de sitios web
- Acerca de la programación en Dreamweaver
- Entorno de programación en Dreamweaver
- Configuración de las preferencias de programación
- Personalización de los colores del código
- Escritura y edición de código
- Sugerencias de código y completado de código
- Contraer y expandir código
- Reutilizar código con fragmentos
- Depuración de código mediante linting
- Optimización del código
- Edición de código en Vista de diseño
- Trabajo con el contenido de Head para páginas
- Inserción del lado del servidor incluida en Dreamweaver
- Uso de bibliotecas de etiquetas en Dreamweaver
- Importación de etiquetas personalizadas a Dreamweaver
- Uso de comportamientos de JavaScript (instrucciones generales)
- Aplicación de comportamientos JavaScript incorporados
- Acerca de XML y XSLT
- Realización de transformaciones XSL del lado del servidor en Dreamweaver
- Realización de transformaciones XSL en el lado del cliente en Dreamweaver
- Adición de entidades de caracteres para XSLT en Dreamweaver
- Formatear código
- Flujos de trabajo de varios productos
- Instalación y uso de extensiones para Dreamweaver
- Actualizaciones integradas en Dreamweaver
- Insertar documentos de Microsoft Office en Dreamweaver (solo Windows)
- Trabajo con Fireworks y Dreamweaver
- Edición de contenido en sitios de Dreamweaver con Contribute
- Integración de Dreamweaver Business Catalyst
- Crear campañas de correo electrónico personalizado
- Plantillas
- Acerca de las plantillas de Dreamweaver
- Reconocimiento de plantillas y documentos basados en plantillas
- Crear una plantilla de Dreamweaver
- Crear regiones editables en plantillas
- Creación de tablas y regiones repetidas en Dreamweaver
- Usar regiones opcionales en plantillas
- Definición de atributos de etiqueta editables en Dreamweaver
- Creación de plantillas anidadas en Dreamweaver
- Edición, actualización y eliminación de plantillas
- Exportar e importar contenido xml en Dreamweaver
- Aplicación o eliminación de una plantilla de un documento existente
- Edición de contenido en plantillas de Dreamweaver
- Reglas de sintaxis de etiquetas de plantilla en Dreamweaver
- Configuración de preferencias de resaltado en regiones de plantillas
- Ventajas de usar plantillas en Dreamweaver
- Móvil y multipantalla
- Sitios, páginas y formularios web dinámicos
- Aspectos básicos de las aplicaciones web
- Configuración del ordenador para desarrollo de aplicaciones
- Solución de problemas de conexiones a bases de datos
- Eliminación de secuencias de comandos de conexión en Dreamweaver
- Diseñar páginas dinámicas
- Introducción a las fuentes de contenido dinámico
- Definir fuentes de contenido dinámico
- Añadir contenido dinámico a las páginas
- Cambio de contenido dinámico en Dreamweaver
- Visualización de registros de bases de datos
- Proporcionar datos en vivo y solucionar sus problemas en Dreamweaver
- Añadir comportamientos de servidor personalizados en Dreamweaver
- Crear formularios con Dreamweaver
- Uso de formularios para recopilar información de los usuarios
- Crear y activar formularios de ColdFusion en Dreamweaver
- Crear formularios web
- Compatibilidad mejorada con HTML5 para elementos de formulario
- Desarrollar un formulario con Dreamweaver
- Creación visual de aplicaciones
- Creación de las páginas maestra y de detalles en Dreamweaver
- Crear páginas de búsqueda y resultados
- Crear una página de inserción de registros
- Crear una página de actualización de registros en Dreamweaver
- Creación de páginas de eliminación de registros en Dreamweaver
- Usar comandos ASP para modificar una base de datos en Dreamweaver
- Crear una página de registro
- Crear una página de inicio de sesión
- Creación de una página para acceso exclusivo de usuarios autorizados
- Protección de carpetas en ColdFusion con Dreamweaver
- Uso de componentes de ColdFusion en Dreamweaver
- Prueba, vista previa y publicación de sitios web
- Solución de problemas
Aprenda a insertar y editar objetos multimedia en páginas web de Dreamweaver, a usar Design Notes y mucho más.
Además de archivos SWF y FLV, en un documento de Dreamweaver pueden insertarse otros objetos de audio o vídeo. Si ha insertado atributos de accesibilidad con un objeto multimedia, puede establecer los atributos de accesibilidad y editar dichos valores en el código HTML.
-
Sitúe el punto de inserción en la ventana de documento en la que desea insertar el objeto.
-
Inserte el objeto siguiendo uno de estos procedimientos:
En la categoría HTML del panel Insertar y seleccione el icono para el tipo de objeto que desea insertar.
Seleccione el objeto adecuado en el submenú Insertar > HTML.
Aparecerá un cuadro de diálogo que le permitirá seleccionar un archivo origen y especificar diversos parámetros para el objeto multimedia.
Nota:Para evitar que aparezcan estos cuadros de diálogo, seleccione Edición > Preferencias > General (Windows) o Dreamweaver > Preferencias > General (Macintosh) y desactive la opción Mostrar diálogo al insertar objetos. Para anular todas las preferencias de presentación de cuadros de diálogo, mantenga presionada la tecla Control (Windows) u Opción (Macintosh) mientras inserta el objeto.
-
Seleccione las opciones del cuadro de diálogo Seleccionar archivo y haga clic en Aceptar.Nota:
Aparece el cuadro de diálogo Atributos de accesibilidad si ha elegido mostrar los atributos al insertar medios en el cuadro de diálogo Edición > Preferencias.
-
Establezca los atributos de accesibilidad.Nota:
También puede editar atributos de objetos multimedia seleccionando el objeto y editando el código HTML en la Vista de código o haciendo clic con el botón derecho del ratón (Windows) o manteniendo presionada la tecla Control y haciendo clic (Macintosh) y, a continuación, seleccionando Editar código de etiqueta.
Título
Introduzca un título para el objeto multimedia.
Clave de acceso
Introduzca un equivalente para teclado (una letra) en el cuadro de texto para seleccionar el objeto multimedia en el navegador. Esto permite al visitante del sitio utilizar la tecla Control (Windows) con la clave de acceso para acceder al objeto. Por ejemplo, si introduce B como Clave de acceso, utilice Control+B para seleccionar el objeto en el navegador.
Índice de fichas
Introduzca un número para el orden de tabulación del objeto de formulario. Configurar el orden de tabulación resulta útil cuando existen otros vínculos y objetos de formulario en la página y es preciso que el usuario se desplace a través de ellos en un orden específico. Si establece el orden de tabulación de un objeto, asegúrese de definir el orden de tabulación de todos ellos.
-
Haga clic en Aceptar para insertar el objeto multimedia.Nota:
Si pulsa Cancelar, en el documento aparece un marcador de posición de objeto multimedia pero Dreamweaver no le asocia etiquetas o atributos de accesibilidad.
Utilice el inspector de propiedades para especificar un archivo de origen o para establecer las dimensiones y otros parámetros y atributos de cada objeto. Puede editar los atributos de accesibilidad de un objeto.
Inicio de un editor externo de archivos multimedia
Puede iniciar un editor externo desde Dreamweaver para editar la mayoría de los archivos multimedia. También es posible especificar el editor que Dreamweaver debe iniciar para editar el archivo.
-
Asegúrese de que el tipo de archivo esté asociado a un editor de su sistema.
Para averiguar qué editor está asociado a cada tipo de archivo, seleccione Edición > Preferencias en Dreamweaver y elija Tipos de archivo/editores de la lista Categoría. Haga clic en la extensión de archivo de la columna Extensiones para ver el editor o (editores) asociado en la columna Editores. Puede cambiar el editor asociado a un determinado tipo de archivo.
-
Haga doble clic en el archivo multimedia del panel Archivos para abrirlo en el editor externo.
El editor que se inicia al hacer doble clic en el archivo del panel Archivos se denomina editor principal. Si hace doble clic en un archivo de imagen, por ejemplo, Dreamweaver ejecutará el archivo en el editor de imágenes externo principal, como Adobe Fireworks.
-
Si no desea utilizar el editor externo principal para editar el archivo, puede utilizar otro editor del sistema para ello, siguiendo uno de estos procedimientos:
En el panel Archivos, haga clic con el botón derecho del ratón (Windows) o mantenga presionada la tecla Control y haga clic (Macintosh) en el archivo y elija Abrir con en el menú contextual.
En la vista de Diseño, haga clic con el botón derecho del ratón (Windows) o mantenga presionada la tecla Control y haga clic (Macintosh) en el elemento multimedia de la página actual y, a continuación, seleccione Editar con en el menú contextual.
Especificación del editor que se iniciará desde Dreamweaver
Puede especificar el editor que utilizará Dreamweaver para editar cada tipo de archivo y añadir o eliminar los tipos de archivo reconocidos por Dreamweaver.
Especificación explícita de los editores externos que deben iniciarse para un tipo de archivo determinado
-
Seleccione Editar > Preferencias y elija Tipos de archivo/editores de la lista Categoría.
Las extensiones de nombres de archivo, como .gif, .wav y .mpg, aparecen a la izquierda, bajo Extensiones. Los editores asociados a una extensión seleccionada figuran en la parte derecha, bajo Editores.
-
Elija la extensión del tipo de archivo en la lista Extensiones y siga uno de estos procedimientos:
Para asociar un nuevo editor al tipo de archivo, haga clic en el botón de signo más (+) situado sobre la lista Editores y seleccione las opciones deseadas en el cuadro de diálogo que aparece.
Por ejemplo, puede seleccionar el icono de aplicación de Acrobat para asociarlo a ese tipo de archivos.
Para convertir un editor en el editor principal de un tipo de archivo determinado (es decir, en el editor que se abrirá al hacer doble clic en el tipo archivo en el panel Archivos), seleccione el editor en la lista Editores y haga clic en Convertir en principal.
Para anular la asociación de un editor con un tipo de archivo, seleccione el editor en la lista Editores y haga clic en el botón de signo menos (-) situado sobre la lista Editores.
Adición de un nuevo tipo de archivo y el editor asociado correspondiente
-
Haga clic en botón de signo más (+) situado sobre la lista Extensiones e introduzca una extensión de tipo de archivo (incluido el punto inicial de la extensión) o varias extensiones relacionadas separadas entre sí por un espacio.
Por ejemplo, puede introducir .xml .xsl si desea asociar estas extensiones al editor XML instalado en el sistema.
-
Seleccione un editor para el tipo de archivo; para ello haga clic en el botón de signo más (+) situado sobre la lista Editores y seleccione las opciones deseadas en el cuadro de diálogo que aparece.
Eliminación de un tipo de archivo
-
Seleccione el tipo de archivo en la lista Extensiones y haga clic en el botón de signo menos (-) situada sobre dicha lista.Nota:
La eliminación de un tipo de archivo no se puede deshacer. Por tanto, asegúrese antes de ejecutarla.
Utilización de Design Notes con objetos multimedia
Al igual que ocurre con otros objetos de Dreamweaver, puede añadir Design Notes a un objeto multimedia. Design Notes son notas asociadas a un archivo determinado que se almacenan en un archivo independiente. Puede utilizar Design Notes para mantener información adicional de los archivos asociada a los documentos, como los nombres de los archivos de imagen y comentarios sobre el estado del archivo.
-
Haga clic con el botón derecho (Windows) o mantenga presionada la tecla Control y haga clic (Macintosh) en el objeto de la ventana de documento.Nota:
Deberá definir el sitio antes de añadir Design Notes a ningún objeto.
-
Elija Design Notes para la página en el menú contextual.
-
Introduzca la información deseada en la Design Note.Nota:
También puede añadir una Design Note a un objeto multimedia desde el panel Archivos seleccionando el archivo, abriendo el menú contextual y eligiendo Design Notes en el menú contextual.
Adición de vídeo (no FLV)
Puede añadir vídeo a su página Web de distintas formas y empleando diferentes formatos. El vídeo puede descargarse al usuario o reproducirse en flujo (streaming) mientras se descarga.
-
Coloque el videoclip en la carpeta del sitio.
Estos videoclips suelen tener el formato de archivo AVI o MPEG.
-
Establezca un vínculo con el videoclip o incrústelo en la página.
Para establecer un vínculo con el videoclip, introduzca un texto para el vínculo, como “Descargar videoclip”, seleccione el texto y haga clic en el icono de carpeta del inspector de propiedades. Localice la ubicación del archivo de vídeo y selecciónelo.
Nota:El usuario debe descargarse una aplicación auxiliar (un complemento) para ver los formatos de flujo más habituales, como por ejemplo Real Media, QuickTime o Windows Media.
Inserción de contenido de complementos
Puede crear contenido, como una película QuickTime para un complemento de navegador, y después utilizar Dreamweaver para insertar dicho contenido en un documento HTML. RealPlayer y QuickTime son complementos muy comunes; además, algunos archivos de contenido incluyen archivos en formato MP3 y películas QuickTime.
Es posible obtener vistas previas de películas y animaciones que emplean complementos de navegador directamente en la vista de Diseño de la ventana de documento. Puede reproducir todos los elementos de complementos a la vez para ver el aspecto que presentará la página ante el usuario, o bien puede reproducirlos uno por uno para asegurarse de que se han incrustado los elementos multimedia correctos.
No es posible obtener vistas previas de películas o animaciones que empleen controles ActiveX.
Tras insertar contenido para un complemento, utilice el inspector de propiedades para establecer los parámetros de dicho contenido. Para ver las siguientes propiedades en el inspector de propiedades, seleccione un objeto de complemento.
El inspector de propiedades muestra inicialmente las propiedades utilizadas con mayor frecuencia. Haga clic en la flecha de ampliación, situada en la esquina inferior derecha, para ver todas las propiedades.
Inserción de contenido de complementos y configuración de sus propiedades
-
En la Vista de diseño de la ventana de documento, sitúe el punto de inserción en el lugar donde desea insertar el contenido y luego siga uno de estos procedimientos.
En la categoría Común del panel Insertar, haga clic en el botón Media y seleccione el icono Complemento del menú.
Seleccione Insertar > Media > Complemento.
-
En el cuadro de diálogo que aparece, seleccione un archivo de contenido para un complemento y haga clic en Aceptar.
-
Establezca las opciones de complemento en el inspector de propiedades.
Nombre
Especifica un nombre para identificar el complemento en los scripts. Introduzca un nombre en el cuadro de texto sin título que aparece a la izquierda del inspector de propiedades.
An (Anchura) y Al (Altura)
Especifican, en píxeles, el ancho y el alto que se han asignado al objeto en la página.
Origen
Especifica el archivo de datos de origen. Haga clic en el icono de carpeta para localizar un archivo o escriba un nombre de archivo.
URL plg
Especifica el URL del atributo pluginspace. Introduzca el URL completo del sitio desde el que los usuarios pueden descargar el complemento. Si el usuario que está viendo la página no tiene el complemento, el navegador intentará descargarlo desde este URL.
Alinear
Determina cómo se alineará el objeto en la página.
Espacio V y Espacio H
Especifican el número de píxeles de espacio en blanco que habrá por encima, por debajo y a ambos lados del complemento.
Borde
Especifica el ancho del borde alrededor del complemento.
Parámetros
Abre un cuadro de diálogo para introducir parámetros adicionales y transferirlos al complemento. Muchos complementos responden a parámetros especiales.
También puede ver los atributos asignados al complemento seleccionado haciendo clic en el botón Atributo. En este cuadro de diálogo puede editar, añadir o eliminar atributos como el de ancho y el de alto.
Reproducción del contenido de complementos en la ventana de documento
-
Inserte uno o varios elementos multimedia mediante uno de los métodos descritos en la sección anterior.
-
Siga uno de estos procedimientos:
Seleccione uno de los elementos multimedia que ha insertado y seleccione Ver > Complementos > Reproducir o haga clic en el botón Reproducir del inspector de propiedades.
Seleccione Ver > Complementos > Reproducir todo para reproducir todos los elementos multimedia de la página seleccionada que emplean complementos.
Nota:La opción Reproducir todo se aplica al documento actual, no a otros documentos de un conjunto de marcos, por ejemplo.
Interrupción de la reproducción del contenido de complementos
-
Seleccione un elemento multimedia y seleccione Ver > Complementos > Detener o haga clic en el botón Detener del inspector de propiedades.
También es posible seleccionar Ver > Complementos > Detener todo para detener totalmente la reproducción del contenido del complemento.
Solución de problemas de complementos
Si ha seguido los pasos indicados para reproducir contenido de complementos en la ventana de documento pero parte del contenido de complementos no se reproduce, intente los procedimientos siguientes:
Asegúrese de que el complemento asociado está instalado en el ordenador y que el contenido es compatible con la versión del complemento que usted tiene.
Abra el archivo Configuration/Plugins/UnsupportedPlugins.txt en un editor de texto y compruebe si en la lista aparece el complemento en cuestión. Este archivo contiene información sobre aquellos complementos que pueden causar problemas en Dreamweaver y, por tanto, no se admiten. (Si algún complemento concreto ocasiona problemas, es recomendable añadirlo a este archivo).
Compruebe si el sistema dispone de suficiente memoria. Algunos complementos necesitan entre 2 y 5 MB adicionales para poder ejecutarse.
Uso de comportamientos para controlar elementos multimedia
Puede añadir comportamientos a su página para iniciar y detener diversos objetos multimedia.
Controlar Shockwave o Flash
Permite reproducir, detener, rebobinar o ir a un fotograma de una película Shockwave o un archivo SWF.
Reproducir sonido
Permite reproducir sonido; por ejemplo, puede reproducir un efecto sonoro cuando el usuario mueva el puntero del ratón sobre un vínculo.
Comprobar complemento
Permite comprobar si los visitantes del sitio disponen del complemento necesario y luego los guía a URL distintos en función de si disponen o no del complemento adecuado. Esto solo es aplicable a los complementos, ya que el comportamiento Comprobar complemento no comprueba los controles ActiveX.
Utilización de parámetros para controlar objetos multimedia
Definir parámetros especiales para controlar archivos SWF y complementos. Los parámetros se utilizan con las etiquetas object, embed y applet. Los parámetros establecen atributos específicos para diferentes tipos de objetos. Por ejemplo, un archivo SWF puede utilizar un parámetro de calidad <paramname="quality"value="best"> para la etiqueta de objeto. El cuadro de diálogo Parámetro está disponible en el inspector de propiedades. Véase la documentación correspondiente al objeto que está usando para obtener información sobre los parámetros necesarios.
No existe ningún estándar universalmente aceptado para identificar los archivos de datos de los controles ActiveX. Consulte la documentación del control ActiveX que esté usando para averiguar qué parámetro debe emplear.
Introducción de un nombre y un valor para un parámetro
-
Seleccionar un objeto que acepte parámetros en la ventana de documento.
-
Abra el inspector de propiedades si aún no está abierto y haga clic en el botón Parámetros que se encuentra en la mitad superior del inspector de propiedades. Compruebe que el inspector de propiedades está ampliado.
-
Haga clic en el botón de signo más (+) e introduzca el nombre y el valor del parámetro en las correspondientes columnas.
Eliminación de un parámetro
-
Seleccione un parámetro y presione el botón de signo menos (-).
Reordenación de parámetros
-
Seleccione un parámetro y utilice los botones de flecha arriba y abajo.