A juzgar por la situación actual, se puede decir que las funciones integradas de Dreamweaver son cada vez más abundantes, ricas y completas. Aquí me gustaría presentarles algunos consejos de aplicación en la versión 4.0.
1. Haga que las páginas web sean más flexibles.
Algunos desarrolladores web llaman líquida a la técnica que se presenta a continuación, pero aquí la llamo elástica (técnica de extensión flexible). Esta es una técnica que puede ajustar el tamaño de la página web cuando cambia el tamaño de la ventana del navegador del visitante. Por lo tanto, si la ventana es demasiado grande, no habrá espacios en blanco, y si la ventana es demasiado pequeña, la ventana arriba y. La barra que se mueve hacia abajo no aparecerá en el borde. De hecho, la mayoría de las páginas web simples ajustarán automáticamente el tamaño de la página de acuerdo con el tamaño de la ventana del navegador. Sin embargo, si se utilizan muchos marcos y tablas diferentes en la página web, será difícil que el tamaño de la página web sea automático. ajustado de forma flexible. Por lo general, los diseñadores web utilizan una combinación de marcos de ancho de columna fijo e imágenes GIF como intervalos para diseñar páginas web. De esta manera, ya sea que utilicen Internet Explorer o Mac, el tamaño de la página será fijo y no se escapará. Con Dreamweaver 4.0, puede diseñar fácilmente páginas web que se ajusten automáticamente de forma flexible. ¿Cómo hacerlo?
Abra la página web usando los botones de la paleta Objeto y cambie a la vista Diseño. En este momento, puede ver el ancho de la columna del cuadro de texto. Hay una pequeña flecha desplegable en el medio del cuadro encima de cada columna. Seleccione la flecha pequeña encima de la columna en la que desea configurar la visualización flexible. luego seleccione "Hacer que la columna sea flexible" (Hacer que la columna se estire automáticamente). (Establezca el ajuste automático del ancho de la columna para que se limite a una columna). En este momento, aparecerá una línea ondulada encima del cuadro de la columna en lugar del número original que indica el ancho de la columna. Dreamweaver creará automáticamente un archivo de imagen en blanco con diseño fijo. Este archivo de imagen en blanco está representado por dos largas tablas en blanco encima de las columnas. De esta manera, el diseño se completará automáticamente y se completará la configuración del diseño flexible. (Cuando agregue un archivo de imagen en blanco por primera vez, aparecerá un cuadro de diálogo que le preguntará si desea utilizar el archivo de imagen incorporado. Para obtener el mejor efecto, le recomiendo que deje que Dreamweaver genere uno automáticamente; de lo contrario, no es necesario utilizar un archivo de imagen en blanco para completar el diseño).
2. Cree una paleta de colores personalizada.
El nuevo panel Activos de Dreamweaver 4.0 es una nueva herramienta que puede administrar archivos según tipos de archivos, como imágenes, plantillas, etc. ., al editar un sitio web Cuando define un nuevo sitio web (Seleccionar sitio · Nuevo sitio), todos los tipos de componentes se agregarán automáticamente a los cuadros correspondientes en el panel Activos. Este nuevo panel de Activos también tiene un cuadro de color en el panel de control de propiedades, que almacena todos los colores utilizados en su sitio web, incluidos los colores del texto, los colores de fondo y los colores de los enlaces. Esta es una paleta de colores orientada a sitios web y adaptada a los usuarios. Simplemente active el panel Activos (seleccione primero Ventana, luego Activos), luego seleccione la pequeña barra de desplazamiento de color a la izquierda y verá una variedad de opciones de color para su sitio web. Por supuesto, puedes aplicar estos colores a cierto texto seleccionado. Incluso cuando seleccione un color, el valor hexadecimal del color y el código correspondiente de tres colores (RGB) aparecerán en la pantalla. Si desea reducir el tamaño de la barra de herramientas de su paleta, puede incluso agregar solo ciertos colores a los Favoritos de su paleta. Simplemente resalte el color seleccionado, seleccione un botón llamado "Agregar a Mis favoritos" en la ventana (el botón inferior derecho) y listo.
3. Crear un
sistema de navegación de menú emergente Originalmente, crear un sistema de navegación de menú emergente requería algunas habilidades de sintaxis de JavaScript, pero si tiene instalado Dreamweaver/Fireworks Studio, es fácil de hacer. Primero comience en Fireworks, seleccione una imagen y luego seleccione Insertar·Menú emergente en el cuadro de diálogo Establecer menú emergente. Puede ingresar el nombre de los elementos y seleccionar el botón Más para agregar el proyecto. Puede continuar realizando configuraciones detalladas en el cuadro de mensaje emergente, como configurar el texto y los enlaces que se usarán para el elemento. Por supuesto, también puede agregar submenús y reorganizar la configuración para el siguiente nivel. Cuando termine, seleccione Siguiente para continuar configurando preferencias como colores, fuentes y más. Una vez completado el menú, puede obtener una vista previa de la sintaxis HTML y de la imagen. Luego seleccione Finalizar. En este momento, cuando el mouse se mueva al patrón original, aparecerá una lista del contenido del sistema de menú. Luego, cuando exporte el archivo creado, Fireworks generará automáticamente todos los archivos HTML, JavaScript y de imagen que Dreamweaver necesita.
4. ¡Haz que el archivo de imagen se mueva!
Si tienes instalado Dreamweaver/Fireworks Studio al mismo tiempo, te sorprenderá la combinación perfecta de estos dos productos. Incluso si no es un diseñador gráfico profesional, aún desea modificar algunos archivos de imágenes GIF para hacerlos más vívidos al diseñar páginas web. ¡Dreamweaver te permite crear animaciones sin preguntarle a nadie! Seleccione la imagen que desea modificar en la ventana estándar y luego seleccione el botón Editar en el Inspector de propiedades. Si Fireworks se incluye con su instalación de Dreamweaver, Fireworks es el editor de imágenes predeterminado de Dreamweaver y las imágenes se cargarán automáticamente en Fireworks. (Si observa detenidamente, encontrará que texto y gráficos como Editar desde Dreamweaver aparecerán en la pantalla de Fireworks, lo que indica que puede editar imágenes desde Dreamweaver). Bien, ahora seleccione la imagen que desea editar en Fireworks y seleccione Modificar. Animar ·Animar selección. A continuación, complete la configuración en el cuadro de diálogo Animar, seleccione el número de fotogramas para la animación, la dirección del movimiento de la animación, la transparencia, etc. También puede seleccionar la barra de herramientas Marcos para establecer la velocidad de movimiento y seleccionar el panel Objeto para cambiar la configuración. Para exportar el archivo, simplemente seleccione la barra de herramientas Optimizar y seleccione GIF animado como tipo de archivo. Una vez completado, Fireworks exportará automáticamente la imagen con la configuración optimizada, actualizará automáticamente el archivo de imagen GIF y mostrará el archivo de imagen actualizado en Dreamweaver. Seleccione Archivo · Vista previa en el navegador, para que pueda obtener una vista previa de la hermosa imagen que acaba de crear en el navegador.
5. Haga que el botón tenga un efecto de parpadeo.
En Dreamweaver, puede crear un objeto de botón Flash con un efecto de parpadeo sin tener un programa Flash. La versión 4.0 tiene varios objetos de botón Flash integrados, que pueden crear varias formas diferentes de botones. Seleccione Insertar·Imágenes interactivas·Botón Flash para ver qué botones integrados están disponibles. Incluso puede usar el mouse para señalar el formulario de botón que desea usar en el cuadro de diálogo y luego ver cómo funciona en el navegador. Utilice el cursor del mouse para seleccionar el formato del botón que desea usar y luego ingrese los parámetros en secuencia, como el texto, la fuente, el color, el enlace, etc. en el botón o un nombre de archivo personalizado. Presione Aceptar. A continuación, se generará un archivo SWF y se colocará automáticamente en su página web. Haga clic en el archivo completado y verá las propiedades del archivo mostradas en el Inspector de propiedades. Al mostrar los atributos del archivo, si expande la lista de atributos del archivo, aparecerá un botón Reproducir. Después de seleccionarlo, podrá obtener una vista previa del efecto parpadeante del botón sin abrir el navegador.
6. Cree texto fluido.
Agregar texto fluido a una página web es tan fácil como agregar el botón Flash que acabo de presentar. Del mismo modo, no necesita instalar Flash, puede hacerlo fácilmente con las nuevas funciones proporcionadas por Dreamweaver 4.0. Los creadores de páginas web que suelen utilizar la sintaxis HTML para escribir páginas web y no tienen experiencia en medios interactivos pueden crear fácilmente texto fluido y compacto en forma de Flash. Según Macromedia, el 97% de los usuarios de Internet pueden ver páginas web con efectos Flash, por lo que esta nueva característica puede agregar algo de interactividad a la navegación y lectura de páginas web sin agregar problemas de compatibilidad. Seleccione Insertar · Imágenes interactivas · Texto Flash y luego complete la configuración de preferencias una por una (como el texto, estilo de fuente, color de fuente, tamaño de fuente, etc. cuyo efecto desea cambiar).