ubiquitour.com

Tutorial de diseño de Dreamweaver

El programa de software gráfico Dreamweaver se utiliza para crear páginas web atractivas. Las páginas se construyen usando el programa "vista de la composición" que consiste en editar y bloques no editables, conocidas como células, llenan de códigos contemplados como HTML. Las células no editable compartirán la disposición básica, gráficos y menús que el artista quiere repetido en todas las páginas del sitio Web. Las células editables permite el artista gráfico añadir distintos contenidos de cada página. Una vez que se realiza un cambio en la celda no editable, Dreamweaver cambiará automáticamente las páginas en las páginas web, ahorrando el tiempo de artista evitando realizar estos ajustes por página.

Instrucciones

1 Escoja la "vista Diseño" en la "paleta de objetos." Será necesario hacer clic en abrir el "dibujar" tabla de diseño.

Su programa de software debe instalarse en su computadora personal para activar todas las funciones.

2 Dibujar una tabla, denominada células, y activando la herramienta "Dibujar tabla de diseño". Las células contienen contenido como fotos o descripciones para su sitio Web. El espesor de la tabla será redimensionado y ajustado en un paso posterior.

3 Continúe añadiendo las células para su diseño según cuántas imágenes y bloques de texto incluirá las páginas. Tenga en cuenta que tendrá que seguir activar la herramienta de mesa de diseño de sorteo para cada tabla adicional en la página de diseño. Por ejemplo, agregar una tabla de banner en la parte superior de la página, una tabla de contenido, una tabla anidada para su barra de navegación y una tabla de la imagen opcional.

4 Cambiar el tamaño de las tablas para ajustar tu página. Arrastre el cursor desde la esquina inferior izquierda hacia la esquina superior derecha y dejar de arrastrar cuando esté satisfecho con el tamaño de las tablas.

5 Ajuste su página más moviendo sus tablas. Arrastre el cursor en la ficha de tabla de verde diseño resaltada.

Tenga en cuenta, la única manera de poder mover las tablas es si la página de diseño muestra espacio gris, indicando que hay espacio en el diseño de página para el movimiento. Si no ves gris, probablemente recibirá un símbolo de "No acción", que es generalmente un círculo con una barra. El espacio gris no será un área no editable.

6 Cambiar el tamaño de las tablas anidadas para ajustar las barras de navegación ya que se realiza en el paso 4. Usted tendrá que mover la barra de navegación tal como desea que aparezca en tu página de inicio. Por ejemplo, elegir una posición de extrema derecha o extrema izquierda.

7 Elegir la paleta de objetos y la opción "Dibujar celda de diseño" para dibujar celdas separadas dentro de la tabla. Esto es donde insertar tus imágenes. En caso de que la imagen es más grande que las células que ha dibujado, podrás corregir en el "Inspector" seleccionando "hacer célula anchos constantes.

8 Inserte su imagen haciendo clic en la celda superior. En la barra de menú, seleccione "Insertar" y "Imagen". También puede realizar la acción haciendo clic en la miniatura de la imagen en la paleta de objetos. Tendrá que repetir este paso hasta que todas sus imágenes ha insertado en las células creadas.

Si usted quiere mover sus células, mueva el cursor sobre el lado de la célula. Cuando el contorno se ilumina en rojo, haga clic y arrastre la celda a su nueva posición.

9 Crear una celda adicional para una mesa de logo, tal vez ubicada en la parte superior de la página, dependiendo de su diseño.

10 Ampliar la tabla de logo en la parte superior de la página de diseño seleccionando "Inspector de propiedades" y "Autoexpansión".

Tenga en cuenta que tendrás que elegir el formato de archivo para la salida de la gráfica de la imagen como un GIF animado o un archivo JPEG en el menú "Opciones".

11 Elija su color de fondo de página de diseño así como el color de la celda del logotipo al abrir el Inspector de propiedades y programar el código de color para el fondo, abreviado Bg.

Tenga en cuenta que el Inspector de propiedades activa en el paso 10 es independiente al Inspector de propiedades en este paso.

12 Dibujar sus contenidos células para sus imágenes. Que se va escribiendo en su información. Por ejemplo, si desea que su contenido sobre un fondo blanco, seleccione el Inspector de propiedades y establecer el fondo en blanco #FFFFFF. Una vez que se añade su contenido, puede pulsar F12 para previsualizar la página en un navegador aparte.

13 Dibujar otra tabla de diseño en la parte inferior de su página. Esta será su pie de página que contendrá información de derechos de autor, así como otras web pertinente. Se tendrá que repetir el paso 10 para expandir el pie de página en la parte inferior de la página, así como 12 paso a introducir su información.

Consejos y advertencias

  • Dependiendo de la versión de Dreamweaver, pasos, así como nombres de característica específica puede variar. Algunas versiones requieren crear un nuevo documento sin márgenes. Esto le permitirá colocar las células en el lugar deseado en la página. Si su versión requiere un nuevo formato de documento, tendrá que establecer los cuatro márgenes a "0". Vaya a "Archivo", "Nuevo" y "Modificar" o desplácese hasta "Márgenes" y "Propiedades de página" para restablecer los márgenes.