creaciÓn de pÁginas web con sharepoint designer 2007 (sesión 2) ricardo ferrís castell (...
TRANSCRIPT
CREACIÓN DE PÁGINAS WEB CON SHAREPOINT DESIGNER 2007
(Sesión 2)
Ricardo Ferrís Castell
Departament D’Informàtica
Temario
• Introducción a internet: Cliente/Servidor.• Introducción a Office SharePoint Designer 2007.• Comenzar a crear una página web.• Trabajar con imágenes.• Hipervínculos.• Tablas.• Formularios.• Inserción de contenidos multimedia.
Creación de páginas Web con SharePoint
2
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
3
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
4
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
5
• Cabecera (<head>)
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
6
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
7
• Cabecera (<head>)
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
8
• Cabecera (<head>)
• Cuerpo (<body>)
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
9
• Cuerpo (<body>)
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
10
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
11
• Cuerpo (<body>)
Comenzar a crear una página webPágin
as H
TM
L
Creación de páginas Web con SharePoint
12
• Cuerpo (<body>)
Págin
as H
TM
L
Creación de páginas Web con SharePoint
13
• Cuerpo (<body>)
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
14
• Estilos de párrafos
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
15
• Realización de una página completa y su publicación:– Realizar una página del curso:
A partir de la hoja de descripción del curso, realiza una página donde se expliquen los objetivos del curso (y a continuación se enumeren), los puntos a tratar del curso y el profesor que dará el curso (nombre, departamento, facultad o escuela, con su dirección de correo electrónico).
Para el fondo de la página pondréis la imagen:http://www.uv.es/rferris/images/universidad.jpg
Pondréis el color de fondo que creáis conveniente.
Cambiad también el título de la página, las palabras clave y la descripción de la página.
Poned márgenes a la página (100 puntos alrededor del texto).
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
16
• Publicación:
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
17
• Publicación:
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
18
• Publicación:
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
19
• Publicación:
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
20
• Publicación:
http://www.uv.es/rferris/
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
21
• Modifica la página:Cambia el fondo de la página pondréis la imagen:http://www.uv.es/rferris/images/Escudo01.gif
Poned un color de fondo “oscuro” (no negro).
Cambiad el color del texto a un color “claro”.
Publicad de nuevo la página.
Observad los cambios realizados en el explorador.
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
22
• Listas:– Listas ordenadas:
1. Introducción a internet: Cliente/Servidor.2. Introducción a Office SharePoint Designer 2007.3. Comenzar a crear una página web.4. Trabajar con imágenes.5. ...
Marca (tag): <ol></ol>
Opciones:– type: "1", "a", "A", "i", "I"– start: "numero"
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
23
• Listas:– Listas desordenadas:
• Internet y web.• Modelo cliente/servidor.• Edición de páginas web sencillas (html).• Publicación de páginas en la web de la
Universitat.
Marca (tag): <ul></ul>
Opciones:– type: "circle", "disc", "square"
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
24
• Listas:– Listas de definiciones (o glosario de términos):
Internet:conjunto descentralizado de redes de comunicación interconectadas que utilizan la familia de protocolos TCP/IP
Web:sistema de documentos de hipertexto o hipermedios enlazados y accesibles a través de Internet
...
Marca (tag): <dl></dl>
Opciones:– dir: "rtl", "ltr"
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
25
Comenzar a crear una página web
• Listas:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
26
Comenzar a crear una página web
– Listas ordenadas:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
27
Comenzar a crear una página web
– Listas desordenadas:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
28
Comenzar a crear una página web
– Listas de definiciones:
• Edición de la etiqueta “a mano”.
Págin
as H
TM
L
Creación de páginas Web con SharePoint
29
• Incluir, al final de la página, un glosario de términos con sus definiciones.
• Incluye, al menos cinco definiciones.
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
30
• Otros elementos interesantes:– Lineas horizontales <hr></hr>, <hr>, <hr \>
Opciones:– align– size– width– noshade
– Saltos <br></br>, <br>, <br \>
Comenzar a crear una página web
Págin
as H
TM
L
Creación de páginas Web con SharePoint
31
• Otros elementos interesantes:
Comenzar a crear una página web
• Modifica la página que estamos elaborando y añádele líneas horizontales entre cada una de las secciones.
Añade una línea al inicio de la página que ocupe el 100% de la anchura de la página.
Las líneas entre secciones serán del 90% y un grosor de 10 puntos.
Añade una nueva sección ‘pie de página’ separada por una linea horizontal de 100%.
En el pie de página pondremos:Última actualización: 30/09/2010
Págin
as H
TM
L
Creación de páginas Web con SharePoint
32
Comenzar a crear una página web
Temario
• Introducción a internet: Cliente/Servidor.• Introducción a Office SharePoint Designer 2007.• Comenzar a crear una página web.• Trabajar con imágenes.• Hipervínculos.• Tablas.• Formularios.• Inserción de contenidos multimedia.
Creación de páginas Web con SharePoint
33
Págin
as H
TM
L
Creación de páginas Web con SharePoint
34
Trabajar con imágenes
• Imágenes:Marca (tag): <img></img>, <img />
Opciones:– src– width, height– alt– longdesc– align: "left", "right", ...– border
Págin
as H
TM
L
Creación de páginas Web con SharePoint
35
• Insertar una nueva imagen:
Trabajar con imágenes
Págin
as H
TM
L
Creación de páginas Web con SharePoint
36
Trabajar con imágenes
• Insertar una nueva imagen:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
37
Trabajar con imágenes
• Insertar una nueva imagen:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
38
Trabajar con imágenes
• Insertar una nueva imagen:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
39
Trabajar con imágenes
• Insertar una nueva imagen:
Págin
as H
TM
L
Creación de páginas Web con SharePoint
40
Trabajar con imágenes
• Inserta dos nuevas imágenes en la página:– Una como cabecera del documento que ocupe el 100% de la
cabecera, con un borde de 5 puntos.
La imagen a utilizar será: loguvhom.gif
– Otra como icono en el pie de página, alineada a la derecha y de un tamaño de 100 puntos, sin ningún borde.
La imagen a insertar será: infoPollo_Transparente.gif