La descarga está en progreso. Por favor, espere

La descarga está en progreso. Por favor, espere

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

Presentaciones similares


Presentación del tema: "CREACIÓN DE PÁGINAS WEB CON SHAREPOINT DESIGNER 2007 (Sesión 5) Ricardo Ferrís Castell ( ) Departament D Informàtica."— Transcripción de la presentación:

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

2 Páginas HTML Creación de páginas Web con SharePoint 2 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 \\disco.uv.es\nombre_usuario –Pulsar sobre Finalizar Recuperar el site

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

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

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

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

7 Temario Introducción a internet: Cliente/Servidor. Introducción a Office SharePoint Designer 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 Páginas HTML Creación de páginas Web con SharePoint 8 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. Formularios

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

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

11 Páginas HTML Creación de páginas Web con SharePoint 11 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).

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

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

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

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

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

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

18 Páginas HTML Creación de páginas Web con SharePoint 18 Formularios Controles: Menus Tag : 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 : Opciones : –selected: Indica si la opción queda marcada por defecto

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

20 Páginas HTML Creación de páginas Web con SharePoint 20 Formularios Controles: Area de texto Tag : 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.

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

22 Creación de páginas Web con SharePoint Páginas HTML 22 Formularios Controles: Rótulos Tag : 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.

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

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

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

26 Páginas HTML Creación de páginas Web con SharePoint 26 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.

27 Creación de páginas Web con SharePoint 27 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 Formularios

28 Creación de páginas Web con SharePoint 28 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 Ejercicio recopilación

29 Temario Introducción a internet: Cliente/Servidor. Introducción a Office SharePoint Designer 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 Creación de páginas Web con SharePoint 30 Páginas HTML Creación de páginas Web con SharePoint 30 Contenidos multimedia incrustados: Tag : 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. Contenidos multimedia

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

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

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

34 Creación de páginas Web con SharePoint 34 Páginas HTML 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.

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

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

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

38 Páginas HTML Creación de páginas Web con SharePoint 38 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. Otros elementos interesantes

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

40 Páginas HTML Creación de páginas Web con SharePoint 40 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. Otros elementos interesantes

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

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

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


Descargar ppt "CREACIÓN DE PÁGINAS WEB CON SHAREPOINT DESIGNER 2007 (Sesión 5) Ricardo Ferrís Castell ( ) Departament D Informàtica."

Presentaciones similares


Anuncios Google