Consejos de diseño web de Dreamweaver

Los internautas que estén familiarizados con el diseño web sabrán que hay muchas formas de llamar al estilo. Podemos llamar al estándar de estilo haciendo clic con el botón derecho del mouse y seleccionando Estilo personalizado, o seleccionando. la lista de elementos en la barra de estado. Haga clic derecho para invocar Estilo. Aunque los efectos logrados por diferentes métodos parecen ser los mismos, los códigos HTML producidos son en realidad completamente diferentes. Por ejemplo, si usa Custon Style para llamar al estándar de estilo, se generará una etiqueta en el código de la página web, lo que hará que el archivo esté muy inflado y afectará la velocidad de análisis del navegador. Por lo tanto, deberíamos intentar usar el. Etiqueta "span" en la barra de estado tanto como sea posible. Lista de elementos para llamar Estilo.

2. Aproveche al máximo el comando Formatear tabla

En diseño web complejo, también podemos usar el comando Formatear tabla para llamar Estilo. p>En el diseño web complejo, las tablas se utilizan con mayor frecuencia, porque las tablas se pueden usar para controlar libremente las posiciones específicas del texto y las imágenes en la página web, haciendo que toda la página web parezca compacta y unificada. Dreamweaver no se queda atrás en este sentido. Podemos utilizar el comando "Formatear tabla" para aplicar rápidamente estilos prediseñados a la tabla. Para utilizar un estilo prediseñado, primero coloque el cursor en cualquier celda de la tabla, luego seleccione el comando "Comando" → "Formatear tabla" y, en el cuadro de diálogo siguiente, seleccione un diseño de la lista en el plano de la izquierda. Presione el botón "Aplicar" para ver el resultado. Si no está satisfecho, también puede restablecer o modificar algunos valores de parámetros, como el grosor del borde, el color de fondo, etc.

3. Enlace a dos páginas al mismo tiempo

Todos sabemos que un hipervínculo sólo puede conectar a una página a la vez. Si queremos abrir el documento en una página de marco diferente, podemos usar el comportamiento de JavaScript "Ir a URL". Abra una página de marco, seleccione texto o una imagen y seleccione Ir a URL en el panel Comportamientos. Descubriremos que Dreamweaver muestra todos los marcos disponibles en el cuadro de diálogo "Ir a URL". Seleccione uno de los marcos a los que queremos vincular e ingrese la URL correspondiente, luego seleccione el otro marco e ingrese otra URL.

4. No le dé nombres chinos a los archivos

Después de crear una página web, generalmente le damos un nombre chino representativo para que la gente pueda leer el archivo. el contenido del archivo por su nombre y, en segundo lugar, puede facilitar las llamadas mutuas entre varios hipervínculos. Pero si hace esto en Dreamweaver, encontrará que la compatibilidad de Dreamweaver con los nombres de archivos chinos no es muy buena y, a menudo, se producen llamadas de página incorrectas. Por lo tanto, después de guardar la página web en Dreamweaver, intente utilizar inglés o números como archivo. nombre, esto puede evitar el fenómeno de error anterior.

5. Establezca la resolución de fuente con habilidad

Cuando creamos páginas web, a menudo tenemos esta experiencia, es decir, las páginas web creadas son normales cuando se navegan en la computadora local, pero Cuando Al navegar en otra computadora, descubrí que la hermosa página web original estaba torcida. ¿Por qué? Resulta que la resolución de cada computadora es diferente para que su página de inicio se muestre normalmente en diferentes resoluciones, existe una solución mejor en Dreamweaver. En la esquina inferior derecha de la ventana del documento, Dreamweaver muestra el tamaño de resolución para el que está diseñado el documento actual. Haga clic en qué número y podrá especificar la resolución de visualización de la página actual en el menú emergente. Puede hacer que su página de inicio sea más flexible modificándola. Esto permite que las pantallas con diferentes resoluciones se muestren mejor.

6. Ocultar etiquetas inteligentemente

Si se inserta un elemento invisible en la página web, Dreamweaver agregará automáticamente una etiqueta correspondiente al elemento en la página, para que podamos elegir. ocultarlo elemento.

Pero esto no es del todo bueno. Por ejemplo, cuando insertamos muchas capas en una tabla en la primera fila de la página, encontraremos que hay demasiadas etiquetas de elementos de capa dispuestas en la primera fila y la tabla regresará automáticamente. en la segunda fila de páginas, si bien no afecta al efecto a la hora de navegar, sí dificulta nuestro trabajo. Por lo tanto, cuando sentimos que las etiquetas de elementos están en el camino, es fácil bloquearlas. El método es presionar Ctrl + U para abrir el panel de preferencias, seleccionar Elementos invisibles en la categoría y todas las etiquetas de los elementos aparecerán en el lado derecho del panel. Simplemente elimine la marca de verificación delante de las etiquetas de elementos innecesarios para asegurarse de que no vuelvan a aparecer en el futuro.

7. Haz buen uso de las habilidades de arrastrar y soltar

Cuando usamos Dreamweaver para editar páginas web, a menudo necesitamos insertar algunas imágenes o algo así. muchas imágenes, será muy problemático seguir el método convencional. Podemos utilizar la tecnología de arrastrar y soltar para resolver este problema. Primero, convertimos la ventana de operación de Dreamweaver en una ventana activa, liberamos espacio para mostrar la ventana del administrador de recursos, buscamos los archivos de imagen que se insertarán y los arrastramos uno por uno a la ubicación adecuada en la página web de Dreamweaver. insertará automáticamente estas imágenes. La URL se agrega al código HTML del archivo. Por supuesto, se requiere que el archivo de imagen arrastrado sea un archivo en formato de imagen web como gif, jpg, etc. Lo mismo ocurre con las imágenes que ya están en la página web, simplemente arrástrelas. Pero si hay un hipervínculo en la imagen arrastrada, ya no puede usar la tecnología de arrastre, porque en este momento solo se arrastra la dirección del hipervínculo.

8. Establecer automáticamente la hora de actualización

Sabemos que si una página web quiere obtener más volumen de operaciones, es muy importante actualizarla constantemente. Pero para nuestras páginas web personales, puede que no sea fácil actualizarlas a tiempo todos los días. Por lo tanto, esperamos que la página web se pueda actualizar automáticamente. El siguiente autor proporcionará un código fuente que puede actualizar automáticamente la hora de modificación. Solo necesitamos agregar este código fuente a ＜/BODY＞ para lograr el propósito de actualizar la hora. :

＜Script Language="JavaScript"> ＜/script> En segundo lugar, haga clic en Texto/Estilo personalizado/Editar/Hoja de estilo/Nuevo/Redefinir etiqueta HTML en Dreamweaver con el mouse y seleccione y luego en decoración No seleccione ninguno y finalmente haga clic en Aceptar para tener éxito.

12. Copiar texto inteligentemente

Copiar texto entre varias aplicaciones diferentes es algo que quizás tengamos que hacer en el trabajo real. Sin embargo, si copiamos texto del área de edición de Dreamweaver a otra aplicación, el código HTML y el texto se copiarán juntos. ¿Cómo podemos copiar solo el texto en el área de edición? Sabemos que la copia generalmente se realiza mediante la tecla de acceso directo Ctrl-C. Si presionamos una tecla C más al copiar, Dreamweaver solo copiará el texto seleccionado.

13. Hacer un buen uso de las teclas de método abreviado

Para mejorar la eficiencia de la operación, podemos usar teclas de método abreviado en Dreamweaver, como usar Ctrl-B o Ctrl-I para aplicar negrita. o cursiva al formato de texto, también puede aplicar formato HTML al texto seleccionado usando algunos de los siguientes métodos abreviados de teclado: Ctrl-0: sin formato Ctrl-T: Ctrl-1: Título 1 Ctrl-2: Título 2 Ctrl-3: Título 3 Ctrl-4: Título 4 Ctrl-5: Título 5 Ctrl-6: Título 6

14. Cerrar automáticamente la página

Si queremos cerrar automáticamente la página a una hora determinada. , es posible que necesitemos agregarlo al código fuente de la página. Agregue el siguiente código después de la etiqueta. Código: ＜ script LANGUAGE="JavaScript"＞ ＜ /script＞ El 3000 en el código significa 3 segundos y la unidad es milisegundos.

15. Establece el nombre del objeto de forma inteligente

Cuando usamos Dreamweaver para crear efectos muy complejos, es posible que necesitemos reutilizar uno o más objetos. Por ejemplo, a menudo necesitamos hacerlo. colocar un formulario, imágenes, etc. Si no nombramos varios objetos en la página web, puede resultar muy problemático o difícil de usar al aplicar estos objetos repetidamente. Si no nombramos los objetos en nuestras páginas web, puede resultar engorroso o propenso a errores aplicarlos repetidamente. Para facilitar la llamada a estos objetos, cuando creamos nuevos objetos, debemos recordar darles un nombre representativo y fácil de recordar. A la hora de nombrar estos objetos, podemos hacerlo desde el panel de propiedades del objeto.

16. Añadir efectos dinámicos a enlaces de imágenes

A veces queremos lograr un efecto realista y esperamos que cuando el mouse se mueva hacia un enlace, produzca una sensación de movimiento. Este efecto es fácil de lograr con Dreamweaver. Al diseñar, primero debemos preparar dos imágenes, la primera es la imagen original y la segunda es la imagen después de pasar el mouse sobre ella. Luego haga clic en la primera imagen con el mouse, complete el archivo de enlace en la columna de enlace del panel de propiedades, haga clic en la tecla F8 en el teclado, haga clic en el signo "+" en la ventana de comportamiento emergente y luego seleccione "Intercambiar Imágenes". Seleccione la segunda imagen en la siguiente ventana y haga clic en Aceptar.