Ricardo Ferrís Castell

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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=" 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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Ricardo Ferrís Castell

Presentaciones similares

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

Presentaciones similares

Sobre el proyecto

Feedback

Iniciar la sesión

Autorizarse a través de una red social:

Ricardo Ferrís Castell

Presentaciones similares

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

Presentaciones similares

Sobre el proyecto

Feedback