La descarga está en progreso. Por favor, espere

La descarga está en progreso. Por favor, espere

Ricardo Ferrís Castell

Presentaciones similares


Presentación del tema: "Ricardo Ferrís Castell"— Transcripción de la presentación:

1 Ricardo Ferrís Castell (Ricardo.Ferris@uv.es)
Departament D’Informàtica CREACIÓN DE PÁGINAS WEB CON SHAREPOINT DESIGNER 2007 (Sesión 5) Ricardo Ferrís Castell

2 Creación de páginas Web con SharePoint
Recuperar el ‘site’ Conectarse al servidor a traves del ‘sistema de archivos’ Abrir el ‘explorador’ Pulsar sobre ‘Herramientas->Conectar a unidad de red’ Poner en ‘Carpeta’: \\disco.uv.es\nombre_usuario Pulsar sobre ‘Finalizar’ Páginas HTML Creación de páginas Web con SharePoint 2

3 Creación de páginas Web con SharePoint
Recuperar el ‘site’ Abrir SharePoint Designer Cerrar la página que crea por defecto Páginas HTML Creación de páginas Web con SharePoint 3

4 Creación de páginas Web con SharePoint
Recuperar el ‘site’ Crear un nuevo ‘sitio web’ Páginas HTML Creación de páginas Web con SharePoint 4

5 Creación de páginas Web con SharePoint
Recuperar el ‘site’ Pulsa sobre ‘Publicar sitio’ y conectarse al servidor utilizando el método ‘Sistema de archivos’ Páginas HTML Creación de páginas Web con SharePoint 5

6 Creación de páginas Web con SharePoint
Recuperar el ‘site’ Seleccionar todos los ficheros y directorios y pulsar sobre la flecha azul Páginas HTML Creación de páginas Web con SharePoint 6

7 Creación de páginas Web con SharePoint
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. Estilos. Formularios. Inserción de contenidos multimedia. Creación de páginas Web con SharePoint 7

8 Creación de páginas Web con SharePoint
Formularios Formularios: Un formulario HTML es una sección de un documento que contiene contenido normal, código, elementos especiales llamados controles (casillas de verificación (checkboxes), radiobotones (radio buttons), menús, etc.), y rótulos (labels) en esos controles. Una vez rellenado el formulario se envia para que un ‘agente’ procese la información. Páginas HTML Creación de páginas Web con SharePoint 8

9 Creación de páginas Web con SharePoint
Formularios Formularios: Tag: <form></form> Opciones: method: get|post action: Agente procesador del formulario Esta es la etiqueta contenedora del formulario que continene los ‘Controles’ Páginas HTML Creación de páginas Web con SharePoint 9

10 Creación de páginas Web con SharePoint
Formularios Formularios: Páginas HTML Creación de páginas Web con SharePoint 10

11 Creación de páginas Web con SharePoint
Formularios Controles: Son los elementos que están dentro de un formulario y sirven para que los usuarios interaccionan con el formulario. Casillas de verificación (checkboxes) Radiobotones (radio buttons) Entradas de texto (text input) Controles ocultos (hidden controls). Botones. Menús (menus). Selección de ficheros (file select). Controles tipo objeto (object controls). Area de texto (text area). Páginas HTML Creación de páginas Web con SharePoint 11

12 Creación de páginas Web con SharePoint
Formularios Controles: Entrada Tag: <input></input> Páginas HTML Creación de páginas Web con SharePoint 12

13 Creación de páginas Web con SharePoint
Formularios Controles: Entrada Tag: <input></input> Opciones: type Páginas HTML Creación de páginas Web con SharePoint 13

14 Creación de páginas Web con SharePoint
Formularios Controles: Entrada texto/contraseña Páginas HTML Creación de páginas Web con SharePoint 14

15 Creación de páginas Web con SharePoint
Formularios Controles: Entrada enviar/restablecer Páginas HTML Creación de páginas Web con SharePoint 15

16 Creación de páginas Web con SharePoint
Formularios Controles: Entrada botón de opción/verificación Páginas HTML Creación de páginas Web con SharePoint 16

17 Creación de páginas Web con SharePoint
Formularios Controles: Entrada archivo Páginas HTML Creación de páginas Web con SharePoint 17

18 Creación de páginas Web con SharePoint
Formularios Controles: Menus Tag: <select></select> Opciones: name: Nombre del componente multiple: Permite la elección de varios elementos a la vez Esta etiqueta contiene a las diferentes opciones elegibles Tag: <option></option> selected: Indica si la opción queda marcada por defecto Páginas HTML Creación de páginas Web con SharePoint 18

19 Creación de páginas Web con SharePoint
Formularios Controles: Menus cuadro desplegable Páginas HTML Creación de páginas Web con SharePoint 19

20 Creación de páginas Web con SharePoint
Formularios Controles: Area de texto Tag: <textarea></textarea> Opciones: name: Nombre del componente rows/cols: Filas y columnas que tendrá el espacio en el que escribiremos. readonly: Si es ‘readonly’ el texto no es editable, pero si que se enviará con el formulario. El contenido de la etiqueta será el texto que se mostrará por defecto. Páginas HTML Creación de páginas Web con SharePoint 20

21 Creación de páginas Web con SharePoint
Formularios Controles: Area de texto Páginas HTML Creación de páginas Web con SharePoint 21

22 Creación de páginas Web con SharePoint
Formularios Controles: Rótulos Tag: <label></label> Opciones: for: Indica el nombre del componente al que pertenece El contenido de la etiqueta será el texto que se mostrará como rótulo del componente referido. Páginas HTML Creación de páginas Web con SharePoint 22

23 Creación de páginas Web con SharePoint
Formularios Controles: Cuadro de grupo Tag: <fieldset></fieldset> El contenido de la etiqueta son los controles que queremos agrupar. Controles: Leyenda Tag: <legend></legend> El contenido de la etiqueta es el título que se muestra. Páginas HTML Creación de páginas Web con SharePoint 23

24 Creación de páginas Web con SharePoint
Formularios Controles: Cuadro de grupo/Leyenda Páginas HTML Creación de páginas Web con SharePoint 24

25 Creación de páginas Web con SharePoint
Formularios Ej: Páginas HTML Creación de páginas Web con SharePoint 25

26 Creación de páginas Web con SharePoint
Formularios Realizar un formulario para inscribirse en el curso. En el formulario se pedirá la siguiente información: Nombre, apellidos y del solicitante. Si es PDI o PAS (en una selección excluyente). Si ya ha realizado con anterioridad algún curso de formación (en un botón de chequeo) La provincia de nacimiento (Alicante, Castellón, Valencia, Otros en un menu desplegable) Un password de su elección para volver a conectarse en el futuro a la página. Un cuadro de texto para explicar el motivo de querer apuntarse. action="http://pepito.uv.es//cgi-bin/enviar.cgi" Poner un título a la página. Cambiar las propiedades de la página para que tenga un título, una descripción y unas palabras clave. Configura adecuadamente el idioma. Páginas HTML Creación de páginas Web con SharePoint 26

27 Creación de páginas Web con SharePoint
Formularios Una vez realizada la página, adjuntarle la hoja de estilo. Añadir una nueva entrada en el índice de la página ‘index.html’ para que la nueva página sea accesible. Publicar todos los archivos creados o modificados. Páginas HTML Creación de páginas Web con SharePoint

28 Ejercicio recopilación
Añade, al principio de la página, la imagen de la Universitat de València (loguvhom.gif) con texto alternativo “Universitat de València”, con borde de 5 puntos y ancho de 90%. Convierte la imagen en un hipervínculo que enlace con la página principal de la universitat. Añade como pie de página una tabla con una fila y tres columnas. En la primera columna pondrá el nombre del curso que enlazará con la página del curso. En la segunda pondrá la fecha, centrada. En la tercera el logo del departamento de informática (infoPollo_Transparente.gif), con borde 0, ancho 100 puntos y que enlace con la página web del departamento. Guarda el fichero, publícalo y observa los resultados. Páginas HTML Creación de páginas Web con SharePoint

29 Creación de páginas Web con SharePoint
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. Estilos. Formularios. Inserción de contenidos multimedia. Creación de páginas Web con SharePoint 29

30 Contenidos multimedia
Contenidos multimedia incrustados: Tag: <embed></embed> Opciones: src: Fichero a incrustar width/height: Tamaño por defecto de la ventana autostart: true/false Indica si el fichero se reproducira o no de forma automatica en caunto se carge (por defecto true) loop: indica el número de veces que ser reproducirá el fichero (por defecto 1) La visualización dependerá de la configuración del navegador y de los plug-ins que tenga instalados. Páginas HTML Creación de páginas Web con SharePoint Creación de páginas Web con SharePoint 30

31 Contenidos multimedia
Páginas HTML Creación de páginas Web con SharePoint

32 Contenidos multimedia
Contenidos multimedia incrustados: Complementos Páginas HTML Creación de páginas Web con SharePoint 32

33 Contenidos multimedia
Contenidos multimedia incrustados: Tag: <embed></embed> Páginas HTML Creación de páginas Web con SharePoint 33

34 Contenidos multimedia
Realiza una página con un elemento multimedia. El origen de datos será: El tamaño será de 400 puntos de ancho y 200 puntos de alto. Ponle un título, cambia adecuadamente las propiedades de la página, guárdala, publícala y observa los resultados. Cambia el origen de datos por Mclan.mp3 Guarda y publica la nueva página y observa los resultados. Páginas HTML Creación de páginas Web con SharePoint

35 Contenidos multimedia
Sonido de fondo: Tag: <bgsound></bgsound> Opciones: src: Fichero a escuchar loop: Número de veces que sonará (infinite/-1) Páginas HTML Creación de páginas Web con SharePoint 35

36 Contenidos multimedia
Páginas HTML Creación de páginas Web con SharePoint

37 Contenidos multimedia
Pon a la página del curso como sonido de fondo Guarda y publica la nueva página y observa los resultados. Páginas HTML Creación de páginas Web con SharePoint

38 Otros elementos interesantes
Capas Las capas no son más que unos recuadros, que pueden situarse en cualquier parte de la página, en los que podemos insertar contenido HTML. Dichas capas pueden ocultarse y solaparse entre sí, lo que proporciona grandes posibilidades de diseño. Páginas HTML Creación de páginas Web con SharePoint 38

39 Otros elementos interesantes
Capas Páginas HTML Creación de páginas Web con SharePoint 39

40 Otros elementos interesantes
Marcos Son divisiones de la página que contienen páginas html completas. Permiten navegar entre diferentes elementos del sitio web manteniendo ciertos elementos fijos. Páginas HTML Creación de páginas Web con SharePoint 40

41 Otros elementos interesantes
Marcos Páginas HTML Creación de páginas Web con SharePoint 41

42 Otros elementos interesantes
Otros elementos interesantes proporcionados por SharePoint Páginas HTML Creación de páginas Web con SharePoint 42

43 Otros elementos interesantes
Otros elementos interesantes proporcionados por SharePoint Páginas HTML Creación de páginas Web con SharePoint 43


Descargar ppt "Ricardo Ferrís Castell"

Presentaciones similares


Anuncios Google