DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual....

23
DISEÑO DE SITIOS WEB FRONTPAGE 2003

Transcript of DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual....

Page 1: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

DISEÑO DE SITIOS WEB

FRONTPAGE 2003

Page 2: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

CARACTERISTICAS

• Creacion de paginas en un entorno visual.

• Diseñar y modificar tanto el sitio como cada página individualmente.

• Forma parte del paquete de aplicaciones Office2003 .

• Compatibilidad con word, excel y access

Page 3: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Elementos del entorno de desarrollo

Page 4: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Diseño del sitio

Page 5: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

CREACION DE UN SITIO WEB1. Hacer clic en Archivo - Nuevo.

2. Nuevo sitio web, hacer clic en Sitio Web de una página

3. En Plantillas de sitio Web, en el apartado Opciones pulsar Examinar.... buscar la carpeta donde se creara el sitio “Mis documentos/…/personal (si no la tienes hay que crearlas), hacer clic en Abrir.

4. Hacer clic en la plantilla Sitio Web de una página.

5. Hacer clic en Aceptar

6. Crear la nuevas carpetas

7. Poner nombre al sitio (opcional)

Herramientas - Configuración del sitio

Page 6: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Con el asistente (ayuda)1. Para crear el sitio Archivo - Nuevo

2. En el panel de tareas a la derecha,Nuevo sitio web, hacer clic en Sitio Web de una página

3. En el diálogo Plantillas de sitio Web en el apartado Opciones pulsar Examinar. hacer clic en la carpeta Mis documentos y crear la carpeta del sitio

4. Pulsa el botón Abrir

5. Hacer clic en la plantilla Sitio Web personal y en el botón Aceptar

Page 7: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

TEXTO Tipo de letra, tamaño, negrita, cursiva, subrayado

 

                                                                                                                                                                                                                      

Salto de linea en el mismo parrafo: shift (mayuscula) + enter

Formato y Párrafo Sangrias

PARRAFOSFormato y Fuente Fuente, Estilo, Tamaño, Color y Efectos

Page 8: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Listas y Viñetas

lista numerada     o lista de viñeta    ,

texto existente

botón de lista numerada o lista de viñeta

lista existente

botón derecho del ratón sobre la lista o viñeta, Propiedades de lista

Page 9: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

TemasCombinación de colores, tipos de letras, separadores, etc. en una o todas las paginas

herramienta WordArt

Formato - Tema

Insertar - Imagen opción WordArt.

Page 10: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

IMAGENES

Insertar imagen desde archivo

Insertar – imagen – desde archivo – seleccionar - aceptar

poner una imagen de fondo

Formato – fondo – imagen de fondo – elegir grafico - aceptar

Convertir en marca de agua

Activar la casilla marca de agua, el fondo no se desplaza

Page 11: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

HIPERVINCULOS

hiperenlaces, enlaces o links

entre dos páginas web de un mismo sitio, a una página de otro sitio web, a un fichero, a una imagen, etc

Hipervínculo de texto Hipervínculo de imagen Hipervínculo a una página del propio sitio web (página local). Hipervínculo a otro sitio web (página externa). Hipervínculo a una dirección de correo electrónico.

Page 12: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Hipervínculo de texto

1. Seleccionar el texto asociado al enlace.2. A continuación:

-Pulsar en el menú Insertar y después, en Hipervínculo.

-Pulsar el botón          de la barra formato.

-Presionar Alt + Ctrl + K del teclado

3. Especificar el documento asociado en “direccion”4. Elegir el marco destino.

Un ancla o marcador es una señal invisible que se deja en ciertas partes de una página web para acceder directamente a esas partes.

ANCLAS O MARCADOR

Insertar y Marcador o pulsaR Alt+Ctrl+G.

Page 13: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

•Hacer clic justo delante del texto a establecer como referencia•Elegir Insertar y opción Marcador o presiona Alt+Ctrl+G •Escribir la primera palabra en el cuadro Nombre de marcador •Aceptar.aparece el simbolo

Definir el marcador o ancla

Definir el enlace al marcador o ancla

1. Seleccionar el texto asociado al enlace.2. A continuación:

-Pulsar en el menú Insertar y después, en Hipervínculo.

-Pulsar el botón          de la barra formato.

-Presionar Alt + Ctrl + K del teclado

3. Elegir la opción marcador y elegir el adecuado y aceptar4. En “direccion” aparecerá el nombre del marcador precedido de #

Page 14: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

TABLAS

1. ELEGIR INSERTAR TABLA

2. DELIMITAR FILAS Y COLUMNAS Y CLIC

añadir filas o columnas

•botón derecho del ratón sobre la tabla y elegir la opción insertar filas o la opción añadir columnas

•Menu Tabla – insertar – filas o columnas

Page 15: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

eliminar filas o columnas

botón derecho del ratón sobre la selección (borde de la tabla), y elegir la opción eliminar filas o la opción eliminar columnas.

Combinar celdas

Demarcar el grupo de celdas a combinarBotón derecho y combinar celdas

Dividir Celdas

clic en la celda a dividir, botón derecho del ratón y hacer clic en la opción Dividir celdas

clic en Dividir en columnas clic en Dividir en filas

anidar una tabla

crear una tabla en una celda de otra tabla

Page 16: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

PROPIEDADES DE UNA TABLA

Clic botón derecho sobre la tabla – propiedades de la tabla

Page 17: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Propiedades de una celda

Clic sobre la celda – botón derecho – propiedades de celda

Imagen de fondo para la tabla

Clic sobre la celda – botón derecho – propiedades de celda – Utilizar imagen de fondo – examinar - aceptar

Page 18: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

MARCOSutilizar una de las plantillas de marcos

Archivo - Nuevo - Más plantillas de página.... - Páginas de marcos

Page 19: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

TITULAR

CONTENIDO PRINCIPAL

Page 20: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

en cada marco, se puede crear una Nueva página o cargar páginas ya hechas, con el botón Establecer página inicial....

Si se crea nuevas paginas en cada marco, se las puede grabar individualmente o de manera global con archivo - guardar

Configuración del marco

Clic en el marco – botón derecho – propiedades del marco

Hipervínculo desde un marco

¿Cual es el marco destino?

Page 21: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

FORMULARIOSFormulario, dos botones de uso habitual, Enviar y Restablecer

Cuadro de texto: Crea un cuadro en el que el usuario puede introducir texto

Área de texto: Es similar al cuadro de texto

Casillas de verificación: permite mostrar varias opciones Y seleccionar una o más haciendo clic en ellas.

Botón de opción: Es similar a las casillas de verificación, con la diferencia de que los botones son excluyentes entre sí

Cuadro desplegable: Muestra un cuadro desplegable con varias opciones. Por defecto sólo se eige una

Botón de comando: Nos permite crear botones y asignarles acciones

Imagen: Nos permite poner imágenes en un formulario

Page 22: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.

Insertar - Formulario

Para crear un formulario

Elementos del formulario

Insertar – Formulario - items

CEACION DE PAGINAS DE FORMULARIOS

Archivo – nuevo – mas plantillas de paginas – asistente para páginas de formulario – siguiente – agregar elementos al formulario y finalizar

Page 23: DISEÑO DE SITIOS WEB FRONTPAGE 2003. CARACTERISTICAS Creacion de paginas en un entorno visual. Diseñar y modificar tanto el sitio como cada página individualmente.