7. DISEÑAR UNA PÁGINA WEB CON FRONTPAGE

Transcripción

1 This project funded by Leonardo da Vinci has been carried out with the support of the European Community. The content of this project does not necessarily reflect the position of the European Community or the National Agency, nor does it involve any responsibility on their part. MATERIAL DE FORMACIÓN 7. DISEÑAR UNA PÁGINA WEB CON FRONTPAGE Microsoft FrontPage 2000 es una poderosa herrminta para la creación y gestión de páginas Web.ofrece un entorno WYSIWYG (lo que ve es lo que se lleva) para crear páginas sin programar. Ayuda a los usuarios a crear sus páginas Web de una manera más profesional, para actualizar de una manera más sencilla, y poder visualizar y manejar Internet o páginas Web Intranet INICIAR MICROSOFT FRONTPAGE FrontPage puede iniciarse de las siguientes maneras: Pulsar Programas -> Microsoft FrontPage desde el menú Inicio; Haga Clic (doble clic) en el icono Microsoft FrontPage; Abra cualquier página web haciendo doble clic con el botón derecho del ratón en la página y pulse Editar en el menú de acceso rápido abierto; Abra (con un solo clic) aun icono FrontPage en la barra de Lanzamiuento ESTRUCTURA DE LA VENTANA FRONTPAGE La venta FrontPage consiste de las siguientes partes:: barra de título, barra menú, barra de herramientas estándar, barra de herramientas de formato, barra vistas, lista de carpetas, zona de documentos, tabuladores de vista de página barra de estado. Cuando inicie FrontPage por primera vez, los menús y las barras de herramientas muestran comandos y botones básicos. La siguiente ilustración muestra la ventana Front Page. 1

2 7.2.1 imagen. Ventana FrontPage Barra Menú La barra menú contiene una lisrata de menús que le ayudarán a crear, editar, y dar formato a items y documentos. Cada opción puede ofrecer más de un a opción, dependiendo de lo que esté haciendo. Los menús en Frontpage solo muestarn los comandos que haya utilizado recientemente. Pra visualizar todas las opciones de cada menú, debe hacer clic sobre las flechas dobles situadas en la parte inferior del menú Barra de herramientas estándar La barra de herramientas estándar tiene botones que le dan un acceso rápido a las funciones más empleads de Frontpage, tales como abrir, guardar e imprimir.. 2

3 Barra de herramientas De formato La barra de herramientas de formato es la manea más fácil de cambiar muchas de las características de los elementos del documento Barra Vista La barra Vista Contiene varias opciones. Vista de página proporciona una edición WYSIWYG (What-You-See-Is-What-You-Get) Vista de carpetas le permite manejar archivos y documentos de una manera sencilla. Vista de informes ayuda a analizar su Web y manejar sus contenidos., Vista de Navegación le permite diseñar la estructura de la Web para barras de Navegación., Vista de Hipervínculos le permite organizar los enlaces en la páginas web, Vista de tarea le permite crear y gestionar sus tareas. Estas opciones proporcionan diferentes maneras de mirar la información en su página o en su página Web. Puede cambiar la vista seleccionando un icono diferente de Vista. También puede cambiar vistas seleccionando la vista que quiere en el menú Ver Vista de página La vista de página es la vista estándar, dónde puede trabajar utilizando tres tabulador Diferentes en la parte inferior: Normal,HTML,Vista Previa. El tab Normal en Vista de página está programado para iniciar desarrolladores de Web, que no recomocen HTML. Con esta vista puede editar en estilo WYSWTG. Si es un desarrollador web y un diseñador de páginas web puede escribir directamente HTML (o editar HTML) pulsnado el botón HTML. Puede tener una vista previa de cómo quedará su página cuando la visite alguien pulsando el botón Vista Previa. Sin embargo no hace mostrar todo correctamente. Si tiene ganas de ver como quedará la página, pulse el bo tn Vista Previa en Navegador barra estándar.., en el navegador de la Si está creando y editando una página web con marcos, dos botones adicionales apareceán en la vista de Página: Sin Marcos y Página de Marcos. HTML. Con el botón Sin marcos puede editar el mensaje que aparecerá en el Web navegador, si el navegador no soporta marcos. El botón de Página de marcos HTML muestra el HTML para la página de marcos. Vista de Informe La vista de Informes le proporciona información sobre su web actual. Con esta vista pude tener una vista previa de un resumen de un sitio, de todos los archivos de la web actual, archivos recientemente añadidos, archivos recientemente modificados, archivos viejos, archivos sin enlace y páginas de muestra. En Vista de Informe puede también verificar los hipervínculos. 3

4 Vista de Navegación La vista Navegación muestra una representación gráfica de la estructura de su sitio Web imagen Estructura del sitio Web Con esta vista, puede construir un organigrama, además de visualizarlo. Frontpage le permite crear enlaces automáticamente después de crear el organigrama. Por ejemplo, para que la Página de Inicio tenga hipervínculos con Album de Fotos, Intereses y Favoritos, debemos abrir la página de Inicio haciendo doble clic en el icono de Página Inicio (Página Inicio se abre en Vista de Págian), pulse Insertar ->barar de Navegación en la barra menú, y escoja la opción deseada en el cuadro diálogo de Propiedades de la Barra de Navegación imagen. Propiedades de la Barra de Navegación 4

5 En este caso, y una vez elegido el Nivel de Niño, el programa crea hipervínculos automáticamente a páginas de nivel de niño y proporciona nombres de titulo (Páginas de Album de fotos, Intereses y Favoritos). La siguiente ilustración muestra el resultado: imagen. Hipervínculos creados con la barra de Navegación Vista de Hipervínculos La vista de Hipervínculos le permite organizar los enlaces en las páginas web. Esta vista le proporciona un mapa visual de los hipervínculos desde o hacia cualquier página en su web. Puede crear la vista de Hipervínculo a su gusto, es decir para mostrar títulos de página, enlaces desde y hacia imágenes, etc (haga clic con el botón derecho del ratón sobre el fondo, y entonces haga clic en Mostrar Títulos de Página, Hipervínculos a imágenes u otras opciones en el menú de acceso rápido) En la vista Hipervínculos FrontPage muestra también los hipervínculos rotos: imagen Vista de Hipervínculos Vista de Tarea La vista de tarea es útil para múltiples usos, para quienes estén trabajando en la web. Con esta vista, los usuarios paeden hacer comentarios a la web actual, para que otros usuarios puedan visualizarlas. Si la tarea está finalizada, puede marcar la tarea como ya finalizada (selecione tarea completada, haga clic en el botón derecho del ratón y, en el menú de acceso rápido, pulse Marcar como completado). Para crear una nueva tarea, haga clic en la zona general y en el menú de acceso rápido pulse Nueva Tarea. 5

6 Menús De acceso rápido Los menús de acceso rápido le permiten tener acceso a varios comandos FrontPage más rápido que utilizando las opciones en la barra menú. Los menús de acceso rápido aparecen cuando cualquier elemento de la página es seleccionado con el botón drecho del ratón. Las opciones de este menú variarán dependiendo del elemento seleccionado Barras de herramientas Para hacer que la edición y el formato sea más rápida y más sencilla, pueden hacerse mostrar barras de herramientas adicionales si selecciona Ver->Barras de herramientas de la barra menú. Las barras de herramientas, que aprezcan ya en pantalla, están seleccionadas. Haga clic en el nombre de las barras de herramientas para añadir una nueva barra de herramientas OPERACIONES CON PÁGINA WEB Cree una nueva página web Haga clic en el botón Página Nueva en la barra de herramientas Estándar o pulse Archivo->Nuevo->Págine en la barra menú, haga clic en el tabulador General, y después haga doble clic en el icono de Página Normal imagen. Nuevo Cuadro Diálogo 6

7 Abrir un documento ya existente Pulse el botón Abrir en el menú Archivo, o haga clic en el botón Abrir en la barra de herramientas Estándar. Luego haga clic en el documento que desee abrir Guardar una página Web Haga clic en el botón Guardar en la barra de Herrmientas Estándar o pulse Archivo- >Guardar en la barra menú. Si quiere guardar una página web sin nombre, escriba un nombre para la página web en el cuadro Nombre de Archivo y haga clic en Guardar. Si quiere guardar la página web con otro nombre o en otro formato, pulse Archivo->Guardar como en la barra menú. Si quiere guardar una página web para utilizarlo con otro programa, en el cuadro Guardar como tipo, haga clic en el formato de archivo que sea compatible con el otro programa Plantillas Un plantilla??? es una página pre-diseñada que puede contener ajustes de página, de formato y elementos de página. FrontPage proporciona una variedad de plantillas de página, y puede crear sus propios plantillas de página. Puede escojer un plantilla creando una nueva página (Archivo->Nuevo- >Página ). En el tab General en el nuevo Cuadro Diálogo, escoja el plantillaestándar (Página Normal) u otro Plantilla (Bibliografía, Buscar Página,etc.) En el mismo tab Generalpuede craer una página utilizando Wizard (Formar Página Wizard). Si quiere crear su propia plantilla depágina, cree una página con el ajuste y elementos de página que desee y guarde la página como un plantilla. Cuando haya acabado de crear el plantillade página, haga clic en Guardar como en el menú Archivo y en el cuadro Guardar como tipo, haga clic en la Plantilla Front Page(*tem) y luego haga clic en Guardar. En el cuadro de diálogo ya abierto Guardar como plantilla, escriba título, nombre y descripción. En otra ocasión, cuando cree una página nueva, su plantilla aparecerá junto a las demás. En el tabulador General en el Nuevo Cuadro de Diálogo Tópicos Un tópico es un conjunto unificado de elementos de diseño y esquemas de color que pueden ser aplicados a todos las páginas de tu sitio. Los tópicos hacen que el proceso de dar forma a la apariencia de la Web sea más fácil y le dan un aspaecto más consistente. Puede utilizar muchos tópicos predefinidos inmediatamente o puede modificarlos a su gusto. Puede aplicar un tópico a una página seleccionada o a todas las páginas en su web. Cuando elige un tópico, éste se aplicrará a todas las páginas existentes y a las páginas de noticias que añadirá más adelante. Los tópicos ya existentes pueden ser modificados o creados al gusto del usuario haciendo clic en el botón Modificar en el cuadro diálogo Tópico. 7

8 El cuadro de diálogo Tópico puede abrirse pulsando Formato->Tópico en la barra menú o haciendo doble clic en la página que se esté editando en Vista de Página. Puede cambiar el color del tópico, los gráficos y las opciones de texto. Puede también crear su nuevo tópico. Puede mover el tópico aplicado a una página seleccionada o a todas las páginas en su web imagen. Cuadro de diálogo Tópicos Marcos Puede combinar y mostrar dos o más páginas simultáneamente en una ventana navegador utilizando marcos. Para conseguir esto debe crear una página de Marcos. La propia página de Marcos no contiene contenido visible. Simplementa especifica cómo dividir el la ventana de navegador en marcos más pequeños diferentes zonas, cada una de las cuales muestra una página diferente..si quiere crear una página nueva (Archivo->nuevo->Página ), haga clic en el tabulador de Páginas de Marcos en el cuadro diálogo Nuevo y escoja laos marcos plantilla?? deseados (por ejemplo Contenidos). La ventana abierta se dividirá en dos áreas. Puede crear una nueva página para cada marco en la página de marco (haga clic en el botón Nueva Página) o inserte una página ya existente (haga clic en el botón Configurar Página Inicial ) La siguiente imagen muestra una ventana de marcos compuesta por dos marcos. Por ejemplo, en el marco izquierdo hay hipervínculos que cambiarán la página mostrada a la derecha. 8

9 7.3.3 imagen. Página de marcos Con la ayuda de la ventana de marcos, puede hacer lo que sigue: Puede crear marcos adicionales en el marco ya existente. Pra dividir el marco en columnas o filas, seleeccione el marco que desea dividir, pulse Marcos-> Dividir Marco en la barra menú Cuadro diálogo Marco dividido Puede borrar el marco seleccionando el marco que desee borrar, pulse Marcos-> Borrar Marcos en la barr menú). Puede cambiar el tamaño del marco seleccionando y arrastrando los vértices del marco. Puede cambiar las prpopiedades del marco haciendo clic en el botçon derecho del ratón en el marco. Seleccione Propiedades de Marco del menú de acceso rápido Y cambie las opciones que desee. 9

10 Propiedades de página Puede cambiar las propiedades de página seleccionando Página->Propiedades en la barra menú o haciendo clic con el botón derecho del ratón en Propiedades de página en el menú de acceso rápido. En el tabulador General, puede cambiar el título de la página que aparece en el banner de página y en las barras de navegación creados por Frontpage, al igual que en la barra de título de buscadores de Web. Tome nota de que si cambia el título de la página no modificará el nombre del archivo. Si no usa tópico, puede seleccionar color o elegir una imagen para el fondo de la página. Si selecciona Activar efectos rollove de hipervínculo, puede añadir efectos a los hipervínculos: la apariencia de los enlaces de texto cambiarán cuando el puntero del ratón está posicionado sobre ellos. Los colores de hipervínculo también puden cambiarse. Puede seleccionar tres colores para utilizar para trs hipervínculos diferentes. Un coor para el hipervínculo que no ha sido seleccionado para Hipervínculo Un color para el enlace seleccionado -- para hipervínculo Activo. Un color para el hipervínculo que ya ha sido visitado para hipervínculo Visitado. En el tabulador de los Márgenes, puede configurar en pixels la anchura de los márgenes superiores y de la izquierda de la página Hipervínculos Hipervínculos pueden ser texto o imagen que conectarán con otra página web cuano se haga clic sobre ellos. Puede usar hipervínculos para enlazar otras páginas, imágenes, direcciones de y otros archivos o programas. Para crear un hipervínculo, haga resaltar texto o gráfico, haga clic en Insertar-> Hipervínculo en la barra menú y en e cuadro diálogo Crear Hipervínculo, haga resaltar la página en la lista (si el enlace le llevará a una página en su sitio) o escriba el URL deseado, que indica donde se encuentra una fuente de Internet. Para crear un hipervínculo a una dirección de , haga clic en Insertar->Hipervínculo en la barra menú,en el cuadro diálogo Crear Hipervínculo haga clic en el botón en el cuadro diálogo Crear Hipervínculo E.mail escriba la dirección de . y 10

11 7.3.5 imagen. Crear Hipervínculo Imágenes y Gráficos En la página web puede insertar imagines, GIF s animados u otros elementos, tales como símbolos, videos, elementos de forma,etc. Para insertar una imagen o un gráfico, haga clic en Insertar-> Imagen->Desde Archivo (si el la imagen está en un archivo en su disco) or Insertar->Imagen->Clip Art (si la imagen está en Clip Art). Puede cambiar las propiedades de la imagen seleccionando Formato->Propiedades en la barra menú (o haciendo clic con el botón derecho en la imagen y seleccionando Propiedades de Imagen en el menú de acceso rápido). En el tabulador General puede escribir descripción de imagen (tipo de descripción en el campo de Texto bajo Representaciones alternativas). En el tabulador de Apariencia, puede cambiar la alineación, aumentarel grosor de los vértices o cambiar el tamaño de la imagen Publicar Webs Cuando la web, que usted mismo ha desarrollado con su ordenador,haya sido testado y esté listp para aparecer en la red mundial, debe ser publicado, es decir copiado al servidor, donde otros podrán navegar por su web. Su proveedor de Internet (PSI) debe darle información sobre el lugar dónde se encuentra el servidor de Web (es preferable que tenga instalado Extensión del Servidor de Front Page) y sobre su nombre de usuario y contraseña. 11

12 Para publicar una web, seleccione Archivo->Publicar Web en la barra menú. En el cuadro diálogo Publicar Web, debe especificar el lugar donde quiere publicar su web. Si su PSI no proporciona espacio ni servicio, puede encontrar Proveedores de Presencia Web (WPP, companies que proporcionan sevicios de hosting para webs) hacinedo clic en el botón WPP. Su navegador se abrirá y mostrará una página donde podrá escoger un Proveedor de Prencia Web de la lista o podrá buscar wwpp adicionales que puedan encajar con sus necesidades imagen. Cuadro Diálogo Publicar Web Si está publicando su web de Nuevo y solo necesita publicar las páginas que ha cambiado en su web local, haga clic en el botón Opciones y en el cuadro diálogo Publicar Web seleccione Publicar solo páginas modificadas imagen. Cuadro Diálogo Publicar Web con opciones REFERENCIAS BIBLIOGRÁFICAS 1. Activeeducation. Microsoft Frontpage 2000 Step by Step. Microsoft Press, p. 2. Buyens. Microsoft FrontPage Version 2002 Inside Out. Microsoft Press, p. 3. Online Training Solutions Inc. Microsoft FrontPage Version 2002 Step by Step. Microsoft Press, p. 12