Dreamweaver Tutorial

Páginas: 27 (6532 palabras) Publicado: 29 de julio de 2012
La maqueta de diseño

Lo habitual no es empezar a construir un sitio Web iniciando Dreamweaver y creando páginas directamente. Los primeros pasos para crear un sitio Web debe darlos sobre una hoja de papel, o en una aplicación de edición gráfica como Macromedia Fireworks.
Una maqueta está formada por una cantidad indeterminada de elementos de páginas que el cliente ha solicitado para su sitioWeb.
A través de esta guía construiremos el sitio de su proyecto. Su trabajo como diseñador consiste en transformar la maqueta en una página web activa (probablemente contando con la ayuda de Flash).

Creación y almacenamiento de una página nueva

Comience creando una página nueva y guardándola en la carpeta raíz local proyecto de su sitio Web. Más adelante esta página será la página deinicio de Mi Restaurante, un restaurante ficticio.
Si no ha creado una carpeta raíz local llamada proyecto, deberá hacerlo antes de continuar.
1. En Dreamweaver, Seleccione Archivo > Nuevo.
2. En la ficha General del cuadro de diálogo Nuevo documento, seleccione Página básica en la lista Categoría, seleccione HTML en la lista Página básica y haga clic en Crear.
3. Seleccione Archivo >Guardar como.
4. En el cuadro de diálogo Guardar como, busque y abra la carpeta proyecto que definió como carpeta raíz local del sitio.
5. Escriba index.html en el cuadro de texto Nombre de archivo y haga clic en Guardar.
El nombre de archivo aparecerá ahora en la barra de título en la parte superior de la ventana de la aplicación.

6. En el cuadro de texto Título del documento en la partesuperior del nuevo documento, escriba El Toque.

Éste es el título de la página (distinto al nombre de archivo). Los visitantes del sitio verán este título en la barra del título del navegador cuando accedan a ella a través de su navegador Web.
7. Seleccione Archivo > Guardar para guardar la página.

Inserción de tablas

A continuación, vamos a introducir una tabla que incluirá texto,gráficos y activos de Macromedia Flash.
1. Haga clic una vez en la página para colocar el punto de inserción en la esquina superior izquierda de la página.

2. Seleccione Insertar> Tabla.
3. En el cuadro de diálogo Tabla, siga este procedimiento:
■ Escriba 3 en el cuadro de texto Filas.
■ Escriba 1 en el cuadro de texto Columnas.
■ Escriba 700 en el cuadro de texto Ancho detabla.
■ Seleccione Píxeles en el menú emergente Ancho de tabla.
■ Escriba 0 en el cuadro de texto Grosor del borde.
■ Escriba 0 en el cuadro de texto Relleno de celda.
■ Escriba 0 en el cuadro de texto Espacio entre celdas.


4. Haga clic en Aceptar.
Aparece en su documento una tabla con tres filas y una columna. La tabla tiene 700 píxeles de ancho, sin bordes, relleno de celda niespacio entre celdas.

5. Haga clic una vez a la derecha de la tabla para anular la selección.
6. Seleccione Insertar> Tabla para insertar otra tabla.
7. En el cuadro de diálogo Insertar tabla, siga este procedimiento para la segunda tabla:
■ Escriba 1 en el cuadro de texto Filas.
■ Escriba 3 en el cuadro de texto Columnas.
■ Escriba 700 en el cuadro de texto Ancho de tabla.■ Seleccione Píxeles en el menú emergente Ancho de tabla.
■ Escriba 0 en el cuadro de texto Grosor del borde.
■ Escriba 0 en el cuadro de texto Relleno de celda.
■ Escriba 0 en el cuadro de texto Espacio entre celdas.
8. Haga clic en Aceptar.

Aparece una segunda tabla con una fila y tres columnas debajo de la primera tabla.

9. Haga clic a la derecha de la tabla para anular laselección.
10. Inserte una tercera tabla seleccionando Insertar > tabla e introduciendo los siguientes valores en el cuadro de diálogo Insertar tabla:
■ Escriba 1 en el cuadro de texto Filas.
■ Escriba 1 en el cuadro de texto Columnas.
■ Escriba 700 en el cuadro de texto Ancho de tabla.
■ Seleccione Píxeles en el menú emergente Ancho de tabla.
■ Escriba 0 en el cuadro de texto...
Leer documento completo

Regístrate para leer el documento completo.

Estos documentos también te pueden resultar útiles

  • Tutorial dreamweaver
  • Tutorial De Dreamweaver
  • Tutorial jsp con dreamweaver
  • Tutorial dreamweaver
  • Tutorial De Mysql Y Dreamweaver Y Con Php
  • Tutorial dreamweaver pag web
  • dreamweaver
  • Dreamweaver

Conviértase en miembro formal de Buenas Tareas

INSCRÍBETE - ES GRATIS