Universidad de Puerto Rico en Aguadilla Centro de Tecnología Educativa en Multimedios www.cetem.upr.edu Microsoft Office ® SharePoint Designer 2007 Uso básico Por: Sra. Verenice Rodríguez Ruiz Directora Asociada Servicios Educativos en Multimedios Manual de instrucción del Centro de Aprendizaje de Informática CETEM-37
36
Embed
Microsoft Office ® SharePoint Designer 2007cetem.upr.edu/.../office-2007/sharepoint_designer2007_basico.pdf · Los componentes de la pantalla de SharePoint Designer son similares
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Universidad de Puerto Rico en Aguadilla Centro de Tecnología Educativa en Multimedios www.cetem.upr.edu
Microsoft Office ®
SharePoint Designer 2007 Uso básico
Por: Sra. Verenice Rodríguez Ruiz
Directora Asociada
Servicios Educativos en Multimedios
Manual de instrucción del Centro de Aprendizaje de Informática
Al terminar este manual de instrucción usted podrá:
Definir qué es MS SharePoint Designer (SP)
Iniciar SP
Identificar los espacios gratuitos en la Web
Iniciar Microsoft SharePoint Designer 2007
Identificar los componentes básicos de la pantalla de SP
Crear una página nueva
Nombrar y guardar páginas
Utilizar Table Layout
Insertar y dar formato a un texto
Insertar gráficos
Guardar una página Web con gráficos
Crear y modificar tablas
Aplicar funciones para desarrollar la página
Añadir y modificar enlaces en una página
Insertar un trasfondo
Terminar el programa
III
Introducción
Office SharePoint Server 2007 es una nueva aplicación de servidor que forma
parte de 2007 Microsoft Office System. Mediante el uso de las plantillas del sitio y de otras características de Office SharePoint Server 2007, puede crear, fácil y eficazmente páginas Web.
Definición
Microsoft SharePoint Designer es un programa de aplicación diseñado para
crear y modificar páginas para el World Wide Web (WWW). Este programa le permite crear, de una manera fácil, un sitio en el Web.
Espacios gratuitos en el WEB
Los siguientes sitios Web ofrecen espacio gratuito para colocar allí páginas
Componentes de la pantalla de SharePoint Designer 2007
Los componentes de la pantalla de SharePoint Designer son similares a los de otros programas de MS Office. Estos sirven para una función similar en SP.
En la Ilustración 2 se muestran los diferentes componentes de la pantalla SP.
Ilustración 2
Crear una página nueva
Usted puede crear una página nueva accediendo a File, New y luego page.
Pasos:
1. Activarlo seleccionando de la Barra de menú, File, New, Page como aparece en la Ilustración 3.
2. En el cuadro de diálogo titulado New Page que aparece seleccione la
pestaña de Web Site, dé un clic a la opción Empty Web Site. Determine dónde guardará su página.
Ilustración 4
3. Este cuadro de diálogo le ofrecerá varias opciones para crear una página y también le dará la opción para que usted le indique el lugar donde quiere guardar los documentos de su página.
1. Del panel de la izquierda de table layout seleccione
Ilustración 6
Insertar y dar formato a un texto
El texto es el elemento básico de una página diseñada para el World Wide Web (WWW). Es la manera más rápida para comunicar un mensaje. Con SharePoint, al igual que en MS Word, se le puede dar formato a cualquier
aspecto del texto escrito. Algunas opciones, como el tipo de letra, se deben usar con moderación, ya que no todos los navegadores son compatibles con todos los formatos.
Pasos:
1. Añada texto a su página.
2. Oprima la tecla de Enter para escribir más texto. Notará que cuando presiona la tecla de Enter, su línea de texto deja un espacio vertical amplio. Si este espacio vertical es muy ancho para sus propósitos,
Cuando una página Web se le inserta gráficos, imágenes y/o archivos de sonidos u otro tipo, al grabarlo, le aparecerá un cuadro de diálogo titulado
Save Embedded Files; que nos permite algunas opciones. Es bien importante recordar que los nombres de los gráficos, imágenes u otros
archivos no deben tener letras mayúsculas ni espacios entre las letras. Utilice underscore (_) para separar palabras en un nombre de un archivo.
Pasos:
1. Dé un clic al icono de Save, que se encuentra en la Barra de herramientas. (Véase Ilustración 9)
2. Saldrá un cuadro de diálogo titulado Save Enbedded Files, como se muestra en la Ilustración 18.
3. Seleccione el archivo y cambie el nombre, de ser necesario.
4. Seleccione el archivo y cambie de carpeta, de ser necesario. Se
recomienda que todas las imágenes y gráficos estén bajo la carpeta images que se encuentra dentro de su sitio Web. Dé un clic en OK para guardar los archivos en su sitio Web.
4. Escriba la dirección para el enlace en el cuadro, Link to: o dé un clic en el botón Browse para crear un enlace a un archivo a otra página que usted haya creado.
5. Seleccione el enlace.
Ilustración 15
6. Segunda pestaña (Font) del cuadro de diálogo de Interactive button
proporciona tipo de letra, estilo y tamaño.
7. Tercera pestaña (Image) puede cambiarle el color, el efecto, el tipo de
letra y el ancho y el alto que quiere para el botón.
8. Al finalizar presione el botón, OK.
9. Dé un Preview para ver el cambio.
Insertar una tabla
Una tabla le permite presentar datos en forma de filas y columnas. También le
permite posicionar texto y gráficas de una manera más organizada.
Pasos:
1. Ubique el punto de inserción donde usted quiere que la tabla sea insertada.
2. En la Barra de menú, seleccione el comando, Table, Insert. El cuadro de diálogo, Insert Table aparecerá en pantalla
2. Dé un clic en el menú a Insert, Hyperlink. Esto abrirá el cuadro de
diálogo Insert Hyperlink. O puede presionar el icono de hiperenlace.
3. En el cuadro, Address, escriba la dirección de la página donde usted
quiere el enlace. Por ejemplo, http://www.cetem.upr.edu
Enlaces para insertar el e-mail
Pasos:
1. Si desea que el enlace sea el e-mail, seleccione el icono que aparece a la izquierda, E-mail Address. Cuando aparezca el cuadro de diálogo, Insert Hyperlink, escriba la dirección en el cuadro, E-mail address: y el asunto
3. Luego dé un clic derecho para que aparezca un menú corto
4. Seleccione Hyperlink
5. Cuando aparezca el cuadro de diálogo, Insert Hyerlink escriba la
dirección electrónica, en, el cuadro Address: Ejemplo: http://www.endi.com)
6. Dé un clic al botón de OK.
Crear enlaces, Bookmarks
Para facilitar la navegación en una misma página que tiene mucho contenido y que no puede verse completa en la pantalla, se puede utilizar enlaces Bookmarks.
Pasos:
1. Desde la Vista Normal de su página, seleccione el texto al cual usted
quiere que llegue un enlace. Este texto se selecciona de la parte inferior del documento.
2. Marque el texto.
3. Dé un clic a Insert, Bookmark. Cuando aparezca el cuadro de diálogo,
Bookmark, 4. Dé un clic a OK. Observe que el texto aparecerá subrayado con una
línea entrecortada. Esto significa que el texto ha sido marcado como punto de llegada.
5. Vaya al principio del documento.
6. Seleccione el texto al cual usted quiere insertar un enlace para que llegue al final de la página.
7. De un clic al botón, Insert Hyperlink.
8. Cuando aparezca el cuadro de diálogo, Insert Hyperlink, dé un clic a Bookmark y seleccione el nombre del bookmark.
9. Dé un clic a OK.
10. Pruebe su bookmark de la misma manera que prueba los demás
enlaces.
Un bookmark también se puede usar para llevarle a un sitio específico en otra página de su sitio Web. Para esto, debe tener el bookmark ya definido y las
2. Seleccione el texto donde va insertar el bookmark.
3. En la Barra de menú, seleccione Insert, Bookmark para que aparezca el cuadro de diálogo, Bookmark. Le puede asignar un nombre al
bookmark o aceptar el que le inserta el programa.
4. Dé un clic a OK. Si seleccionó texto, le debe aparecer una línea
entrecortada debajo del texto seleccionado.
5. Seleccione la página donde se va a insertar el enlace.
6. Seleccione el texto que va a usar como enlace.
7. En la Barra de menú, seleccione, Insert, Hyperlink. Cuando abra el cuadro de diálogo, Insert Hyperlink,
8. Seleccione el botón, Existing File or Web Page que aparece al lado izquierdo del cuadro. Seleccione la página para el Web donde se encuentra el bookmark.
9. Seleccione el botón, Bookmark.
10. Cuando abra el cuadro de diálogo, Select Place in Document,
seleccione el bookmark que desee.
11. Dé un clic a OK.
Crear Hot Spots
El crear Hot Spots es básicamente lo mismo que convertir imágenes en enlaces.
La diferencia es que en una imagen solamente puedes tener un enlace mientras que, hot spots son enlaces que se insertan en áreas particulares en
una imagen.
Pasos:
1. Inserte una imagen.
2. Dé un clic a la imagen para asegurarse que la Barra Pictures aparezca en pantalla. Si ésta no le aparece, vaya a View, Toolbar, Pictures.
Usted puede insertar un trasfondo a color para realzar su página. Siempre recuerde que su texto y sus imágenes tienen que armonizar con ese color de
manera que el visitante pueda leer el texto fácilmente. Para insertar un trasfondo con color;
Pasos:
1. Dé un clic derecho en cualquier área de la página.
2. Seleccione Table Properties del menú corto que aparecerá en
pantalla. El cuadro de diálogo, Table Properties abrirá en pantalla.
3. Seleccione la opción de Background.
4. Dé un clic al triángulo invertido que aparece en el cuadro Background y seleccione el color que usted prefiera. Si selecciona More Colors, abrirá una paleta de colores que le permitirá escoger
En la siguiente tabla aparece una lista con atajos (shortcuts) y la combinación de las teclas para obtener cada función utilizando el sistema operativo
Apéndice B-1: Consejos para el diseño de una página Web
1. El encabezado de tu sitio web debe ser lo suficientemente atractivo como para llamar la atención del visitante en el instante que entra a tu página.
2. Después de tu encabezado, comienza tu texto algún hecho interesante. Esta primera parte de tu página es crítica para el éxito. Debes continuar con la idea expresada en el encabezado.
3. Utiliza títulos y subtítulos a lo largo de tu página para romper bloques de texto, facilitar la lectura y recuperar la atención de los lectores.
4. Tu sitio web debe ser de fácil navegación. Deja muy claro qué es lo que
tiene que hacer.
5. Imágenes de trasfondo: Use imágenes como trasfondo con cautela. Los
watermarks, por lo general, se ven bien, pero las gráficas obscuras y muy cargadas pueden impedir la lectura de la página. Los colores sólidos y suaves usualmente son los mejores.
6. Fonts (tipos de letras): Use un tipo de letra común. Como, por ejemplo, Arial y Times New Roman. Aunque tenemos la opción de seleccionar
otros tipos de letras, si el usuario no tiene el tipo de letra que usted seleccionó en su computadora, ésta la sustituirá por otra.
7. Páginas muy largas: Divida la información en diferentes páginas. Una
página demasiado de larga dificulta la lectura. 8. Información actualizada: Diseñe su página con información
actualizada, confiable y de valor. 9. Verificar el contenido: Al crear una página para el Web use solamente
contenido que ha sido verificado.
10. Distribución de información: Considere usar el Web cuando exista la necesidad de distribuir información de una manera rápida y económica.
11. Enlaces: Incluya solamente los enlaces necesarios en el contenido de sus
páginas. 12. Unidad: Genere una sensación de unidad en su página utilizando
uniformidad en color en todas sus páginas. 13. Uso de gráficos: El usar muchos gráficos o imágenes muy grandes hace
que su página tome mucho tiempo en bajar a la computadora.
14. Limite las animaciones: Limite el uso de las animaciones en las páginas para Web para que los visitantes se enfoquen en el contenido.
15. Asignarle nombres a las páginas para el Web: Asigne nombre a las páginas tomando en cuenta el contenido de las mismas con el propósito de atraer la atención de los visitantes.
Usted va a diseñar una página básica con texto, enlaces e imágenes con MS SharePoint 2007. Por favor, siga las instrucciones que aparecen a
continuación:
Crear un diagrama de una página usando Tabla Layout
El primer paso a seguir cuando se prepara una página para el Web es diseñar
el diagrama básico de la página. La estructura básica de la mayoría de las páginas se diseñan con tablas y la mayoría incluye un título, una columna con vínculos (links), el contenido y una nota al calce.
Título: La parte superior de la página que contiene el título y otra información
importante sobre su página para que el visitante tenga una idea de qué trata su página.
En ocasiones los vínculos se proveen directamente debajo del título.
Columna de vínculos: En
esta columna se incluye
enlaces que le llevan a distintas secciones de su
página.
Columna de contenido: Esta columna se usa para
incluir la información de la página. Además de texto, puede incluir en la página gráficos.
Nota al calce: Aquí podemos incluir enlaces para el e-mail, fecha de la última revisión,
información sobre la persona contacto y enlaces que le lleven a otras secciones en su
página.
Título: Escriba su nombre, inserte un gráfico, asígnele nombre (Index)