PFC Antonio Bernal Baena

411
Alumno: Antonio Bernal Baena Director: Iñaki Fernández de Viana y González Diplomatura en Informática Proyecto Fin de Carrera Convocatoria Septiembre de 2009

description

 

Transcript of PFC Antonio Bernal Baena

Page 1: PFC Antonio Bernal Baena

Alumno: Antonio Bernal Baena Director: Iñaki Fernández de Viana y González

Diplomatura en Informática Proyecto Fin de Carrera

Convocatoria Septiembre de 2009

Page 2: PFC Antonio Bernal Baena

2

Este proyecto de fin de carrera ha sido realizado para el Departamento de Tecnologías de la Información, por Antonio Javier Bernal Baena. Está sujeto a la licencia académica de la Titulación de Diplomado en Informática de la Escuela Politécnica Superior de La Rábida (Huelva), y confiere los derechos y obligaciones pertinentes. © 2009 – Antonio Bernal Baena

Page 3: PFC Antonio Bernal Baena

3

A mi mujer, sin su apoyo nunca podría haber hecho realidad este reto. A mi padre.

Page 4: PFC Antonio Bernal Baena

4

INDICE DE CONTENIDOS 1. INTRODUCCION 10 1.1. CONCEPTOS PREVIOS 10 1.2. EL PROYECTO 10 2. PLANIFICACION 12 2.1. HERRAMIENTAS 12 2.1.1. Sistemas para la gestión de contenidos 12 2.1.2. Percepción del usuario acerca del CMS 13 2.1.3. Tipos de gestores de contenido 13 2.1.4. Software libre para gestión de contenidos 14 2.1.5. Funcionamiento de los CMS 18 2.1.6. Propuestas y comparación 19 2.1.7. Drupal 21 2.2. METODOLOGIA DE DESARROLLO 24 2.2.1. Diseño Centrado en el Usuario 24 2.2.2. Fases del Proyecto 28 2.3. VIABILIDAD 32 2.3.1. Viabilidad legal 32 2.3.2. Viabilidad tecnológica 32 2.3.3. Viabilidad económica 33 3. ANALISIS DE REQUISITOS 35 3.1. ENTREVISTA CON EL CLIENTE 35 3.2. EVALUACIÓN DE OTROS SITIOS WEB 35 3.3. PERFIL DE LOS USUARIOS 39 3.4. ROLES 40 3.5. MISION DEL SITIO 41 3.6. OBJETIVOS DEL SITIO 41 3.6.1. Requisitos del sitio Web para el usuario final 41

3.6.2. Requisitos del sitio Web para los usuarios con acceso autorizado 43

Page 5: PFC Antonio Bernal Baena

5

4. DISEÑO 44 4.1. INVENTARIO DE CONTENIDOS Y ETIQUETADO 44 4.2. DISEÑO DE LA INFORMACION 50 4.3. DISEÑO VISUAL 52 4.4. PROTOTIPADO 55

4.4.1. Prototipo 1: Página principal 57 4.4.2. Prototipo 2: Docencia. Estudios 58 4.4.3. Prototipo 3: Docencia. Item titulación 59 4.4.4. Prototipo 4: Docencia. Asignaturas 60 4.4.5. Prototipo 5: Docencia. Item asignaturas 61 4.4.6. Prototipo 6: Docencia. Tutorías 62 4.4.7. Prototipo 7: Docencia. Proyectos 63 4.4.8. Prototipo 8: Investigación. Grupos 64 4.4.9. Prototipo 9: Investigación. Publicaciones 65 4.4.10. Prototipo 10: Investigación. Seminarios 66 4.4.11. Prototipo 11: Personal. Profesores 67 4.4.12. Prototipo 12: Personal. Item profesor 68 4.4.13. Prototipo 13: Gestión 69 4.4.14. Prototipo 14: Media fidelidad. Página principal 70

5. IMPLEMENTACION 71 5.1. INSTALACION DE DRUPAL 71 5.1.1.Entornos de usuario y administración 71 5.1.2. Traducción de la interfaz 74 5.1.3. Configuración de la fecha y hora 75 5.1.4. Formato de entrada 76 5.1.5. Información del sitio 77 5.1.6. URL limpios 78 5.2. MODULOS 79 5.2.1. Localización e instalación de módulos 79 5.2.2. Instalación de módulos contribuidos 80 5.2.3. Definición de módulos 81 5.2.4. Activación de módulos 86 5.3. DESARROLLO 90 5.3.1. Componentes del sistema de gestión de contenidos 90 5.3.2. Menú de administración 91 5.3.3. Configuración de módulos contribuidos generales 94 5.3.4. Creación de menús 106 5.3.5. Creación de roles 109 5.3.6. Cuadro resumen de tipos de contenido creados 110 5.3.7. Cuadro resumen de categorías creadas 111 5.3.8. Cuadro resumen de vistas creadas 112

Page 6: PFC Antonio Bernal Baena

6

5.3.9. Casos de implementación del inventario de contenidos 115 5.3.9.1. Estudio del caso: Localización 115 5.3.9.1.1. Configuración de módulos 115 5.3.9.1.2. Creación de tipos de contenido 116 5.3.9.1.3. Creación de elementos de menú 120 5.3.9.1.4. Visibilidad de bloques 121 5.3.9.1.5. Prototipos de pantalla 122 5.3.9.2. Estudio del caso: Contacto 123 5.3.9.2.1. Configuración de módulos 124 5.3.9.2.2. Creación de elementos de menú 126 5.3.9.2.3. Prototipos de pantalla 128 5.3.9.3. Estudio del caso: Enlaces 129 5.3.9.3.1. Configuración de módulos 129 5.3.9.3.2. Creación de tipos de contenido 130 5.3.9.3.3. Creación de categorías 131 5.3.9.3.4. Creación de campos 135 5.3.9.3.5. Creación de vistas 137 5.3.9.3.6. Creación de elementos de menú 140 5.3.9.3.7. Prototipos de pantalla 141 5.3.9.4. Estudio del caso: Buscar 142 5.3.9.4.1. Configuración de módulos 142 5.3.9.4.2. Prototipos de pantalla 143

5.3.9.5. Estudio del caso: Destacados 144 5.3.9.5.1. Creación de tipos de contenido 144 5.3.9.5.2. Creación de campos 148 5.3.9.5.3. Creación de vistas 150 5.3.9.5.4. Prototipos de pantalla 154

5.3.9.6. Estudio del caso: Personal 155 5.3.9.6.1. Configuración de módulos 158 5.3.9.6.2. Creación de tipos de contenido 159 5.3.9.6.3. Creación de categorías 162 5.3.9.6.4. Creación de campos 164 5.3.9.6.5. Creación de vistas 167 5.3.9.6.6. Creación de elementos de menú 184 5.3.9.6.7. Visibilidad de bloques 188 5.3.9.6.8. Prototipos de pantalla 189

5.3.9.7. Estudio del caso: Docencia. Estudios 193 5.3.9.7.1. Creación de tipos de contenido 195 5.3.9.7.2. Creación de categorías 196 5.3.9.7.3. Creación de campos 198 5.3.9.7.4. Creación de vistas 200 5.3.9.7.5. Creación de elementos de menú 209 5.3.9.7.6. Visibilidad de bloques 212 5.3.9.7.7. Prototipos de pantalla 213

Page 7: PFC Antonio Bernal Baena

7

5.3.9.8. Estudio del caso: Docencia. Asignaturas 217 5.3.9.8.1. Configuración de módulos 219

5.3.9.8.2. Creación de tipos de contenido 221 5.3.9.8.3. Creación de categorías 223 5.3.9.8.4. Creación de campos 225 5.3.9.8.5. Creación de vistas 232 5.3.9.8.6. Creación de elementos de menú 246 5.3.9.8.7. Visibilidad de bloques 247 5.3.9.8.8. Prototipos de pantalla 248

5.3.9.9. Estudio del caso: PFC / Fin de máster 249 5.3.9.9.1. Creación de tipos de contenido 250

5.3.9.9.2. Creación de categorías 251 5.3.9.9.3. Creación de campos 252 5.3.9.9.4. Creación de vistas 255 5.3.9.9.5. Creación de elementos de menú 258 5.3.9.9.6. Prototipos de pantalla 259

5.3.9.10. Estudio del caso: Tutorías 260 5.3.9.10.1. Creación de vistas 261 5.3.9.10.2. Creación de elementos de menú 264 5.3.9.10.3. Prototipos de pantalla 265

5.3.9.11. Estudio del caso: Investigación 266 5.3.9.11.1. Configuración de módulos 267

5.3.9.11.2. Creación de tipos de contenido 268 5.3.9.11.3. Creación de campos 271 5.3.9.11.4. Creación de vistas 276 5.3.9.11.5. Creación de elementos de menú 282 5.3.9.11.6. Visibilidad de bloques 284 5.3.9.11.7. Prototipos de pantalla 285

5.3.9.12. Estudio del caso: Gestión y Calendario 288 5.3.9.12.1. Configuración de módulos 289

5.3.9.12.2. Creación de tipos de contenido 294 5.3.9.12.3. Creación de categorías 296 5.3.9.12.4. Creación de campos 297 5.3.9.12.5. Creación de vistas 300 5.3.9.12.6. Creación de elementos de menú 310 5.3.9.12.7. Visibilidad de bloques 311 5.3.9.12.8. Prototipos de pantalla 312

5.3.9.13. Estudio del caso: Utilidades de los usuarios 313 5.3.9.13.1. Configuración de módulos 314

5.3.9.14. Estudio del caso: Control de acceso 319 5.3.9.14.1. Configuración de módulos 320 5.3.9.14.2. Creación de elementos de menú 321 5.3.9.14.3. Asignación de permisos 324

Page 8: PFC Antonio Bernal Baena

8

5.3.10. Tema 325 5.3.10.1. Tema framebasico 327 5.3.10.2. Instalación del tema 329 5.3.10.3. Mostrar un menú de enlaces hacia la UHU 332 5.3.10.4. Mostrar una galería de imágenes aleatorias 334 5.3.10.4.1. Configuración de módulos 336 5.3.10.4.2. Creación de tipos de contenido 339 5.3.10.4.3. Creación de campos 340 5.3.10.4.4. Creación de vistas 342 5.3.10.4.5. Visibilidad de bloques 344 5.3.10.4.6. Prototipos de pantalla 345 5.4. DISTRIBUCION DEL SITIO 346 6. EVALUACION 350 6.1. GUIA DE EVALUACION HEURISTICA PARA LA VALIDACION DE LA USABILIDAD DEL SITIO 350

6.1.1. Checklist del sitio Web 352 7. CONCLUSIONES 354 7.1. MANTENIMIENTO 354 7.2. EXTENSIONES Y MEJORAS 355 8. BIBLIOGRAFIA 356 9. ANEXOS 357 9.1. MANUAL DE INSTALACION 357 9.1.1. Introducción 357 9.1.2. Requisitos del sistema 358 9.1.3. Instalación de Drupal 5 usando cPanel 359 9.1.4. Instalación de la distribución 365 9.1.5. Actualización de la versión de drupal 373 9.1.6. Actualización de la versión de las extensiones 376 9.1.7. Rendimiento de la instalación 379

Page 9: PFC Antonio Bernal Baena

9

9.2. MANUAL DEL USUARIO 380 9.2.1. Introducción 380 9.2.2. Usuario administrador 381 9.2.3. Definición de formularios 382 9.2.4. Permisos de los usuarios del sistema 383 9.2.5. Roles activos 385 9.2.6. Alta y edición de usuarios 386 9.2.7. Gestión de contenidos 390 9.2.7.1. Alta de administrador 390 9.2.7.1.1. Ficha de personal 390 9.2.7.1.2. Suscripciones 391 9.2.7.1.3. Otros contenidos del sistema 391 9.2.7.2. Edición de administrador 392 9.2.7.2.1. Ficha de personal 392 9.2.7.2.2. Otros contenidos del sistema 392 9.2.7.3. Alta de contenido por otros roles 393 9.2.7.4. Edición de contenidos por otros roles 394 9.2.7.4.1. Ficha de personal 394 9.2.7.4.2. Datos del usuario 394 9.2.7.4.3. Suscripciones 394 9.2.7.4.4. Procedimiento general 395 9.2.8. Formulario de ficha de personal 396 9.2.9. Formulario de titulación 397 9.2.10. Formulario de asignatura 398 9.2.11. Formulario de noticias 399 9.2.12. Formulario de proyecto FC/FM 400 9.2.13. Formulario de grupo de investigación 401 9.2.14. Formulario de seminario 402 9.2.15. Formulario de comisión permanente 403 9.2.16. Formulario de consejo de departamento 404 9.2.17. Formulario de publicaciones 405 9.2.18. Formulario de destacados 406 9.2.19. Formulario de Web links 407 9.2.20. Formulario de imagen portada 408 9.2.21. Personalización del departamento 409 9.2.21.1. Identificación del departamento 409 9.2.21.2. Formulario de página estática 410 9.2.21.3. Formulario de contacto 411 9.2.21.4. Modificar categorías 411

Page 10: PFC Antonio Bernal Baena

10

1. INTRODUCCION 1.1. CONCEPTOS PREVIOS El proyecto de creación del nuevo portal Web del Departamento de Tecnologías de la Información de la Universidad de Huelva parte de la necesidad que tiene este organismo de actualizar su medio de comunicación digital. El proyecto pretende, como parte fundamental, establecer un sistema de información con la comunidad educativa relacionada con el Departamento, ofreciendo el conocimiento acerca de los diferentes contenidos académicos a los diferentes tipos de usuarios que accedan. Durante el desarrollo del proyecto el Departamento será entendido como nuestro cliente, el cual, bien por decisión propia o a través de una prospección comercial de nuestra empresa ha identificado la necesidad de renovación de su portal Web. Por tanto desde la fase de Planificación estamos ya en contacto con nuestro cliente y debemos establecer los canales adecuados para facilitar la comunicación y la colaboración. 1.2. EL PROYECTO El proyecto consistirá en el diseño de una aplicación Web para la gestión y organización de un departamento universitario personalizando la herramienta Drupal. Diseñaremos el sitio Web corporativo del Departamento de Tecnologías de la Información de la Universidad de Huelva. Vamos a desarrollar un sistema formado por dos ámbitos:

- Sitio Web para el usuario final - Sistema de gestión de contenidos para el administrador y otros tipos

de usuario con acceso autorizado por el Departamento.

Page 11: PFC Antonio Bernal Baena

11

Finalmente se entregará una Distribución del sistema para que pueda ser implantado en los Departamentos de la Universidad de Huelva que así lo requieran. Por tanto el sistema deberá ser personalizable para responder a las características académicas de otros departamentos de la Universidad. Efectuaremos la implementación del producto sobre el sistema de gestión de contenidos Drupal con el objetivo de revisar las posibilidades de desarrollo que ofrece esta herramienta.

Page 12: PFC Antonio Bernal Baena

12

2. PLANIFICACION 2.1. HERRAMIENTAS Para desarrollar una aplicación Web se nos plantea la dificultad de elegir una herramienta de desarrollo del portal que nos permita disponer de un soporte que agilice el desarrollo, que permita el crecimiento natural de la Web, que sea extensible, flexible, robusto y seguro y que, además, cubra las necesidades específicas que esta Web requiere permitiendo cumplir con una metodología de diseño e implementación apropiadas.

Las características generales que esta Web deberá cumplir son:

Creación de menús con enlaces internos y externos de forma simplificada

Gestión de usuarios organizados por roles o conjuntos de permisos (administradores y otros miembros del portal).

Buscador interno con sistema de búsqueda avanzada Formato de contenidos extensible, con la posibilidad de

incorporación de nuevos campos de tipo texto, fecha, categorías, imágenes.

Sistema de categorías basadas en taxonomías Editor de texto enriquecido WYSIWYG con filtro de etiquetas HTML Cambio de diseño basado en el sistema de plantillas del gestor

2.1.1. Sistemas para la gestión de contenidos Distinguiremos entre dos vías para gestionar contenidos: 1. Publicarlos en un sistema alojado (ASP) gratuito o de pago, donde residirá toda la tecnología, y sobre el que generaremos, almacenaremos y estructuraremos nuestra información. 2. Creación de un sistema de publicación propio, en nuestros propios servidores, usando gestores de contenidos comerciales o de software libre. En el primer caso somos usuarios de un servicio de publicación. En el segundo aplicamos una solución tecnológica de gestión de contenidos orientado a la difusión de información de todo tipo en Web con código abierto.

Page 13: PFC Antonio Bernal Baena

13

2.1.2. Percepción del usuario acerca del CMS Desde el punto de vista del usuario interno: Sistema para gestionar, de forma uniforme, accesible, y cómoda, un sitio Web dinámico, con actualizaciones periódicas, y sobre el que pueden trabajar una o más personas, cada una de las cuales tiene una función determinada. Desde el punto de vista del usuario del Web Sitio Web dinámico, con apariencia e interfaz uniforme, con un diseño centrado en el usuario, y que permite llevar a cabo fácilmente las tareas para las que ha sido diseñado. 2.1.3. Tipos de gestores de contenido Generalmente encontramos:

• Galerías de imágenes y fotos • Blogs • Aula Virtual • Foros

Están centrados en realizar una tarea. Además sobre ellos se han desarrollado extensiones que permiten ampliar sus funciones básicas. Podemos funcionar con varias aplicaciones especializadas, o pensar en usar un gestor de contenidos de propósito general. Una de las tendencias de las tecnologías llamadas Web 2.0 es la posibilidad de encajar piezas de un modo sencillo, piezas de contenidos procedentes de diferentes plataformas. En la Web nos encontramos muchos servicios de publicación y difusión de contenidos online (ASP, Aplication Server Provider). Se trata de webs que ofrecen la plataforma de publicación. Son sistemas de puesta en marcha inmediata, y con un número reducido de opciones de personalización, pero de gran potencia y gran capacidad de convocatoria. Por ejemplo:

• Blogger, como ASP para publicar blogs. • Flickr, como ASP para gestionar fotografías. • Youtube, como ASP para compartir videos. • Slideshare, como ASP para publicar presentaciones.

Page 14: PFC Antonio Bernal Baena

14

Nosotros usaremos una plataforma que podemos instalar para gestionar nuestro proyecto individual, y por lo tanto construir con ellas algo diferente, adaptado y potente. Por lo tanto nos exigirá:

• Gestión completa (Servidores, Seguridad, Actualización, etc.) • Personalización visual. • Posibilidad de desarrollos específicos, programados por nuestro

equipo. 2.1.4. Software libre para gestión de contenidos Bitácoras, Blogs o Weblogs Una bitácora o weblog es una página en la que una o varias personas publican artículos. Normalmente usa un CMS sencillo, con una serie de características comunes:

• Publicación y gestión de artículos con edición de código HTML • Posibilidad de adjuntar imágenes a los artículos • Organización de los contenidos con buscador y categorías • Sistema para que los usuarios dejen comentarios y para recibir

referencias • Sindicación

Algunos de los sistemas de publicación de bitácoras más populares son los siguientes:

• Wordpress http://wordpress.org/ Muy potente debido a la gran cantidad de funcionalidades añadidas (plugins), así como a los muchísimos temas (plantillas de presentación y hojas de estilos) que desarrollan los propios usuarios.

• Textpattern http://textpattern.com/ También tiene plugins y temas, y, aunque aprender a utilizarlo es un poco más complejo, usa un sistema muy potente de edición de las páginas, y su propio lenguaje, Textile, para el formato de los artículos.

Page 15: PFC Antonio Bernal Baena

15

Portales Un portal está formado por una o varias secciones donde se publican noticias o se actualiza el contenido periódicamente. Son un tipo de CMS mucho más heterogéneos que los weblogs, algunas de sus principales características son:

• Gestión de las secciones con contenido dinámico • Gestión de páginas estáticas • Gestión de usuarios y permisos • Organización de los contenidos con buscador y categorías • También pueden proporcionar medios para que los usuarios

participen: o Sistemas de comentarios de las noticias o Foros

Algunos de los sistemas para construir portales más populares son los siguientes:

• Joomla http://www.joomla.org/ Permite gestionar un sitio creando páginas estáticas, secciones dinámicas, permitiendo adjuntar documentos y con varios niveles de usuarios con distintos permisos. Joomla es la nueva identidad de Mambo, recientemente liberada.

• Drupal http://drupal.org/ Más enfocado a crear comunidad y a propiciar la participación de usuarios, además de organizar la estructura y contenido del sitio, ofrece foros y sistema de comentarios con weblogs incorporados.

• Spip http://www.spip.net/ Especialmente recomendado para publicaciones tales como revistas o diarios en línea, también ofrece la típica clasificación en secciones y mucha flexibilidad en la creación de diferentes tipos de página y presentación de la información.

• CMS Made Simple http://www.cmsmadesimple.org/ Publicación sencilla, por secciones.

• OpenCMS http://www.opencms.org/ Tiene un alto crecimiento en entornos corporativos (Se basa en Java y J2EE).

Page 16: PFC Antonio Bernal Baena

16

Foros

• PHP BB http://www.phpbb.com/ El sistema más popular de gestión de foros. Cuenta con muchísimas características (avatares, mensajería privada...).

• PUN BB http://www.punbb.org/ Sistema también muy completo que además respeta los estándares y cuenta con múltiples plugins que le aportan nuevas funcionalidades, de forma que se pone incluso a la altura de PHP BB.

• Simple Machines http://www.simplemachines.org/ Muchas funcionalidades y buen rendimiento Wikis Páginas que cualquier visitante puede editar, creando así una aplicación colaborativa, generalmente para construir una base de conocimiento sobre un tema en concreto.

• Media Wiki http://www.mediawiki.org/wiki/MediaWiki

• Tiki Wiki http://info.tikiwiki.org/tiki-index.php

E-learning Cursos por Internet. Sistemas para realizar exámenes, tutorías...

• Moodle http://moodle.org/ Galerías de fotos

• Zen Photo http://www.zenphoto.org/ • Gallery http://gallery.menalto.com/ • Coppermine http://coppermine-gallery.net/

E-Commerce

• OS Commerce http://www.oscommerce.com/ Drupal permite integrarse con Os Commerce, Gallery, hacer foros, hacer blogs y gestionar contenidos al estilo Wiki.

Page 17: PFC Antonio Bernal Baena

17

ECM: Gestión de contenidos en el ámbito empresarial La AIIM (asociación para ayudar a las organizaciones a gestionar su información, http://www.aiim.org) ofreció en 2003 una sencilla definición de la gestión de contenidos empresariales (ECM: Enterprise Content Management): “Las tecnologías utilizadas para capturar, gestionar, guardar, entregar y conservar la información que sustentan los procesos de negocio”. Uno de los elementos clave de este tipo de aplicaciones es la integración. Con la integración de funciones de captura, gestión de documentos entrantes, archivado electrónico, gestión del ciclo de vida de la información, gestión documental, flujo de trabajo, gestión de proceso de negocios y gestión del conocimiento, se aumenta el valor añadido del conjunto para satisfacer las exigencias corporativas de productividad y rentabilidad. CMS-Watch, http://www.cmswatch.com/, edita unos informes que analizan este mercado, en las siguientes categorías, entre otras:

• Web Content Management Trends • Enterprise Portals Trends • ECM Trends • Web Analytics Trends • Enterprise Search Trends.

Las principales plataformas ECMS analizadas son:

• Alfresco: Alfresco ECM • Documentum (EMC): Documentum 5.3 (D5) • Hyland Software, Inc.: OnBase • IBM: FileNet P8 Platform • Interwoven: ECM Solutions • Microsoft: Microsoft Office SharePoint Server 2007 • Open Text: LiveLink ECM • Oracle: Stellent Universal Content Management 7.5 • Vignette: V7 ECM Suite • Xerox: DocuShare 5.0

Page 18: PFC Antonio Bernal Baena

18

La lista de plataformas opensource que se analizan en el ámbito de los gestores de contenidos Web (WCMS) es:

• Alfresco: Alfresco WCM • Drupal: Drupal • eZ Systems: eZ publish (European Edition only) • Joomla Project: Joomla! • Magnolia: Magnolia CMS • Midgard Project: Midgard (European Edition only) • OpenCms: OpenCms • Plone: Plone CMS • TYPO3

En el ámbito de software comercial, comparan:

• Documentum (EMC): Documentum Web Content Management • IBM: Workplace WCM • Interwoven: TeamSite • Oracle: Stellent Web Content Management • RedDot (Open Text): RedDot CMS • Vignette: V7 Content Management

2.1.5. Funcionamiento de los CMS Un CMS separa y conecta los niveles de:

• Presentación visual: incluye todo lo que forma el estilo, estructura y disposición de la página: archivos HTML, hojas de estilo, imágenes decorativas...

• Contenido: incluye todo lo que los autores publican en la página para darlo a conocer: textos, fotografías, vídeos...

• Estructura: Permite decidir los tipos de categorización para cada tipo de contenido, graduar el acceso, crear zonas temáticas, las relaciones entre contenido.

• Acceso: Control de quién y qué puede publicar, qué contenidos pueden verse según tipos de usuarios.

Por "Separa" entendemos que permite una gestión independiente, y por "Conecta" entendemos que permite ponerlos en relación. Un CMS es un entorno dinámico en el que la información se almacena en una base de datos, y se presenta a través del navegador en páginas generadas en un lenguaje de programación (PHP, JSP, ASP, Perl...) que ejecutan un programa en nuestro servidor.

Page 19: PFC Antonio Bernal Baena

19

Una de las bases de la potencia es el control separado del contenido mediante plantillas para la visualización; con aplicaciones que:

• Utilizan bases de datos para permitir que la actualización de la Web se realice a través de sencillos formularios que actualizan plantillas estandarizadas.

• Reduce la complejidad del conocimiento técnico para aportar contenidos.

• Ofrecen servicios complementarios muy diversos: Foros de discusión, gestión de usuarios, etc.

Son bastante flexibles para adaptarse a las necesidades concretas de una publicación digital compleja. 2.1.6. Propuestas y comparación Drupal y WordPress

• En WordPress 2.x incorpora preinstalado un editor visual. En Drupal hay que instalar y configurar extensiones para esa operación tan sencilla.

• En WordPress tienes cientos de plantillas visuales para elegir y empezar. Las plantillas de Drupal son menos y peores.

• La gestión de permisos y roles de Drupal es mucho más avanzada y granular que la de WordPress.

• En WordPress tienes un tipo de contenido principal (el post) y dos complementarios (páginas y enlaces), mientras Drupal desarrolla toda una plataforma para definir contenidos estructurados.

• WordPress trabaja con plantillas sencillas con PHP y Drupal también. • La traducción de Drupal es más minuciosa y profunda que lo que se

aprecia en WordPress, realizada y soportada por Drupal Hispano, http://www.drupal.org.es/.

• Drupal posee cientos de extensiones que aportan multitud de posibilidades para la implementación de un sitio Web para una organización.

Page 20: PFC Antonio Bernal Baena

20

Drupal y Joomla Joomla:

• Muy fácil de instalar y de utilizar con muchas extensiones y módulos.

• La documentación es exhaustiva y concisa. • La interfaz del administrador es intuitiva y potente. • La administración tiene mucha usabilidad y el editor visual de

contenido es bueno. • Parece que escala bien y proporciona muchas opciones de

personalización. • Posee una comunidad amplia y activa.

Drupal:

• Lleva ya bastante tiempo en activo, es estable y tiene un vigoroso desarrollo.

• Posee un buen código, dispone de un sistema granular de permisos y se preocupa por la seguridad.

• La configuración es rapidísima. • Tiene cientos de módulos que extienden su funcionalidad. • Cuenta con una documentación excepcional y con una comunidad

muy activa y abierta. Conclusión Tanto WordPress como Joomla presentan una menor potencia frente a Drupal en dos aspectos básicos para nuestro proyecto:

• Aplicación y gestión de los permisos de usuarios y grupos. • Posibilidad de extender fácilmente los servicios del portal (módulos

contribuidos) para dar respuesta a los requerimientos de nuestro cliente.

Para cerrar la evaluación de propuestas y tomar la decisión final de uso de Drupal como herramienta de desarrollo frente a otras existentes en el mercado también hemos tenido en cuenta la serie de evaluaciones y recomendaciones realizadas por Weitzman, Lewis-Bowen, y Evanchik (2006), ingenieros senior de software de IBM, quienes en busca de una solución para un Sistema de Gestión de Contenidos, realizaron una completa evaluación comparativa entre las diversas soluciones de CMS. Los mencionados ingenieros escogieron Drupal. Fuente: http://www.ibm.com/developerworks/ibm/library/i-osource1/

Page 21: PFC Antonio Bernal Baena

21

2.1.7. Drupal El CMS elegido para el desarrollo ha sido el sistema opensource Drupal, escrito en PHP y distribuido bajo licencia GPL (GNU General Public License) que, además de cumplir con los objetivos y requisitos propuestos, es uno de los gestores con más soporte por su comunidad de usuarios y por los profesionales del medio.

Este CMS irá conectado a una base de datos donde se alojará el contenido del sitio que mantendrá totalmente separado el diseño del mismo.

El sistema de gestión de base de datos usado será MySQL, sobre el servidor de aplicaciones Web Apache.

Actualmente existen dos versiones estables de Drupal y una en desarrollo. Las versiones estables son la v6.x y la 5.x (con la x se indica la última liberación de las versiones 5 y 6 hasta el momento). Aunque la filosofía de la comunidad de desarrollo es mantener al máximo la compatibilidad entre versiones, existen diferencias entre ambas.

Cabría pensar que la elección de la versión 6 es la más apropiada, pero el ritmo lento de adaptación de los módulos más populares a estas diferencias y la lentitud en las traducciones a otros idiomas, provoca que en la decisión deban considerarse otras opciones.

Primero, debemos valorar la importancia que tiene que la interfaz de administración esté traducida totalmente a nuestro idioma, no sólo por una cuestión de usabilidad sino de eficacia. Por otra parte, no podemos permitirnos necesitar un módulo y que éste aún no tenga una versión 6.x lista para instalar.

La versión elegida será la 5.19 (la última revisión hasta la fecha). Las razones son obvias: es una versión estable, completa, a la que no se añadirán cambios en el core que no sean actualizaciones de seguridad, es decir, no cambiarán funcionalidades básicas, lo que nos hace pensar en un mantenimiento más fácil. La versión 5.x es ya veterana, y tiene un amplio soporte desde que se liberara a finales de 2006. Tiene versiones estables y ampliamente contrastadas para todos sus módulos contribuidos esenciales como puedan ser CCK y Views.

Page 22: PFC Antonio Bernal Baena

22

Introducción a Drupal Dries Buytaert, un informático belga y autor original de Drupal, comenzó a desarrollar un gestor de contenidos para páginas dinámicas en el año 2000. El sistema pretendía dar soporte a una comunidad weblog, la cual Dries quiso llamar Dorp (“pueblo” en holandés). Al comprobar la disponibilidad del dominio dorp.org, Dries tecleó mal e introdujo “drop.org” en su lugar. Le gustó tanto el nombre que decidió registrar el dominio drop.org y renombrar su CMS como Drupal. (“Drupal” es la pronunciación en inglés de la palabra gota en holandés, “Druppel”). Nueve años más tarde, Drupal ha crecido hasta convertirse en un gestor de contenido maduro y flexible, con cientos de desarrolladores trabajando en sus mejoras y extensiones. Con Drupal podemos construir casi cualquier tipo de Web, definiendo tipos de contenidos estructurados, permisos, sistema de registro de usuarios, sistemas de categorización y aplicando una combinación personalizada de módulos complementarios. Los Contenidos son la pieza fundamental de Drupal. Tiene un enfoque estructurado, que permite definir tipos de contenidos diferentes, sobre los que se podrán aplicar diferentes permisos, flujos de publicación, categorías y listados. La unidad de contenido es el “nodo”, que inicialmente permite texto como en un blog, pero que se amplia mediante dos vías fundamentales: Módulos contribuidos y Módulo CCK. Los contenidos podrán trabajar con texto enriquecido, tener comentarios, aceptar anexos, tener control de revisiones y generan salidas RSS. Además pueden estructurarse formando “libros” (capítulos y subcapítulos). La organización de información se realiza fundamentalmente a través del potente sistema de categorías. Se definen vocabularios con términos controlados (con jerarquía o no) o etiquetado libre. Para cada contenido se indicará qué vocabulario o vocabularios se le pueden aplicar, y si son opcionales u obligatorios. Las categorías permiten una navegación por diferentes tipos de contenidos vinculados por su pertenencia a un mismo dominio temático. Además, los contenidos pueden adoptar una estructura jerárquica convencional a través del sistema de menús, y la página Web se estructura en bloques que se sitúan en zonas según la plantilla o tema usado (dos o tres columnas, cabecera, pie, etc.).

Page 23: PFC Antonio Bernal Baena

23

Ofrece una gestión de usuarios avanzada, en la que podremos generar un sistema abierto de alta de usuarios, o cerrado o moderado. Los usuarios se agrupan en roles, que permiten manejar los privilegios para cada una de las funcionalidades y módulos. Cada módulo de Drupal ofrece sus propias opciones de permisos, que se aplican por roles. En cuanto a la personalización de la presentación, se usan las plantillas o Temas. Cada tema se compone de unas pocas plantillas que definen la visualización específica de nodos, bloques y página general, aplicando hojas de estilo CSS.

Page 24: PFC Antonio Bernal Baena

24

2.2. METODOLOGIA DE DESARROLLO

2.2.1. Diseño Centrado en el Usuario Principios del Diseño Centrado en el Usuario El Diseño Centrado en el Usuario de sistemas interactivos puede regirse por muchos y muy diversos principios. A continuación, se presenta una serie básica de dichos principios:

• Diseño para los usuarios y sus tareas. • Consistencia. • Diálogo simple y natural. • Reducción del esfuerzo mental del usuario. • Proporcionar realimentación adecuada. • Proporcionar mecanismos de navegación adecuados. • Dejar que el usuario dirija la navegación. • Presentar información clara. • El sistema debe ser amigable. • Reducir el número de errores.

ISO 13407: Human-centred design processes for interactive systems El estándar ISO 13407 constituye un marco que sirve de guía para conseguir el desarrollo de sistemas interactivos usables incorporando el DCU durante el ciclo de vida del desarrollo. El estándar describe las siguientes cuatro actividades que se necesitan desde un principio: a) Entender y especificar el contexto de uso. b) Especificar los requisitos de los usuarios y organizativos. c) Producción de soluciones de diseño. d) Evaluar los diseños confrontándolos con los requisitos.

Page 25: PFC Antonio Bernal Baena

25

Y la naturaleza iterativa de estas actividades está ilustrada en la siguiente figura:

El proceso implica iterar hasta satisfacer los objetivos marcados, para lo que ISO 13407 describe los principios básicos sin estipular métodos específicos. La secuencia de realización o seguimiento de las actividades y el nivel de esfuerzo y detalle apropiado a cada proyecto varía dependiendo del entorno de diseño y el estado del proceso del mismo.

Page 26: PFC Antonio Bernal Baena

26

Los elementos de la Experiencia de Usuario Jesse James Garrett, en su libro “The elements of user experience” define una guía a seguir para el diseño Web centrado en el usuario. El esquema que se muestra a continuación es un resumen de los principios expresados en su libro:

Page 27: PFC Antonio Bernal Baena

27

Existen una serie de métodos específicos desarrollados para llevar a cabo las distintas fases de un diseño Web centrado en el usuario. En la Web oficial de UsabilityNet, (un proyecto financiado por la Unión Europea para proporcionar recursos y la creación de redes de profesionales de la usabilidad, directores y proyectos de la UE) podemos encontrar una utilidad que nos provee de una Tabla de Métodos a aplicar en cada una de las fases que contempla, dependiendo de factores como tiempo disponible, recursos, etc.

Fuente: http://www.usabilitynet.org/tools/methods.htm

Page 28: PFC Antonio Bernal Baena

28

2.2.2. Fases del Proyecto El proyecto presenta tres condicionantes que debemos tener en cuenta para la determinación de las Fases del mismo, así como del tiempo del que podremos disponer para la ejecución de cada una:

• No tendremos acceso directo a los usuarios finales del sistema, fundamentalmente a aquellos que son anónimos.

• Disponemos de un tiempo limitado para la entrega del Sitio Web: 30 días laborales / 240 horas.

• El proyecto se llevará a cabo por una sola persona que deberá de dar solución a las tareas requeridas por cada fase del mismo.

Efectuamos una adaptación de las distintas disciplinas englobadas por la metodología del Diseño Centrado en el Usuario en respuesta a los condicionantes que tenemos.

Page 29: PFC Antonio Bernal Baena

29

El siguiente diagrama integra las etapas del proyecto:

Page 30: PFC Antonio Bernal Baena

30

Como indica el diagrama, las fases de “Análisis de requisitos” y de “Diseño” son cíclicas e iterativas. Esto quiere decir que todo lo que se diseñe debe ser contrastado con el cliente y comprobar que se ciñe a los resultados del análisis de requisitos. Las fases de “Implementación” y de “Evaluación” serán igualmente cíclicas e iterativas hasta que el proceso quede completado con la fase de “Documentación de la aplicación” en donde se realizará la documentación entregable al cliente y el “Lanzamiento del Sitio”, es decir, la puesta en explotación del sistema hacia la audiencia. Asignación de tiempos La siguiente tabla muestra la estimación de tiempo en base a días que podemos asignar a cada fase del proyecto.

Fases Tiempo (días) Planificación 2 Análisis de requisitos 3 Diseño 5 Implementación 15 Evaluación 2 Documentación de la aplicación 3 Total 30

Utilizaremos un diagrama de Gantt con el objetivo de mostrar el tiempo de dedicación previsto para las diferentes fases del proyecto a lo largo del tiempo total que se ha determinado consistente en 30 días laborales. Mostraremos dos variedades del mismo diagrama para visualizar mejor las etapas a desarrollar en base a los días y a una vista global del mes de trabajo. Estas fechas han sido previamente consensuadas con el cliente a fin de cumplir con los plazos de colaboración necesaria para el avance del proyecto, fundamentalmente en las etapas preliminares a la propia implementación del sistema.

Page 31: PFC Antonio Bernal Baena

31

Diagrama de Gantt con vista mensual:

Diagrama de Gantt con vista diaria:

Page 32: PFC Antonio Bernal Baena

32

2.3. VIABILIDAD 2.3.1. Viabilidad legal Drupal se distribuye bajo la licencia GNU General Public License (GPL), y por lo tanto es software libre. 2.3.2. Viabilidad tecnológica Los requerimientos mínimos y recomendaciones para un sistema que soporte Drupal son:

• Servidor Web Apache • PHP • Servidor de Bases de Datos MySQL

Con la finalidad de que el cliente pueda conocer en tiempo real el estatus del proyecto y facilitar la colaboración del mismo durante su desarrollo contrataremos un servicio de hosting para alojar el sitio Web objeto del proyecto, tomando todas las precauciones necesarias para protegerla de los buscadores hasta su lanzamiento. Contrataremos un dominio y el servicio deberá de disponer de varias cuentas independientes para poder efectuar pruebas en remoto. Instalaremos Drupal a través de la utilidad cPanel a tal efecto. Estas informaciones quedarán ampliadas en la documentación que será aportada con la aplicación. Una vez finalizado el proyecto se cancelarán las cuentas y el dominio que fueron contratados para su ejecución, alojando el cliente la aplicación en sus propios servidores u otros recursos que considere oportunos.

Page 33: PFC Antonio Bernal Baena

33

2.3.3. Viabilidad económica Estimación de RR.HH. componentes del equipo de desarrollo Web

• Ejecutivo de cuentas • Arquitecto de información • Consultor de usabilidad • Diseñador gráfico • Analista-programador

Podríamos incluir otras figuras como director de proyecto, especialista en bases de datos, etc. Estimación de costes de producción

• Personal: salario bruto anual estimado por persona componente del equipo igual a 24.000 € equivalentes a 11,90 €/hora laboral sobre un promedio de 21 días laborales mensuales con 8 horas de trabajo diarias (contemplamos 12 meses incluyendo el coste de vacaciones).

En nuestro proyecto participa una sola persona que realiza las cinco funciones básicas estimadas, por tanto el coste de la hora de esta única persona debería de ser la suma de las capacidades y desempeños de todo un equipo:

11,90 € * 5 = 59,5 €/hora

• Otras estimaciones de costes de producción en base mensual:

Recurso Coste mensual Alquiler de oficina 700 € Luz 80 € Teléfono 30 € Alquiler del servicio hosting multicuenta 29 € Alquiler de dominio 10,44 €/año Total otros costes del proyecto 849,44 €

• Desestimamos los siguientes costes: Seguros e impuestos Recursos hardware Recursos software (en todo caso Drupal es software libre

cuya licencia por tanto es gratuita).

Page 34: PFC Antonio Bernal Baena

34

Resultado:

Componente Coste 240 horas de trabajo x 59,5 €/hora 14.280 € Otros costes estimados 849,44 € Total 15.129,44 € Estimación del precio final al cliente Hoy en día un producto hardware de consumo fluctúa en unos márgenes comerciales que pueden ir del 5% al 15% de promedio. El proyecto incluye una Distribución libre de la aplicación que puede ser instalada en otros Departamentos de la Universidad cuya potencialidad como clientes bajaría en este sentido. El margen comercial a aplicar no debería ser menor del 25%. Resultado:

Componente Precio Estimación de costes de producción 15.129,44 € 25% de margen comercial 3.782,36 € Subtotal 18.911,80 € 16% I.V.A. 3.025,89 € Total 21.937,69 €

Precio final al cliente I.V.A. incluido 21.937,69 €

Contrato de mantenimiento Una acción futura para la figura del ejecutivo de cuentas podría consistir en la negociación de un contrato de mantenimiento para la aplicación con los diversos Departamentos que la instalen.

Page 35: PFC Antonio Bernal Baena

35

3. ANALISIS DE REQUISITOS 3.1. ENTREVISTA CON EL CLIENTE Identificamos el interlocutor válido del Departamento; será la persona que actuará como facilitador durante el desarrollo del proyecto y con quién deberemos estar en contacto de forma continuada en todas sus fases. Puede tratarse de una o varias personas; en nuestro caso estableceremos que se trata de una sola y que actúa como representante de los decisores finales, filtrando la información y colaborando activamente en la definición de la misión y los objetivos del sitio Web. 3.2. EVALUACION DE OTROS SITIOS WEB Una de las técnicas utilizadas en la ejecución de proyectos relacionados con la elaboración de sitios Web consiste en la evaluación de productos similares al que vamos a desarrollar, con el fin de identificar sus características y facilitar la toma de decisiones por parte del cliente en cuanto a sus propios requerimientos. Muestra externa Tomamos como muestra dos departamentos universitarios, uno de la Universidad de Sevilla y otro de la Universidad de Granada. Los aspectos que se consideraron más apropiados para evaluar en este caso fueron los referentes a la estructura del sitio, organización de contenidos y navegación.

Page 36: PFC Antonio Bernal Baena

36

Fuente: http://www.lsi.us.es/

Fuente: http://decsai.ugr.es/

Page 37: PFC Antonio Bernal Baena

37

Diagramamos en papel el mapa del sitio y situamos las etiquetas de contenidos. Posteriormente se presentaron estos diagramas a nuestro cliente con el fin de concretar los primeros contenidos de nuestro portal. Ejemplo del diagramado en papel:

Page 38: PFC Antonio Bernal Baena

38

Muestra interna Hemos usado el portal Web de la Universidad de Huelva como muestra final en donde hemos encontrado los recursos necesarios para:

1. Obtener los datos precisos para la definición del look & feel de nuestro sitio.

Fuente: http://www.uhu.es/sevirtual/

2. Obtener la documentación oficial en base a la cual estructurar:

El Personal del departamento

Fuente: http://www.uhu.es/sec.general/Normativa/Normativa.htm

La Oferta Académica del departamento Fuente: http://www.uhu.es/estudios/ofertaacademica/ofertaacademica.htm

Page 39: PFC Antonio Bernal Baena

39

3.3 PERFIL DE LOS USUARIOS Dentro del proceso de la metodología del Diseño Centrado en el Usuario existe un aspecto necesario: establecer los perfiles de uso de modo que toda la actividad que se lleve a cabo esté dirigida por los “usuarios tipo” que se identifiquen, para dar respuesta a sus necesidades reales. Esto puede hacerse mediante estudios etnográficos de forma analítica o entrevista con los distintos usuarios de forma experimental; en este sentido también se puede usar el método de encuesta. Estos métodos estarán condicionados por los medios económicos y el periodo de tiempo con los que se cuente desde el inicio hasta la finalización del proyecto. En este caso debemos tener en cuenta el factor tiempo, que es reducido, así que procedemos a adaptar la técnica conocida como “personas” en donde definiríamos arquetipos de usuarios que representen patrones de conducta, objetivo y necesidades, y procedemos a una definición directa de perfiles con la ayuda de nuestro facilitador durante el proceso de entrevista y el análisis de la comunidad universitaria. Teniendo en cuenta a los tipos de personas que atiende la Universidad de Huelva como institución de educación superior, se han determinado, en base a las diversas necesidades de información y tareas que pueden realizar en el sitio Web del Departamento de Tecnologías de la Información en particular y en un Departamento Universitario en general los siguientes grupos de usuarios:

- Aspirantes a estudiantes de educación superior de las ramas de la oferta académica de la Universidad de Huelva en las que el Departamento imparte sus asignaturas.

- Estudiantes adscritos a otras carreras sin relación con las que imparte el Departamento.

- Estudiantes adscritos a los estudios que imparte el Departamento. - Personal docente del Departamento. - Personal administrativo del Departamento.

Page 40: PFC Antonio Bernal Baena

40

3.4. ROLES

Del estudio de los distintos perfiles de los usuarios extraemos una definición de roles del sistema que posteriormente nos servirá para clasificar los objetivos del sitio tanto como Web que es visitada por cualquier tipo de usuario como sistema de gestión de contenidos.

- Usuario anónimo: Por definición será el grupo de usuarios que no tendrá acceso identificado al sistema. Fundamentalmente estará compuesto por el alumnado en general y cualquier persona no incluida en el personal del departamento.

Estudiante: persona matriculada en cualquiera de las

titulaciones universitarias o que pretende cursar alguna de las ofertas académicas.

- Usuario identificado: Por definición un usuario identificado tendrá

acceso al sistema y cierta responsabilidad en la gestión de sus contenidos.

Profesor del departamento: persona encargada de

enseñar o ejercer una disciplina dentro del grupo de formación universitario. Incluye:

• Director del departamento • Secretario del departamento • Administrador del sistema: persona encargada

de gestionar la Web, su contenido y su funcionamiento.

Administrativos del departamento. Becarios adscritos al departamento. Estudiantes pertenecientes al Consejo de

Departamento.

Page 41: PFC Antonio Bernal Baena

41

3.5. MISION DEL SITIO El sitio Web del Departamento de Tecnologías de la Información de la Universidad de Huelva facilitará a los usuarios, tanto internos como externos, el acceso a la información corporativa y a los servicios académicos que ofrece la entidad. El personal adscrito al Departamento gestionará en base a sus distintos niveles de responsabilidad la información que se presente a la audiencia del sitio. 3.6. OBJETIVOS DEL SITIO De la información recabada de la entrevista con el profesor representante del departamento así como del estudio del perfil de los usuarios y su agrupación en roles obtenemos el conjunto de requisitos que debe de cumplir el sitio Web. 3.6.1. Requisitos del sitio Web para el usuario final La relación de estos requisitos se establece en base a la visión de los usuarios finales del Web, entendiendo que agrupa tanto al conjunto de usuarios anónimos como a los distintos roles que componen el grupo de usuarios identificados.

- Consistencia corporativa en el look & feel del sitio. - Localización: se incluirá un apartado con un mapa tipo Google que

reflejará la dirección y coordenadas GPS de la ubicación del departamento.

- Contacto: datos de contacto telefónico, fax, correo así como un formulario electrónico. Existirá un formulario electrónico general del departamento y uno para cada uno de sus componentes a fin de que cualquier usuario anónimo pueda dirigirse en particular a cualquier miembro del departamento. Se incluirá un control anti-spam.

- Enlaces: utilidad de enlaces a favoritos del departamento. - Búsqueda: se situará un buscador en la página inicial del sitio así

como en diversas páginas de contenido. - Calendario del departamento: incorporará las convocatorias de

comisiones y consejos, así como las fechas de los seminarios que se impartan. En este punto el rol “secretario” deberá disponer de una utilidad para la distribución electrónica de las convocatorias.

- Personal: información académica de los distintos usuarios que componen el departamento, incluyendo el área del mismo al que pertenecen, su rol académico y los órganos de gobierno a los que puedan pertenecer dentro de la estructura del departamento.

Page 42: PFC Antonio Bernal Baena

42

Adicionalmente la ficha individual de personal de cada profesor deberá de presentar la siguiente información:

- Asignaturas que imparte - Grupos de investigación a los que pertenece - Proyectos fin de carrera o de máster que coordina

- Titulación: se desglosarán las carreras de la Universidad de Huelva

en las que el departamento imparte las distintas asignaturas agrupando los estudios de forma que se tenga en cuenta los actuales de primer y segundo ciclo, el Espacio Europeo de Educación Superior, así como los masters oficiales y formación permanente relacionada o impartida por el profesorado del departamento. Adicionalmente deberá incluirse el listado de asignaturas que imparte el departamento en cada una de las titulaciones.

- Asignaturas: relación de asignaturas impartidas por el departamento en base al conjunto de titulaciones así como de otros estudios contemplados. Se ordenarán por año académico y serán diferenciadas por área.

- Noticias: utilidad de noticias del departamento. Así mismo los profesores dispondrán de la posibilidad de generar noticias referentes a las asignaturas que se imparten.

- Noticias destacadas: formarán parte de la página principal de la Web.

- Proyectos fin de carrera o fin de máster: oferta de proyectos que coordinen los distintos profesores del departamento. Debe reflejar el estatus del proyecto, fundamentalmente su disponibilidad.

- Tutorías: información sobre horarios y despachos para las tutorías del alumnado.

- Grupo de investigación: relación de grupos de investigación compuestos por profesores del departamento.

- Publicaciones: bibliografía recomendada por el profesorado del departamento. Existirá una información general bibliográfica así como la posibilidad de concretarla en las asignaturas particulares.

- Seminario: información relacionada con seminarios que imparta el departamento o inclusión de aquellos que por su relevancia académica se estimen oportunos.

- Cualquier contenido podrá incorporar un PDF como guía que pueda ser fácilmente descargable por el usuario. Así mismo la presentación de las fichas de los contenidos: titulaciones, asignaturas, personal, etc. deberá incorporar una utilidad de impresión, envío por correo electrónico o descarga en formato PDF a voluntad del usuario de la Web.

Page 43: PFC Antonio Bernal Baena

43

3.6.2. Requisitos del sitio Web para los usuarios con acceso autorizado La relación de estos requisitos se establece en base a la visión de los usuarios identificados del Web como sistema de gestión de contenidos en donde cada uno de los roles podrá ejecutar una serie de acciones dependiendo de los permisos que le hayan sido adjudicados por el administrador del sistema. Con el fin de clarificar los distintos requisitos establecemos la siguiente tabla:

Acceso identificado de los Usuarios Permisos del usuario Profesores Director Secretario Estudiantes PAS

Editar su propia ficha de personal • • •

Editar su propia asignatura • • •

Crear y Editar su propio Proyecto FC/FM • • •

Crear y Editar sus propias Noticias • • •

Editar Grupo de Investigación • • •

Crear y Editar su propio Seminario • • •

Crear y Editar Comisión Permanente •

Crear y Editar Consejo de Departamento

Crear y Editar Destacados • •

Crear y Editar Publicaciones • • •

Crear y Editar Enlaces • • •

Suscripción por mail a convocatorias • • • • • El usuario administrador del sistema dispone de todos los privilegios para la administración del Portal, sus principales responsabilidades serán:

- Configuración de la plataforma personalizando las áreas de contenidos que se precisen - Actualización de los contenidos de la Web - Gestión de altas y bajas de usuarios - Control de acceso a las zonas públicas y privadas de la Web - Actualización del software del CMS

Page 44: PFC Antonio Bernal Baena

44

4. DISEÑO 4.1. INVENTARIO DE CONTENIDOS Y ETIQUETADO De acuerdo a los resultados obtenidos en la fase de “Análisis de Requisitos” se propone una estructura de organización de contenidos y se establece el siguiente sistema de organización para el sitio Web del Departamento. Representaremos así mismo el etiquetado tanto de los distintos menús y elementos de menú como de los campos que componen las fichas de contenido que se presentan al usuario cuando éste accede a uno de los ítems representados como vista de tabla o como vista de lista de elementos. Las etiquetas las rotularemos en azul para su mejor identificación en la tabla.

Page 45: PFC Antonio Bernal Baena

45

Menú Elemento del

menú Presentación de la

información al usuario

Ficha de Contenido que se presenta al usuario

Destacados

Lista de “Destacados” 2 ítems.

Ficha de contenido “Destacados”: Titular Texto Imagen

Noticias

Lista de “Noticias” 5 ítems.

Ficha de contenido “Noticias”: Título Asignatura de referencia Cuerpo

Universidad de Huelva

Accesos:

Rectorado Servicios Centros

Logotipo de la Universidad de Huelva con imágenes de portada aleatorias. Dichas imágenes serán personalizables por el administrador. Los accesos redirigirán al usuario al portal de la Universidad de Huelva.

Localización

Mapa Google Ficha de contenido “Localización”

Contacto

Formulario de contacto con el Departamento

Ficha de contenido “Contacto”

Enlaces

Tabla de “Enlaces”: Web Descripción *Buscar por texto *Categoría

Ficha de contenido “Web Links”: Link Name URL Web Links: Boletines Oficiales, Instituciones Académicas, Prensa, Publicaciones científicas o Sociedades científicas. Descripción del sitio

Noticias

Lista de “Noticias” Todas las noticias

Ficha de contenido “Noticias”: Título Asignatura de referencia Cuerpo

Acceso Identificado Iniciar sesión o Solicitar nueva contraseña

Buscar

Buscador

Calendario Imagen Calendario

Vista mensual Anotaciones del Calendario: Seminarios Comisiones Permanentes Consejos de Departamento

Docencia Estudios 1º y 2º

Ciclo

Tabla de “Licenciatura + Diplomatura + Ingeniería + Ingeniería Técnica”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Licenciatura, Diplomatura, Ingeniería, Ingeniería Técnica), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Page 46: PFC Antonio Bernal Baena

46

EEES

Tabla de “Grado + Posgrado-Máster + Posgrado-Doctorado”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Grado, Posgrado-Máster, Posgrado-Doctorado), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Máster Oficial

Tabla de “Máster Oficial”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Máster Oficial), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Formación Permanente

Tabla de “Curso + Título de Experto + Máster”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Curso, Título de Experto, Máster), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Asignaturas

Tabla de “Asignaturas Impartidas”: Asignatura Coordinador Año Académico *Búsqueda por texto *Áreas

Ficha de contenido “Asignatura”: Nombre de la asignatura, Código de la asignatura, Titulación, Créditos, Año Académico (2009/2010, 2010/2011, 2011/2012), Curso / Cuatrimestre (Primero, Segundo, Tercero, Cuarto, Quinto ), Área (CCIA, LSI) , Coordinador, Acceso para el coordinador, Profesores de la asignatura, Descriptores de la asignatura, Guía docente, Web, Bibliografía recomendada. Lista de “Noticias” de la asignatura

Tutorías

Tabla de “Tutorías”: Profesor Horario Despacho

PFC/Fin Máster

Tabla de “Proyectos FC/FM”: Título del proyecto Coordinador Disponibilidad

Ficha de contenido “Proyecto FC/FM”: Título, Código del proyecto, Créditos, Titulación, Año Académico (2009/2010, 2010/2011, 2011/2012), Curso / Cuatrimestre (Primero, Segundo, Tercero, Cuarto, Quinto), Área (CCIA, LSI), Disponibilidad (Asignado, Leído, Propuesto), Disponibilidad (detalles), Coordinador del proyecto, Profesores del proyecto, Descripción del proyecto, Guía docente, Web, Bibliografía recomendada.

Page 47: PFC Antonio Bernal Baena

47

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Investigación

Grupos

Tabla de “Grupos de investigación”: Grupo Responsable Web

Ficha de contenido “Grupo de investigación”: Nombre del grupo, Responsable, Miembros del grupo, Web, Descripción del grupo.

Publicaciones

Lista de “Publicaciones” Todas las publicaciones

Ficha de contenido “Publicaciones”: Título Año Autor

Seminarios

Lista de “Seminarios” Todos los seminarios

Ficha de contenido “Seminario”: Título, Descripción del seminario, Fecha, Ponente, Coordinador, Web.

Personal

Profesores

Tabla de “Profesores + Director del Departamento + Secretario del Departamento”: Foto del profesor Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Profesores, Director del departamento, Secretario del departamento), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. Tabla de “Asignaturas” del profesor: Asignatura Titulación Año Académico Tabla de “Grupo de Investigación” del profesor: Grupo Tabla de “Proyectos” del profesor, fin de carrera o fin de máster: Proyecto Disponibilidad “Formulario de Contacto” con el profesor

Administrativos

Tabla de “(PAS) Personal de Administración y Servicios”: Foto del PAS Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil ((PAS) Personal de Administración y Servicios), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el PAS

Becarios

Tabla de “Becarios”: Foto del Becario Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Becarios), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el Becario

Page 48: PFC Antonio Bernal Baena

48

Estudiantes

Tabla de “Estudiantes Consejo del Departamento”: Foto del Estudiante Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Estudiantes Consejo del Departamento), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el Estudiante

Gestión

Menú restringido a usuarios

identificados

Convocatorias

Tabla de “Comisión Permanente”: Convocatoria Fecha

Ficha de contenido “Comisión Permanente”: Convocatoria, Tipo de convocatoria (Ordinaria, Extraordinaria), Fecha, Hora segunda convocatoria, Lugar, Orden del día, Lista de convocados. * Comunicación de la convocatoria vía correo electrónico

Tabla de “Consejo de Departamento”: Convocatoria Fecha

Ficha de contenido “Consejo de Departamento”: Convocatoria, Tipo de convocatoria (Ordinaria, Extraordinaria), Fecha, Hora segunda convocatoria, Lugar, Orden del día, Lista de convocados. * Comunicación de la convocatoria vía correo electrónico

Page 49: PFC Antonio Bernal Baena

49

Inventariamos también como contenidos que tenemos que incorporar en el sitio Web otra serie de requisitos que nos trasladaron los usuarios durante el análisis, en dos tablas:

Utilidades de los Usuarios Iconos de acciones de impresión, envío por e-mail y descarga en PDF de las Fichas de contenido que se presentan al usuario final Carga de archivos en los distintos Tipos de contenido que generarán los usuarios con acceso identificado Control de Spam en los Formularios de contacto

Acceso identificado de los Usuarios Permisos del usuario Profesores Director Secretario Estudiantes PAS

Editar su propia ficha de personal • • •

Editar su propia asignatura • • •

Crear y Editar su propio Proyecto FC/FM • • •

Crear y Editar sus propias Noticias • • •

Editar Grupo de Investigación • • •

Crear y Editar su propio Seminario • • •

Crear y Editar Comisión Permanente •

Crear y Editar Consejo de Departamento

Crear y Editar Destacados • •

Crear y Editar Publicaciones • • •

Crear y Editar Enlaces • • •

Suscripción por mail a convocatorias • • • • • El usuario administrador del sistema dispone de todos los privilegios para la administración del Portal, sus principales responsabilidades serán:

- Configuración de la plataforma personalizando las áreas de contenidos que se precisen - Actualización de los contenidos de la Web - Gestión de altas y bajas de usuarios - Control de acceso a las zonas públicas y privadas de la Web - Actualización del software del CMS

Page 50: PFC Antonio Bernal Baena

50

4.2. DISEÑO DE LA INFORMACION Para el presente proyecto, en el cual estamos aplicando una metodología de desarrollo centrada en el usuario, hemos realizado un diagrama de la arquitectura de la información del sitio en donde se muestra su estructura y la representación de etiquetas que hemos definido durante la realización del inventario de contenidos. Dentro del nivel de detalle del diagrama representaremos las vistas de tabla o vistas de lista generales o particulares de la ficha de contenido de un elemento, sin incluir los campos propios de dicha ficha, y marcando aquellos campos de las vistas que actuarán como link hacia la ficha del elemento. Agruparemos en el mismo bloque los nombres de aquellas tablas cuyo etiquetado de campos sea el mismo para todas ellas con el fin de facilitar la comprensión del diagrama.

Page 51: PFC Antonio Bernal Baena

51

Page 52: PFC Antonio Bernal Baena

52

4.3 DISEÑO VISUAL Uno de los aspectos clave para cumplir con la Misión del sitio Web del Departamento de Tecnologías de la Información es respetar la línea corporativa en el look & feel del sitio de tal forma que el sitio Web quede integrado bajo la “Imagen de Marca” de la Universidad de Huelva. La información de identidad de marca que aplicaremos ha sido obtenida de la Web de la Universidad de Huelva en http://www.uhu.es/sevirtual/, así mismo esta página nos ha servido como guía visual durante el proceso de Implementación del sitio. Utilizaremos CSS durante dicha fase.

Page 53: PFC Antonio Bernal Baena

53

Diseño de la página principal En el diseño de la página principal aplicamos las directrices referentes a identidad y misión del sitio: qué es este sitio y para qué es, así como una distribución del contenido que permita una respuesta satisfactoria del Departamento a las expectativas de conocimiento que el usuario que accede al sitio Web del mismo, espera obtener. Un sitio Web bien estructurado y con una jerarquía clara de contenidos es el aspecto prioritario, complementado durante la navegación por el uso de las breadcrumbs (migas de pan) que deben fundamentalmente de darnos una visión acerca del nivel donde nos encontramos durante la navegación y posibilitarnos el regreso a la página principal. Aspecto corporativo: logos y colores Hemos usado la anterior página Web de la Universidad de Huelva como ejemplo para la composición de la línea corporativa que queremos para nuestro sitio Web extrayendo de la misma los logos de la universidad así como los colores corporativos indicados en la misma, en la dirección Web http://www.uhu.es/sevirtual/#recursos_diseno

Resolución de pantalla El tamaño de pantalla usado es de ancho fijo para pantallas con una resolución mínima de 1024 píxeles, teniendo en cuenta el borde del navegador y el scroll el ancho de la zona de contenidos visible de la Web es de 960 pixels para darle más espacio a los márgenes laterales. Los contenidos de las sucesivas páginas deben de aparecer un poco más arriba de la mitad de la pantalla respecto al ojo del usuario.

Page 54: PFC Antonio Bernal Baena

54

Imágenes Es recomendable dedicar entre el 5 y el 15% de la página de inicio a imágenes. Podrían necesitarse más si su contenido fuera muy visual. Para el sitio Web del Departamento de Tecnologías de la Información teníamos que tener en cuenta también la aparición de imágenes aleatorias en el bloque inferior al nombre del departamento y su personalización por parte del mismo por parte del administrador del sistema de gestión de contenidos. Dichas imágenes deben de tener una resolución máxima que se ajuste independientemente de su formato original al área de contenido al que se adscriben. Es un aspecto que se tendrá en cuenta en la fase de Implementación. A este respecto decidimos cargar imágenes de prueba en blanco y negro para que sea el usuario administrador quién decida qué imágenes situar en el sitio Web en referencia a la imagen corporativa del mismo. Diseño de rótulos

- Crearemos una jerarquía visual clara en cada página. - Dividiremos las páginas en zonas claramente definidas. - Usaremos un claro marcado de contenidos sobre los que se pueda

hacer clic mediante el cambio de color de la tipografía así como la aplicación del subrayado como referencia explícita del link a todo tipo de usuarios que visiten la Web.

- Reduciremos al máximo la posibilidad de ruido visual mediante una aplicación de colores y de imágenes que respeten el concepto de usabilidad.

Page 55: PFC Antonio Bernal Baena

55

4.4. PROTOTIPADO En esta etapa se realizan prototipos o wireframes, término en inglés, del sitio Web. Dichos prototipos describen cómo se verían las páginas individualmente desde una perspectiva arquitectónica. Trataremos de especificar y mostrar claramente en dónde estarán ubicados cada uno de los elementos que componen una determinada página como respuesta al inventario de contenidos y etiquetado ya efectuado. Su realización ayudará también a probar las ideas en contexto, permitiendo visualizar posibilidades y hacer cambios, para evitar en un futuro un posible rediseño entero del sitio. Igualmente, los wireframes contribuirán a decidir cómo agrupar y ordenar los componentes del contenido. Crearemos wireframes para las páginas más importantes del sitio, tales como la página de inicio y los principales elementos de los menús. Identificaremos la posición de ciertos elementos en las páginas de contenido del sitio. El objetivo no será crear wireframes para todas las páginas del sitio, sino para las que configuran la estructura común de la Web. Para no demorar el proceso y por tanto cumplir con los tiempos asignados sin incrementar los costos presupuestados realizaremos prototipos de baja fidelidad de las principales páginas del sitio y posteriormente uno de media fidelidad de la página principal del sitio en donde aplicaremos los requerimientos de look & feel planteados por el Departamento. En cada uno de los prototipos de baja fidelidad se definió mediante cuadros y textos donde debía ir ubicado cada elemento de navegación, búsqueda y contenido. De igual modo hemos usado una tabla de anotaciones para explicar algunos contenidos o interacciones. En el prototipo de media fidelidad hemos aplicado la información suministrada por el Departamento junto con sus requerimientos, siguiendo el apartado de diseño visual (colores y elementos gráficos de la Universidad de Huelva). Cabe destacar en este punto que para realizar cada prototipo se tuvieron en cuenta los resultados del proceso de investigación previa. Así mismo dichos prototipos, siguiendo con una metodología de Diseño Centrado en el Usuario, fueron presentados al Departamento para su revisión y modificación previa a la fase de Implementación.

Page 56: PFC Antonio Bernal Baena

56

En total se han realizado 13 prototipos de baja fidelidad y un prototipo de media fidelidad.

Page 57: PFC Antonio Bernal Baena

57

4.4.1. Prototipo 1: Página principal

PROTOTIPOS DE BAJA FIDELIDAD1Departamento deTecnologías de laInfomaciónPáginaPrincipal Universidad deHuelva - Escuela Politécnica Superior de La RábidaPabellónTorreumbría. Carretera Palos de La Frontera s/n. 21819 Palos de La Frontera.Tel.: 959 217364 Fax: 959 217703No.DESCRIPCION1Logo de la Universidad deHuelva2Regiónnavigation:Menú Universidad deHuelva3Nombre del Departamento.Personalizable.4Región encabezado:Imágenes de portada. Aleatorias.Personalizable.5Ubicación del menú de enlaces primarios delaweb.6Área lateral izquierdo:Menú Calendario y elementos del menú.7Región lateral izquierdo:Menú Docencia y elementos del menú.8Región lateral izquierdo:Menú Investigación y elementos del menú.9Región lateral izquierdo:Menú Personal y elementos del menú.10Región lateral izquierdo:Menú Gestión y elementos del menú.Este menú es visible y accesible en suselementos exclusivamente en el caso deusuarios con permiso de acceso al sistema,una vez se hayan identificadoexitosamente.11Lista de noticias que por su relevanciaformarán parte de la página principal delDepartamento. Como máximo se mostrarándositems. Definidas como Destacados.12Bloque de Noticias relacionadas o no conasignaturas. Complementa el aspecto visualde la página principal del sitioindependientemente de que se puedaacceder a todas las noticias a través delenlace primario Noticias.13FooterRectorado Servicios CentrosImageLOGOUniversidad deHuelvaItem destacadosNoticiasDepartamento de Tecnologías de la InformaciónimageLocalización Contacto Enlaces Noticias Acceso identificadoimageCalendarioDocenciaEstudios 1º y 2º CicloEEESMáster OficialFormación PermanenteAsignaturasTutoríasPFC/FinMásterInvestigaciónGruposPublicacionesSeminariosPersonalProfesoresAdministrativosBecariosEstudiantesGestiónConvocatoriasTextoitem destacadosItem destacadosTextoitem destacadosImage•Item noticias•Item noticiasBuscar12345678910131112

Page 58: PFC Antonio Bernal Baena

58

4.4.2. Prototipo 2: Docencia. Estudios Departamento deTecnologías de la OGOUniversidad deHuelva Diplomatura + Ingeniería + IngenieríaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g g g p g p

Page 59: PFC Antonio Bernal Baena

59

4.4.3. Prototipo 3: Docencia. Item titulación Departamento deTecnologías de la OGOUniversidad deHuelva Departamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g Asignaturas de los estudios g p p p g p

Page 60: PFC Antonio Bernal Baena

60

4.4.4. Prototipo 4: Docencia. Asignaturas Departamento deTecnologías de la OGOUniversidad deHuelvaAsignaturas impartidasDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g búsqueda po te to y d s ó po ea de

Page 61: PFC Antonio Bernal Baena

61

4.4.5. Prototipo 5: Docencia. Item asignaturas Departamento deTecnologías de la OGOUniversidad deHuelvaAsignaturaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g g g p p g g p

Page 62: PFC Antonio Bernal Baena

62

4.4.6. Prototipo 6: Docencia. Tutorías Departamento deTecnologías de la OGOUniversidad deHuelvaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a

Page 63: PFC Antonio Bernal Baena

63

4.4.7. Prototipo 7: Docencia. Proyectos Departamento deTecnologías de laoyectos OGOUniversidad deHuelvaProyectos FC/Departamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a p y p

Page 64: PFC Antonio Bernal Baena

64

4.4.8. Prototipo 8: Investigación. Grupos Departamento deTecnologías de lagG upos OGOUniversidad deHuelvaGrupos de InvestigaciónDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g p g gp g

Page 65: PFC Antonio Bernal Baena

65

4.4.9. Prototipo 9: Investigación. Publicaciones Departamento deTecnologías de lag OGOUniversidad deHuelvaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a p p g

Page 66: PFC Antonio Bernal Baena

66

4.4.10. Prototipo 10: Investigación. Seminarios Departamento deTecnologías de lag OGOUniversidad deHuelvaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g

Page 67: PFC Antonio Bernal Baena

67

4.4.11. Prototipo 11: Personal. Profesores Departamento deTecnologías de la OGOUniversidad deHuelvaProfesores + Director del departamento + Secretario deldepartamentoDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a p p p ) y g p g p q p g p q

Page 68: PFC Antonio Bernal Baena

68

4.4.12. Prototipo 12: Personal. Item profesor Departamento deTecnologías de la OGOUniversidad deHuelvaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so a g AsignaturasGrupos de investigaciónProyectos Ó ga os de Gob e o p p p pp p g q p p p gp g q p p p q p p p p p

Page 69: PFC Antonio Bernal Baena

69

4.4.13. Prototipo 13: Gestión Departamento deTecnologías de la OGOUniversidad deHuelvaDepartamento de Tecnologías de la Informacióng gCa e da ooce c a Investigacióne so aGestión Comisión Permanente p p q q g y p p p p

Page 70: PFC Antonio Bernal Baena

70

4.4.14. Prototipo 14: Media fidelidad. Página principal

PROTOTIPO DE MEDIA FIDELIDAD1Departamento deTecnologías de laInfomaciónPáginaPrincipal Universidad deHuelva - Escuela Politécnica Superior de La RábidaPabellónTorreumbría. Carretera Palos de La Frontera s/n. 21819 Palos de La Frontera.Tel.: 959 217364 Fax: 959 217703No.DESCRIPCION1titulo-uhu.gif2sello-uhu.jpg3Combinación de colores corporativosburdeos y verde en ellook &feel del sitio.4Galería de imágenes aleatorias.Ejemplo:banner03.jpgExtraído dewww.uhu.es/sevirtual/ImageItem destacadosNoticiasDepartamento de Tecnologías de la InformaciónLocalización Contacto Enlaces Noticias Acceso identificadoimageCalendarioDocenciaEstudios 1º y 2º CicloEEESMáster OficialFormación PermanenteAsignaturasTutoríasPFC/FinMásterInvestigaciónGruposPublicacionesSeminariosPersonalProfesoresAdministrativosBecariosEstudiantesGestiónConvocatoriasTextoitem destacadosItem destacadosTextoitem destacadosImage•Item noticias•Item noticiasBuscar RectoradoSevicios Centros

Page 71: PFC Antonio Bernal Baena

71

5. IMPLEMENTACION 5.1. INSTALACION DE DRUPAL Necesitamos un entorno donde corran PHP y MySQL. Sobre nuestro servidor realizaremos tres operaciones:

• Configurar la conexión a una base de datos MySQL. • Subir el código de Drupal mediante FTP. • Ejecutar la instalación en la dirección Web del sitio.

Nosotros hemos contratado un servicio de hosting para efectuar este proyecto, dicho servicio nos provee de la utilidad cPanel y es en este entorno donde instalaremos Drupal 5. Podemos ver una detallada explicación de los pasos del proceso en el Anexo de esta memoria dedicado a tal efecto: Manual de Instalación. Instalación de Drupal 5 usando cPanel. 5.1.1. Entornos de usuario y administración Tanto la administración como el trabajo cotidiano de los usuarios se hacen desde el mismo entorno Drupal. En el menú de navegación tendrá el usuario el acceso a sus opciones básicas de crear contenido, perfil de usuario y logout. Bajo la opción de Administrar se podrá entrar a estas zonas:

– Construcción del sitio

– Gestión del contenido

– Configuración del sitio

– Gestión de usuarios

– Registros

– Ayuda

Page 72: PFC Antonio Bernal Baena

72

Construcción del sitio. Permite trabajar con:

– Bloques. Cajas que se activan en diferentes zonas: cabecera, pie, central, columna izquierda, etc.… según vengan definidas en el tema. Pueden verse siempre o según criterios (usuarios, roles, páginas).

Los bloques se pueden crear de tres formas: manualmente en Administrar > Construcción del sitio > Bloques > Añadir bloque, desde un menú que hayamos creado (siempre que creemos un nuevo menú con enlaces tendremos un nuevo bloque que mostrar) y desde las vistas.

– Menús. Permiten presentar elementos de navegación, que serán presentados visualmente en bloques, o según el tema, en barras horizontales con diferentes efectos.

– Módulos. Permite activar y desactivar módulos.

– Temas. Permite trabajar con las especificaciones de las plantillas de presentación. Un sitio Web puede tener un solo tema o dar la opción al usuario de elegir entre varios.

Dedicaremos un apartado al desarrollo del Tema aplicado en la presente instalación.

Si activamos los módulos correspondientes, también podremos parametrizar:

– Formulario de contacto. Crear un formulario de contacto en el Web, con posibilidad de elección de destinatarios (Categorías).

– Alias de URL. Permite crear un alias personalizado que redirija a cualquiera de las opciones de Drupal.

– Otros módulos contribuidos pueden añadir opciones a este menú.

Page 73: PFC Antonio Bernal Baena

73

Configuración del sitio recoge la mayor parte de las parametrizaciones de carácter general que no son elementos estructurales, de contenido o usuario. Las más habituales son:

– Información del sitio. Indicar el título, slogan, misión, correo de contacto y página de inicio.

– Sistema de archivos. Para ficheros anexos.

– Urls limpios. Evita que la URL contenga “index.php?q=” y mejora la usabilidad.

Además se pueden controlar otros muchos elementos como Día y hora (Definir la zona horario y los formatos de fecha largo y corto), Descarga de archivos (Define las extensiones aceptadas como anexos, el tamaño máximo por fichero y usuario, etc.) Informar de errores (Para indicar las páginas personalizadas de error 403 (Acceso denegado) y 404 (Página no encontrada). O aspectos del registro de eventos, configuración de la búsqueda, rendimiento, caché, etc. Existe una opción para deshabilitar el acceso general al sitio, mientras se realizan tareas de mantenimiento o desarrollo. Si activamos Mantenimiento del sitio, sólo podrá acceder el administrador, y se puede configurar un mensaje para el resto de usuarios. Registros. El administrador encuentra en este apartado dos opciones importantes:

– Informe de estado, que informa sobre la versión de Drupal, PHP, Bases de datos y opciones de configuración

– Disponibilidad de actualizaciones, que informa detalladamente sobre nuevas versiones disponibles.

Gestión de contenido. Es la zona desde donde implementaremos los contenidos y categorías. Existen diferentes tipos de contenido, pero el concepto de unidad que se usa se llama nodo, que junto con las categorías, nos permite establecer clasificaciones. Gestión de usuarios. En esta zona el administrador podrá gestionar las altas, bajas y edición de usuarios, así como su control de acceso al sistema. La activación de módulos core – opcional y contribuidos añadirá nuevas capacidades a estas zonas y en algún caso generarán nuevas zonas en el menú de administración de Drupal.

Page 74: PFC Antonio Bernal Baena

74

5.1.2. Traducción de la interfaz Activación del soporte de idiomas de la interfaz para traducirla a un lenguaje más cercano a los usuarios que trabajarán con la plataforma: castellano (Spanish). Administer > Site building > Modules: Activamos Locate

Queda activado un nuevo menú de configuración en: Administer > Site configuration > Localization Los pasos para añadir el nuevo idioma son:

1. Ir a http://drupal.org/project/Translations 2. Descargar y descomprimir el idioma Spanish de nuestra versión 3. Administer > Site configuration > Localization > Add Language 4. > Language list: seleccionar Spanish y Add language 5. > Import: seleccionamos el archivo es.po que acabamos de

descargar y pulsamos Import 6. Desde la misma pantalla que nos ha remitido, cambiamos el

checkbox Default al idioma Spanish y guardamos la configuración con Save configuration.

7. Para traducir cualquier cadena de forma individual, podemos seleccionar la pestaña Gestionar cadenas, buscarla y traducirla.

Page 75: PFC Antonio Bernal Baena

75

5.1.3. Configuración de la fecha y hora Administrar > Configuración del sitio > Día y hora:

Page 76: PFC Antonio Bernal Baena

76

5.1.4. Formato de entrada Administrar > Configuración del sitio > Formato de entrada > Lista: Filtered HTML > configurar Configurar:

Page 77: PFC Antonio Bernal Baena

77

5.1.5. Información del sitio La configuraremos para el Departamento de Tecnologías de la Información. Cuando se instale la Distribución en otros departamentos el administrador deberá acceder para personalizar la información del mismo. Administrar > Configuración del sitio >Información del sitio: Introducimos una primera información:

Page 78: PFC Antonio Bernal Baena

78

5.1.6. URL limpios Eliminaremos el ?q en el acceso a las direcciones de los nodos. Esto es posible si el módulo Mod_Rewrite de Apache está instalado y en el fichero .htaccess tenemos las reglas configuradas (el que incorpora el paquete de instalación de Drupal lo tiene). Administrar > Configuración del sitio > URLs limpio > Activado:

Page 79: PFC Antonio Bernal Baena

79

5.2. MODULOS 5.2.1. Localización e instalación de módulos Es importante conocer que al instalar Drupal contaremos con una serie de funciones básicas (Core) y que un proyecto real necesitará que instalemos módulos contribuidos adaptados a nuestros propósitos. Los módulos Core se actualizan de modo global con cada nueva versión de Drupal, y son desarrollados por un grupo homogéneo. Los módulos contribuidos forman un catálogo amplísimo, pensados para resolver necesidades específicas. Su desarrollo es independiente del core, por lo que varía el ritmo de actualización, calidad y coherencia. Es importante distinguir entre dos contextos:

– Uso de Drupal Core, que permite el manejo básico de contenidos, usuarios, menús, bloques y categorías, pero adolece de flexibilidad en los listados y definición de campos personalizados para los contenidos.

– Uso de Drupal junto a los módulos contribuidos Views y CCK, que multiplica la capacidad de Drupal para presentar casi cualquier tipo de listado y manejar casi cualquier estructura de contenido.

– Creación de un proyecto Drupal personalizado instalando los módulos necesarios de los cientos de módulos contribuidos disponibles, según nuestro nivel de necesidades.

Dentro del conjunto de módulos core de Drupal existen una serie de ellos que quedan activados por defecto cuando efectuamos la primera instalación de Drupal y una serie de ellos cuya activación es opcional. En el apartado anterior hemos visto cómo se ha activado uno de ellos, el módulo Locate, para permitirnos la traducción del interfaz.

Page 80: PFC Antonio Bernal Baena

80

5.2.2. Instalación de módulos contribuidos Antes de subir los módulos accederemos por FTP a nuestra instalación y crearemos un subdirectorio modules dentro de www/drupal/sites/all de tal manera que en: www/drupal/sites/all/modules será donde subamos todos los módulos contribuidos. Una vez descargados de drupal.org y localizados en el directorio modules vía FTP podemos acceder a: Administrar > Construcción del sitio > Módulos y vemos que ya están allí, listos para ser activados. Por cada módulo contribuido activado debemos comprobar si lleva alguna subcarpeta /po con el fichero es.po, si esto es así, parte de las cadenas o todas las que maneja el módulo están traducidas al español y podemos importarlas manualmente como hicimos anteriormente con el core de Drupal. A continuación establecemos una clasificación de los módulos core y contribuidos que hemos utilizado para la implementación del sitio Web del Departamento.

Page 81: PFC Antonio Bernal Baena

81

5.2.3. Definición de módulos Módulos core – necesario

• Block controla las cajas que se muestran alrededor del contenido principal.

• Filter gestiona el filtrado de contenido previo a la visualización. • Node permite que se envíe contenido al sitio y se muestre en las

páginas. • System gestión de la configuración general del sitio para

administradores. • User gestiona el sistema de registro de usuario y de inicio de

sesión. • Watchdog registra y guarda los eventos de sistema.

Módulos core – opcional

• Locate traducción del interfaz a varios idiomas. • Contact formularios de contacto generales del sitio y particulares de

los usuarios. • Upload necesario para adjuntar ficheros al contenido. • Help gestiona la visualización de la ayuda en línea. • Color permite que el usuario cambie el esquema de colores de

algunos temas. • Menu permite definir estructuras para la organización básica del

sitio Web. • Path permite la creación de URL amigables. • Book agrupa contenidos formando conjuntos jerárquicos. • Search facilita la búsqueda global en el sitio Web. • Taxonomy permite definir vocabularios para categorizar

contenidos.

Page 82: PFC Antonio Bernal Baena

82

Módulos contribuidos

• Administration menu agiliza notablemente la administración proporcionando un menú superior desde el que acceder a toda la administración del sitio, de esta forma podremos trabajar directamente sobre la Web sin tener que exponer bloques innecesarios como el de “Navegación del sitio”. http://drupal.org/project/admin_menu

• Update status Notifica cuándo hay actualizaciones disponibles cada vez que se ejecuta el cron (tareas periódicas) en el servidor. http://drupal.org/project/update_status

• Poormanscron ejecutará el cron de forma automática evitando que tengamos que hacerlo manualmente. http://drupal.org/project/poormanscron

• Pathauto Las urls amigables pueden ser creadas automáticamente siguiendo un patrón. Activando este módulo podremos configurar cómo se construirán las direcciones de cada nodo (contenido). http://drupal.org/project/pathauto

• Token: Necesitado por Pathauto http://drupal.org/project/token

• CCK flexibiliza el formato básico de un nodo (mas allá de los campos Título y Descripción) permitiendo añadir distintos tipos de campos. Es un módulo fundamental en la construcción de un proyecto Web con Drupal. http://drupal.org/project/cck

• Content Taxonomy añade un tipo de campo CCK para referenciar términos de una taxonomía. http://drupal.org/project/content_taxonomy

• File Field define un tipo de campo archivo, para CCK http://drupal.org/project/filefield

• MimeDetect: Necesitado por File Field http://drupal.org/project/mimedetect

• ImageField define un tipo de campo imagen, para CCK http://drupal.org/project/imagefield

• Link define un tipo de campo enlace, para CCK http://drupal.org/project/link

Page 83: PFC Antonio Bernal Baena

83

• Views proporciona una interfaz para crear vistas de páginas (listados, tablas, resultados de búsqueda, etc.) muy potente. Junto con CCK es un módulo fundamental para la implementación. http://drupal.org/project/views

• Views Alpha Pager permite generar en una vista tipo página, una determinación alfabética de de los elementos; la opción por defecto es numérica. http://drupal.org/project/views_alpha_pager

• Views Fast Search genera una opción de búsqueda rápida en las vistas. http://drupal.org/project/views_fastsearch

• Hierarchical Select permite gestionar la selección de términos de una jerarquía de forma dinámica, escogiendo uno o varios elementos del árbol de jerarquía, también se puede crear nuevos elementos y niveles a través de este módulo. http://drupal.org/project/hierarchical_select

• jQuery Update: Necesitado por Hierarchical Select http://drupal.org/project/jquery_update

• Node Profile convierte un tipo de contenido en un perfil (profile) de usuario http://drupal.org/project/nodeprofile

• Node Family: Necesitado por Node Profile http://drupal.org/project/nodefamily

• Subform Element: Necesitado por Node Profile http://drupal.org/project/subform_element

• FCKeditor permite a Drupal reemplazar los campos de texto con el FCKeditor, un editor HTML / WYSIWYG de código abierto (Open Source). http://drupal.org/project/fckeditor

• IMCE permite mantener un sistema personal de archivos de usuario así como explorar su contenido y añadir imágenes; se puede integrar con FCKeditor. http://drupal.org/project/imce

• Bibliography Module soporta un extenso y completo sistema de documentación bibliográfica. http://drupal.org/project/biblio

Page 84: PFC Antonio Bernal Baena

84

• Author Contact genera un bloque para contactar con el autor del

nodo. http://drupal.org/project/authorcontact

• Web Links gestiona la creación y edición de enlaces de los usuarios como nodos. http://drupal.org/project/weblinks

• Calendar muestra una vista de campos fechas en formato calendario, incluyendo campos CCK tipo fecha, y generación y actualización de nodos. http://drupal.org/project/calendar

• Date define un campo tipo fecha, para CCK. http://drupal.org/project/date

• Notifications permite definir suscripciones de los usuarios para la recepción por mail, en base a los tipos de contenido del sistema, de nodos que han sido creados o modificados. http://drupal.org/project/notifications

• Messaging: Necesitado por Notifications http://drupal.org/project/messaging

• Print genera versiones de los nodos para imprimir, enviar por mail o exportar en formato PDF (necesita la utilidad TCPDF). http://drupal.org/project/print

• Captcha provee un sistema sencillo de preguntas para evitar el spam en los formularios. http://drupal.org/project/captcha

• Image Cache genera versiones de diferente tamaño del contenido del campo imagen CCK y otras imágenes de Drupal. http://drupal.org/project/imagecache

• Image Cache Actions extiende las opciones de gestión de

imágenes que por defecto incorpora el módulo Image Cache. http://drupal.org/project/imagecache_actions

• Image API: Necesitado por Image Cache

http://drupal.org/project/imageapi

Page 85: PFC Antonio Bernal Baena

85

• Content Access limita el acceso o edición por tipo de contenido y rol de usuario. http://drupal.org/project/content_access

• Node Access User Reference permite configurar el control de

acceso de usuario a nivel de nodo a través del campo CCK User Reference. http://drupal.org/project/nodeaccess_userreference

• Simple Menu genera un sistema de administración configurable

mediante la asignación de menús creados por el administrador. http://drupal.org/project/simplemenu

Page 86: PFC Antonio Bernal Baena

86

5.2.4. Activación de módulos A continuación presentamos el conjunto de módulos activos que componen el sitio Web del Departamento.

Page 87: PFC Antonio Bernal Baena

87

El uso y activación de módulos contribuidos, que funcionan como extensiones del núcleo de Drupal debe tener en cuenta la dependencia que pueda existir respecto a otros módulos. Dichos módulos pueden ser Core u otros módulos contribuidos cuya activación previa es necesaria para posibilitar el uso de los que hayamos elegido para llevar a cabo la implementación del portal. Un módulo contiene una serie de componentes que generalmente tienen una relación de interdependencia entre ellos y a su vez con los componentes de otros módulos. En la siguiente tabla se exponen dichas relaciones, de tal manera que antes de activar un componente de la columna “Necesitado por” debemos de tener activo el de la columna “Componente”.

Page 88: PFC Antonio Bernal Baena

88

Tabla de Dependencias

Grupo Módulo Componente Necesitado por

CCK

CCK

Content Content Copy Content Taxonomy Content Taxonomy Autocomplete Date Fieldgroup File Field Image Field Link Node Reference Number Option Widgets Text User Reference

Content Taxonomy Content Taxonomy Content Taxonomy Autocomplete

Content Taxonomy Views

CCK User Reference Node Access User Reference

Core - opcional Core - opcional

Book Hierarchical Select Book

Menu Hierarchical Select Menu

Path Pathauto

Search Views FastSerarch

Taxonomy Content Taxonomy Hierarchical Select Taxonomy Taxonomy Notifications Web Links

Date/Time

Calendar Calendar Calendar Popup

Date

Date API Calendar Date Date Popup Date Timezone

Date Timezone Calendar Date Date Popup

Form Elements Hierarchical Select Hierarchical Select Hierarchical Select Book

Hierarchical Select Menu Hierarchical Select Taxonomy

ImageCache

ImageAPI

ImageAPI ImageAPI GD2 ImageCache Imagecache Canvas Actions Imagecache Color Actions Imagecache UI

ImageCache

ImageCache Imagecache Canvas Actions Imagecache Color Actions Imagecache Text Actions Imagecache UI

Mensajes Messaging Messaging Simple Mail

Notifications

Node Profile Node Family

Node Family Node Profile

Page 89: PFC Antonio Bernal Baena

89

Grupo Módulo Componente Necesitado por

Notificaciones Notifications

Content Notifications Notifications Autosuscribe Taxonomy Notifications

Notifications Notifications Autosuscribe Content Notifications Taxonomy Notifications Notifications UI

Other

MimeDetect MimeDetect File Field

Subform Element Subform Element Node Profile

Token Token Notifications

Pathauto

Imprimir, mail, PDF Print, e-mail and PDF version Printer-friendly pages (core) Send by e-mail

PDF version

Spam control Captcha Captcha Text Captcha

User Interface jQuery Update jQuery Update Hierarchical Select

Views Views

Views Calendar Content Taxonomy Views Calendar Popup Views Alpha Pager Views FastSearch Views RSS Views Theme Wizard Views UI

Page 90: PFC Antonio Bernal Baena

90

5.3. DESARROLLO 5.3.1. Componentes del sistema de gestión de contenidos Desglosaremos la configuración y creación de los distintos componentes del sistema:

• Módulos • Menús • Roles • Tipos de contenido • Categorías • Campos • Vistas • Elementos de menú • Bloques • Control de acceso • Tema

Durante este proceso explicaremos para cada caso de implementación correspondiente al inventario de contenidos qué módulos específicos hemos necesitado a parte de los de uso general como puedan ser CCK y Views, así como otros para el rendimiento del sistema, y qué Tipos de Contenido, Categorías, etc. hemos creado para dar respuesta al planteamiento metodológico.

Page 91: PFC Antonio Bernal Baena

91

5.3.2. Menú de administración Una vez activados los módulos core y contribuidos podemos configurarlos desde la zona de administración. Su distribución ha quedado situada de la siguiente forma:

Construcción del sitio

Controla la apariencia del sitio.

• Alias de URL • Bloques • Formulario de contacto • Imagecache • Módulos • Menús • Temas • Views

Gestión de contenido

Gestiona el contenido de su sitio.

• Buscar contenido • Categorías • Contenido • Libros • Node family • Opciones de envío • Publicación RSS • Tipo de contenido • Web Links Overview

Configuración del sitio

Ajustar las opciones de configuración básicas del sitio.

• Administration menu • Ajustes Bibliografía • Alias automático de URL • Calendar Setup • Día y hora • Descargas de archivos • FCKeditor • Formato de entrada

Page 92: PFC Antonio Bernal Baena

92

• Hierarchical Select • ImageAPI • IMCE settings • Información del sitio • Informar de errores • Juego de herramientas de imágenes • Localización • Mantenimiento del sitio • Mime type detection • Opciones de búsqueda • Poormanscron • Rendimiento • SimpleMenu • Sistema de archivos • Tema de administración • URLs limpios • Versiones para impresora, enviar por correo electrónico y exportar

como PDF • Views Alpha Pager • Web Links

Gestión de usuarios

Gestiona los usuarios del sitio, los grupos y el acceso a las características del sitio.

• Buscar usuarios • CAPTCHA • Control de acceso • Opciones del usuario • Reglas de acceso • Roles • Usuarios

Mensajes y Notificaciones

Administración de mensajes y notificaciones

• Messaging methods • Messaging templates • Notifications settings • Notifications status

Page 93: PFC Antonio Bernal Baena

93

Registros

Observa los registros del sistema y otra información de estado.

• Últimos mensajes registrados • Frases principales en las búsquedas • Principales errores de "acceso denegado" • Principales errores de "página no encontrada" • Disponibilidad de actualizaciones • Informe de estado

Ayuda

Page 94: PFC Antonio Bernal Baena

94

5.3.3. Configuración de módulos contribuidos generales Configuración de módulos contribuidos de aplicación general durante el proceso de implementación del sistema de gestión de contenidos. Administration menu Administrar > Configuración del sitio > Administration menu: Ajustamos el menú de administración al margen superior de la

pantalla

Page 95: PFC Antonio Bernal Baena

95

Update status Administrar > Registros > Disponibilidad de actualizaciones: Opciones generales:

Page 96: PFC Antonio Bernal Baena

96

Lista:

Ahora si accediéramos al apartado de gestión de Módulos de la administración del sitio, y se hubiera lanzado una actualización para uno de los módulos instalados, gracias al módulo Update status recibiríamos el siguiente mensaje:

Page 97: PFC Antonio Bernal Baena

97

Poormanscron Administrar > Configuración del sitio > Poormanscron:

Pathauto Administrar > Configuración del sitio > Alias automático de URL: Configuraciones generales:

Page 98: PFC Antonio Bernal Baena

98

Opciones para nodos:

Page 99: PFC Antonio Bernal Baena

99

Opciones para categorías:

Aplicación del módulo:

Hemos definido como alias automático de las entradas del Tipo de contenido Ficha de personal, “personal/[title-raw]”

Cuando damos de alta cualquier entrada de este tipo de contenido, la ruta del nodo se genera automáticamente:

Al dar de alta la ficha de personal a un estudiante llamado “nombre_estudiante de prueba”.

Page 100: PFC Antonio Bernal Baena

100

Ahora queremos que el bloque de formulario de contacto aparezca siempre que mostremos un nodo perteneciente al tipo Ficha de personal, cuyos nodos se introducen automáticamente con el path “personal/título del nodo”, por tanto solo tendríamos que acceder al bloque de formulario he introducir en las opciones de visibilidad del bloque

Con lo cual nos aseguramos de que para cualquier nodo del tipo Ficha de personal, cuando se muestre a la audiencia, como estará dentro de esta ruta, siempre se mostrará el bloque de formulario de contacto. CCK Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Sin Content:

Los campos por defecto son muy reducidos, no van más allá del nombre y de un cuerpo de texto para el tipo de contenido. Con Content:

Page 101: PFC Antonio Bernal Baena

101

Tenemos varias pestañas nuevas, en concreto, la pestaña Campos nos permitirá generar nuevos campos personalizados para el tipo de contenido que estamos creando, una vez creada la ficha de contenido, la editamos y accediendo en la pestaña Añadir un campo personalizamos el contenido con los campos que deseemos. Si hemos activado los módulos Content Taxonomy, File Field, ImageField, y Link relacionados con Content para ampliar los tipos de campos que se pueden generar podremos seleccionar cada uno de ellos al generar un nuevo campo para el tipo de contenido. Views Administrar > Construcción del sitio > Views: Añadir:

Estas son las opciones de la ficha de creación de una nueva vista.

Page 102: PFC Antonio Bernal Baena

102

El módulo Views nos permite generar vistas para poder mostrar el contenido que queramos, filtrado y organizado a través de una interfaz. Sin vistas, para poder extraer listados, deberíamos construir un módulo o un bloque con código PHP y consultas SQL manualmente. La mayor utilidad de las vistas aparece cuando necesitamos crear tipos de contenido personalizados mediante CCK; a través del interfaz de usuario del módulo Views, podemos filtrar el contenido que pertenezca a uno o varios tipos de contenido y generar listados. Views UI, es el módulo que nos proporciona la interfaz de usuario para poder crear y modificar nosotros mismos las vistas, Views Theme Wizard, que sirve para poder crear plantillas y darle formato a nuestras vistas, o el Views RSS, que es un añadido que nos permite generar un feed para las vistas en las que lo necesitemos. Views FastSearch, define un filtro de búsqueda en las vistas y Views Alpha Pager activa la opción de ordenación alfabética de las páginas de una vista, lo cual puede ser útil si queremos escoger aquellas páginas cuyo campo principal empieza por ejemplo por “A” y la audiencia podría escoger ver todos aquellos profesores (si el campo principal es el nombre del profesor) cuyo nombre empieza por “A” (esto podría ser útil cuando tengamos listados muy amplios que quisiéramos seleccionar alfabéticamente). Las vistas pueden generar estos listados personalizados de dos formas, las vistas de tipo página generan una página accesible mediante una URL que nosotros debemos configurar y las de tipo bloque no tienen esta URL, sino que generan un bloque que podemos situar en cualquiera de las regiones de nuestra página mediante el menú Administrar > Construcción del sitio >Bloques. Las opciones básicas que tenemos que manejar para poder crear vistas de forma correcta y eficiente son los campos, los filtros y los parámetros de ordenación. Los campos definen la información que queremos mostrar de los elementos a listar, podemos especificar que queremos mostrar el título del nodo y sus categorías, el teaser o el contenido completo del nodo... Los filtros sirven para cribar la información que no necesitamos, por ejemplo si queremos ver solo los nodos publicados (recomendado) o los nodos solamente de cierto tipo de contenido, o de una categoría (o varias) determinadas. Los parámetros de ordenación nos permiten ordenar los elementos recuperados por varios criterios (incluso anidados), como la creación del nodo o el título, etc.

Page 103: PFC Antonio Bernal Baena

103

Los filtros expuestos nos permiten extraer alguno de los campos de filtrado para que los pueda utilizar el usuario, es decir, si exponemos el tipo de contenido, la vista mostrará un campo de selección con los tipos de contenido posibles y el usuario filtrará el contenido que le interese a través de este campo. Un argumento es un parámetro que se pasa a una vista y que se utiliza dentro de ésta para generar contenido dinámico que cambia según el argumento. La diferencia con los filtros, es que el filtro es una forma de diferenciar contenido de forma estática por cada vista, es decir, que si filtramos por el tipo de contenido story, la vista siempre nos devolverá tipos de contenido story, sin embargo, si utilizamos el tipo de contenido como un argumento para una vista, si la URL es nombre-de-la-vista/story nos mostrará tipos de contenido story, pero si accedemos a la url nombre-de-la-vista/page, nos mostrará tipos de contenido page. Hierarchical Select Administrar > Configuración del sitio > Hierarchical Select: Site-wide settings:

Page 104: PFC Antonio Bernal Baena

104

Configurations: devuelve un informe de todas las configuraciones aplicadas con el módulo Hierarchical Select

Implementations: nos indica que se puede usar tanto para

taxonomías, como para menús como para el tipo de contenido book (páginas estáticas).

Libro y Menú: indica que está activa la posibilidad de asignación

dinámica de jerarquía en estos elementos. Por tanto Hierarchical Select nos proporciona una manera más cómoda de seleccionar términos de taxonomía, generalmente cuando la jerarquía es profunda o permitimos la creación de nuevos términos. FCKeditor Administrar > Configuración del sitio > FCKeditor:

Page 105: PFC Antonio Bernal Baena

105

IMCE Administrar > Configuración del sitio > IMCE settings > Opciones generales:

Los usuarios autorizados podrán tener acceso a IMCE y mantener una carpeta de archivos Personal files.

Page 106: PFC Antonio Bernal Baena

106

5.3.4. Creación de menús Administrar > Construcción del sitio > Menús > Opciones generales:

Administrar > Construcción del sitio > Menús > Añadir menú:

Creamos los distintos menús del sistema. En cada caso añadiremos los elementos de menú que sean oportunos mediante la opción Añadir opción de menú.

Page 107: PFC Antonio Bernal Baena

107

El resultado será:

Primary links Elemento del menú Localización Contacto Enlaces Noticias Acceso identificado

Menú Universidad de Huelva Elemento del menú Rectorado Servicios Centros

Docencia Elemento del menú

Estudios 1º y 2º Ciclo EEES Máster Oficial Formación Permanente Asignaturas Tutorías PFC/Fin Máster

Investigación Elemento del menú Grupos Publicaciones Seminarios

Personal Elemento del menú Profesores Administrativos Becarios Estudiantes

Page 108: PFC Antonio Bernal Baena

108

Gestión Elemento del menú Convocatorias

Crear/Publicar contenido Elemento del menú

Crear contenido - Asignatura - Bibliography - Comisión Permanente - Consejo de Departamento - Destacados - Ficha de personal - Grupo de investigación - Imagen portada - Noticias - Página estática - Proyecto FC/FM - Seminario - Titulación - Web Links Cerrar sesión Iremos desarrollando cada uno de sus elementos en los casos de implementación del inventario de contenidos.

Page 109: PFC Antonio Bernal Baena

109

5.3.5. Creación de roles Administrar > Gestión de usuarios > Roles: Los roles predefinidos por Drupal son “anonymous user” y “authenticated user”; añadimos “administradores”, “becarios”, “director”, “estudiantes (consejo)”, “pas”, “profesores” y “secretario” en respuesta al estudio efectuado en la fase de Análisis de Requisitos. Cada usuario pertenecerá a uno o varios roles con lo cual estará adscrito a todos los privilegios del conjunto de roles al que pertenece.

Page 110: PFC Antonio Bernal Baena

110

5.3.6. Cuadro resumen de tipos de contenido creados

Page 111: PFC Antonio Bernal Baena

111

5.3.7. Cuadro resumen de categorías creadas

Page 112: PFC Antonio Bernal Baena

112

5.3.8. Cuadro resumen de vistas creadas

Page 113: PFC Antonio Bernal Baena

113

Page 114: PFC Antonio Bernal Baena

114

Page 115: PFC Antonio Bernal Baena

115

5.3.9. Casos de implementación del inventario de contenidos Primero propondremos el caso en base a la tabla de Inventario de Contenidos y Etiquetados resultado del análisis efectuado en la fase de Diseño. Después establecemos una tabla descriptiva en donde definimos los distintos elementos de Drupal que debemos crear para dar solución al caso propuesto, y en los siguientes apartados lo desarrollamos. 5.3.9.1. Estudio del caso: Localización Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Localización Mapa Google Ficha de contenido “Localización”

Descripción de Elementos de Drupal

Campo obligatorio.

5.3.9.1.1. Configuración de módulos Administrar > Construcción del sitio > Módulos: Activamos el módulo Core – opcional Book

Book genera un Tipo de Contenido especial llamado Página del libro definido por el sistema.

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Página Estática: Título Cuerpo

Page 116: PFC Antonio Bernal Baena

116

5.3.9.1.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Edit Página del libro:

Cambiamos el Nombre por Página estática. Introducimos la Descripción del Tipo de Contenido Página estática. Introducimos la ayuda en el apartado Explicación o directrices para

envíos, de tal forma que cuando queramos crear un nodo de este tipo nos sirva de guía para el rellenado del formulario de envío.

Page 117: PFC Antonio Bernal Baena

117

Resultado: Tipo de contenido “Página estática”.

Page 118: PFC Antonio Bernal Baena

118

Accedemos a Google Maps y creamos el mapa de localización del Departamento de Tecnologías de la Información. Añadimos las coordenadas GPS del Pabellón Torreumbría que previamente hemos obtenido ayudándonos de GPS Location, el cual es una utilidad que nos permitirá averiguarlas.

Page 119: PFC Antonio Bernal Baena

119

Administrar > Gestión de contenido > Contenido > Añadir Página estática: Creamos el contenido Localización incrustando en el campo Cuerpo

los comentarios y el código HTML facilitado por Google Maps. Opción: Fuente HTML.

Como tenemos activado el módulo Pathauto se generará un alias

automático para la URL del nodo:

Page 120: PFC Antonio Bernal Baena

120

Y en las Opciones de publicación tendremos Publicado:

5.3.9.1.3. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Añadir opción de menú: Introducimos el Título del elemento de menú Introducimos su Ruta, que sabemos porque hemos consultado el

alias automático generado Asignamos su Elemento padre, escogiéndolo de los Menús que

tenemos disponibles Asignamos un Peso para ordenarlo dentro del Menú Primary Links:

Page 121: PFC Antonio Bernal Baena

121

5.3.9.1.4. Visibilidad de bloques La situación del menú que contiene enlaces primarios (llamado por nosotros “Primary links”) está definida por el Tema y por tanto la presentación en pantalla de los elementos que lo componen. Los enlaces primarios están pensados para que se vean en todo el sitio como menú global de la Web. Por tanto no visualizaremos el bloque “Primary links”. Comentaremos también que el bloque “Navegación del libro” está autogestionado por el módulo book y una vez visualizado en alguna región se mostrará cuando se navegue por páginas del libro. En principio no entra en los objetivos planteados el desarrollo de libros colaborativos pero es una opción que nos da el Tipo de Contenido Página estática.

Page 122: PFC Antonio Bernal Baena

122

5.3.9.1.5. Prototipos de pantalla

Page 123: PFC Antonio Bernal Baena

123

5.3.9.2. Estudio del caso: Contacto Inventario de Contenidos y Etiquetado Menú Elemento del

menú Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Contacto Formulario de contacto con el Departamento

Ficha de contenido “Contacto”

Descripción de Elementos de Drupal

A continuación activaremos el módulo Core – opcional Contact y lo configuraremos.

Page 124: PFC Antonio Bernal Baena

124

5.3.9.2.1. Configuración de módulos Administrar > Construcción del sitio > Módulos: Activamos el módulo Core – opcional Contact

Administrar > Construcción del sitio > Formulario de contacto: Añadir categoría:

Las categorías nos permiten dividir, por ejemplo, el modelo de respuesta automática y el destinatario que recibirá un envió de un usuario si por ejemplo creáramos varias de ellas. Es decir, el formato va a ser el mismo, pero el usuario podrá decidir enviar su consulta a una u otra categoría (por ejemplo Formulario para secretaría, Formulario para dirección, etc.). En nuestro caso establecemos solo un formulario general para el sitio y por tanto una sola categoría.

Page 125: PFC Antonio Bernal Baena

125

Opciones generales: Introducimos la información que deseamos aparezca en el Formulario que visualizará la audiencia como cuerpo del formulario y que mostrará datos adicionales de contacto con el Departamento.

Page 126: PFC Antonio Bernal Baena

126

5.3.9.2.2. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista En el menú de Navegación vemos un elemento llamado Contacto ya

que el módulo de contacto también añade una opción de menú (de forma predefinida está desactivada) al bloque de navegación. Escogemos la operación activar:

Page 127: PFC Antonio Bernal Baena

127

Lo asignaremos como elemento del menú Primary Links

Page 128: PFC Antonio Bernal Baena

128

5.3.9.2.3. Prototipos de pantalla

Page 129: PFC Antonio Bernal Baena

129

5.3.9.3. Estudio del caso: Enlaces Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Enlaces Tabla de “Enlaces”: Web Descripción *Buscar por texto *Categoría

Ficha de contenido “Web Links”: Link Name URL Web Links: Boletines Oficiales, Instituciones Académicas, Prensa, Publicaciones científicas o Sociedades científicas. Descripción del sitio

Descripción de Elementos de Drupal

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Web Links: Link Name URL Descripción del enlace

Web Links: Boletines Oficiales Instituciones Académicas Prensa Publicaciones científicas Sociedades científicas

enlaces Page

Campo obligatorio.

5.3.9.3.1. Configuración de módulos Web Links Administrar > Construcción del sitio > Módulos: Activamos Web Links

Administrar > Configuración del sitio > Web Links > General Podemos configurar las opciones del módulo que hemos dejado por

defecto. Web Links genera un Tipo de Contenido especial llamado Web Links definido por el sistema.

Page 130: PFC Antonio Bernal Baena

130

5.3.9.3.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Edit Web Links: Nombre: Web Links Descripción: introducimos una definición de este Tipo de Contenido Formulario de envío: aquí definiremos los campos Título y cuerpo así

como el texto de ayuda que se van a mostrar al usuario cuando cree un contenido de este tipo.

Predefiniremos la opción Publicado exclusivamente.

Page 131: PFC Antonio Bernal Baena

131

5.3.9.3.3. Creación de categorías Administrar > Gestión de contenidos > Categorías > Añadir vocabulario: Siempre que añadimos una categoría tendremos una serie de

campos que hemos rellenado:

Nombre del vocabulario. Descripción. Texto de ayuda. Tipo: Asignamos el uso de este vocabulario a una serie

de Tipos de Contenido cuyos nodos podremos referenciar a través de los términos de este vocabulario.

Requerido: obligamos a que cada nodo deba tener al menos un término de este categoría.

Use the Hierarchical Select form element for this vocabulary: nos ayudará a la generación de nuevos términos así como a rediseñar la jerarquía del vocabulario.

Level choice: permitir o no elegir un término desde cualquier nivel.

Allow creation of new terms: permitir o no la creación de nuevos términos cuando damos de alta un contenido del Tipo relacionado con este vocabulario.

Page 132: PFC Antonio Bernal Baena

132

> Creación del vocabulario “Web Links”:

Page 133: PFC Antonio Bernal Baena

133

Una vez creado el vocabulario podremos añadirle términos a dicho vocabulario en: Administrar > Gestión de contenidos > Categorías > Lista: Seleccionamos el Nombre del vocabulario y la operación añadir

términos:

Page 134: PFC Antonio Bernal Baena

134

Asignaremos un peso a cada término del vocabulario para ordenarlos. Seleccionamos el Nombre del vocabulario y la operación lista de

términos, en donde podemos ver los que hemos creado como opciones de este vocabulario.

Page 135: PFC Antonio Bernal Baena

135

5.3.9.3.4. Creación de campos En este caso hemos usado el campo tipo cuerpo que por defecto nos aporta este tipo de nodo llamándolo Descripción del enlace. Además de la información que aporte nos servirá para dar acceso al nodo y que los usuarios autorizados puedan editar fácilmente este Tipo de Contenido.

Page 136: PFC Antonio Bernal Baena

136

Ya podemos dar de alta contenidos Tipo Web Links en Administrar > Gestión de contenido > Contenido > Añadir Web Links:

Page 137: PFC Antonio Bernal Baena

137

5.3.9.3.5. Creación de vistas Administrar > Construcción del sitio > Views > Añadir Creamos la vista enlaces:

Page 138: PFC Antonio Bernal Baena

138

Page 139: PFC Antonio Bernal Baena

139

Ejemplo del resultado:

Page 140: PFC Antonio Bernal Baena

140

5.3.9.3.6. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Añadir menú:

Page 141: PFC Antonio Bernal Baena

141

5.3.9.3.7. Prototipos de pantalla

Page 142: PFC Antonio Bernal Baena

142

5.3.9.4. Estudio del caso: Buscar Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Buscar Buscador

Descripción de Elementos de Drupal

Activaremos el módulo Core – opcional Search y lo configuraremos. 5.3.9.4.1. Configuración de módulos Administrar > Construcción del sitio > Módulos: Activamos el módulo Core – opcional Search

La visibilidad del buscador que provee este módulo dependerá del Tema elegido, por tanto vamos a: Administrar > Construcción del sitio > Temas > Configurar > framebasico > Bloque de búsqueda: Una vez marcado obtendremos su visibilidad en pantalla

Page 143: PFC Antonio Bernal Baena

143

5.3.9.4.2. Prototipos de pantalla

Page 144: PFC Antonio Bernal Baena

144

5.3.9.5. Estudio del caso: Destacados

Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Destacados Lista de “Destacados” 2 ítems.

Ficha de contenido “Destacados”: Titular Texto Imagen

Descripción de Elementos de Drupal Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Destacados: Titular Texto_destacados Imagen_destacados

portada_destacados Page

Campo obligatorio.

5.3.9.5.1. Creación de tipos de contenido El módulo Node que se encarga de los nodos es el principal módulo en Drupal, en el sentido de que funciona como cualquier otro módulo, pero es necesario para el funcionamiento de Drupal. Un nodo es cualquier pieza de contenido. De forma predeterminada, un nodo sólo tiene un título y un cuerpo. En el núcleo de Drupal podemos definir diferentes tipos de nodos. Drupal separa los diferentes tipos de nodos en los tipos de contenido. Por defecto, Drupal se instala con page y story como tipos de contenido. Realmente la única diferencia entre estos dos tipos de contenidos es que story se promueve a la página principal y permite los comentarios (que hemos desactivado), de lo contrario no existe una diferencia real. El sitio de Drupal nos permite agregar diferentes tipos de contenido para poder organizar el contenido de una forma significativa. Nosotros hemos eliminado los tipos de contenido page y story y hemos creado nuestros propios tipos adicionalmente a otros propios para el sistema que generan ciertos módulos, como book, ya usado o Weblinks.

Page 145: PFC Antonio Bernal Baena

145

Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido:

Page 146: PFC Antonio Bernal Baena

146

Nombre: definimos un nombre para este Tipo de Contenido Tipo: definimos un nombre legible por el sistema para este Tipo de

Contenido Descripción: explicación del uso de este Tipo de Contenido Etiqueta del campo Título: podemos personalizarla Etiqueta del campo de cuerpo: podemos personalizarla u omitir este

campo, con CCK construiremos los campos de cuerpo a nuestra medida

Explicación o directrices para envíos: texto de ayuda Opciones predefinidas: dejaremos por defecto solo la opción

“Publicado” Adjuntos: dejaremos la opción “Activo” sobre todo en los Tipos de

Contenido que requieran la posibilidad de adjuntar un fichero PDF, etc.

Page 147: PFC Antonio Bernal Baena

147

Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Destacados

Page 148: PFC Antonio Bernal Baena

148

5.3.9.5.2. Creación de campos Administrar > Gestión de contenido > Tipo de contenido > Edit Destacados: Creamos los campos CCK y cómo se mostrarán en los nodos, con

Manage fields y Display fields:

Como vemos, el campo Imagen_destacados, es del tipo Image, aportado por el módulo ImageField a Content (CCK).

Page 149: PFC Antonio Bernal Baena

149

Con lo cual ya podemos dar de alta contenidos Tipo Destacados en Administrar > Gestión de contenido > Contenido > Añadir Destacados:

Page 150: PFC Antonio Bernal Baena

150

5.3.9.5.3. Creación de vistas Administrar > Construcción del sitio > Views > Añadir: Creamos la vista portada_destacados:

Page 151: PFC Antonio Bernal Baena

151

URL: asignamos inicio para que la vista se muestre siempre en la página principal del sitio Web. Aclaración: Previamente en Administrar > Configuración del sitio > Información del sitio: Página predefinida de inicio: cambiamos “node” por “inicio”

Con lo cual sabemos la URL donde debemos mandar los contenidos de este Tipo de Contenido (listados gracias a la vista que estamos implementando) que queremos que aparezcan en la home. Nodos por página: asignamos 2 como máximo número de contenidos del Tipo Destacados que serán visibles simultáneamente en la página principal.

Page 152: PFC Antonio Bernal Baena

152

Page 153: PFC Antonio Bernal Baena

153

Ejemplo del resultado:

Page 154: PFC Antonio Bernal Baena

154

5.3.9.5.4. Prototipos de pantalla

Page 155: PFC Antonio Bernal Baena

155

5.3.9.6. Estudio del caso: Personal Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Personal Profesores Tabla de “Profesores + Director del Departamento + Secretario del Departamento”: Foto del profesor Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Profesores, Director del departamento, Secretario del departamento), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. Tabla de “Asignaturas” del profesor: Asignatura Titulación Año Académico Tabla de “Grupo de Investigación” del profesor: Grupo Tabla de “Proyectos” del profesor, fin de carrera o fin de máster: Proyecto Disponibilidad “Formulario de Contacto” con el profesor

Page 156: PFC Antonio Bernal Baena

156

Menú Elemento del

menú Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Personal Administrativos Tabla de “(PAS) Personal de Administración y Servicios”: Foto del PAS Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil ((PAS) Personal de Administración y Servicios), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el PAS

Becarios Tabla de “Becarios”: Foto del Becario Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Becarios), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el Becario

Estudiantes Tabla de “Estudiantes Consejo del Departamento”: Foto del Estudiante Nombre Despacho Teléfono Horario *Búsqueda por texto *Área

Ficha de contenido “Personal”: Nombre, Perfil (Estudiantes Consejo del Departamento), Área (CCIA, LSI), Organos de Gobierno (Comisión Permanente, Consejo de departamento), Foto usuario, Teléfono, Despacho, Web, Horario de tutoría. “Formulario de Contacto” con el Estudiante

Page 157: PFC Antonio Bernal Baena

157

Descripción de Elementos de Drupal Tipo de Contenido y campos

Categoría y términos

View Bloque / Page / Menú

Ficha de Personal: Nombre Foto usuario Group Datos personales: Teléfono Despacho Web Group Actividad docente: Horario de tutoría

Perfil: Profesores Director del departamento Secretario del departamento PAS Becarios Estudiantes Consejo Dep. Área: CCIA LSI Órganos de Gobierno: Comisión Permanente Consejo de departamento

personal asignaturas_profesor grupo_investigación_profesor pfc_profesor

Page Menu Block Block Block Formulario de Contacto

Campo obligatorio.

Las vistas:

• asignaturas_profesor

• grupo_investigación_profesor

• pfc_profesor Solo serán de aplicación para los profesores, el resto de elementos de Drupal será común para la implementación del Menú “Personal”.

Page 158: PFC Antonio Bernal Baena

158

5.3.9.6.1. Configuración de módulos Node Profile Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido Node Profile

Drupal tiene dentro de su core-opcional el módulo Profile que nos permite dar de alta una serie de campos de información del Perfil del Usuario; pero dicha información es reducida y su tratamiento es más complejo que si damos de alta un Tipo de Contenido Ficha de Personal y lo convertimos en un Profile para los Usuarios del sistema. Esto nos va a permitir trabajar mejor con las vistas que debemos generar para mostrar la información del personal del departamento. Author Contact Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido Author Contact

Este módulo genera automáticamente un bloque con un formulario de contacto permitiendo que se envíe un mail con la información al autor del nodo donde se muestra.

Page 159: PFC Antonio Bernal Baena

159

5.3.9.6.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Ficha de personal

Page 160: PFC Antonio Bernal Baena

160

Es muy importante la opción que ha activado el módulo Node Profile para todos los tipos de contenidos del sistema y que aplicamos en este caso:

Como vemos también desactivamos la opción de ficheros adjuntos para este Tipo de Contenido.

Page 161: PFC Antonio Bernal Baena

161

Pestaña Node profile: activada al haber seleccionado convertir a este tipo de contenido en un nodo-perfil para usuarios. Podemos configurarla.

Page 162: PFC Antonio Bernal Baena

162

Y vemos un aspecto muy importante en el flujo de creación de contenidos del sistema. Demos crear siempre el contenido referente a la Ficha de personal cuando damos de alta al usuario y desde el menú de administración: Administración > Gestión de usuarios > Usuarios > Lista > editar a cada usuario individualmente, entonces tendremos la opción Ficha de personal que es donde debemos introducir todos sus datos, entendiendo que será el Administrador del sistema quien dará de alta dicho contenido.

De esta forma Drupal entiende que el autor del nodo es el propio usuario y permitirá su edición por rol posteriormente, si damos de alta una Ficha de personal en el menú de Gestión de contenido tomará como autor al Administrador del sistema y no permitirá editarla posteriormente al usuario al que pertenece puesto que éste no tendrá el rol Administrador. 5.3.9.6.3. Creación de categorías Administrar > Gestión de contenido > Categorías > Añadir vocabulario: Creamos varios vocabularios que se relacionan con el Tipo de

Contenido Ficha de personal así como con otros tipos de contenido que iremos viendo. Los resumimos en la siguiente tabla:

Nombre del vocabulario Tipo Área Asignatura, Ficha de personal, Proyecto FC/FM Perfil Ficha de personal Organos de Gobierno Ficha de personal

Page 163: PFC Antonio Bernal Baena

163

Creamos también la lista de términos de cada vocabulario:

Page 164: PFC Antonio Bernal Baena

164

5.3.9.6.4. Creación de campos Administrar > Gestión de contenido > Tipo de contenido > Edit Ficha de Personal: Creamos los campos CCK y cómo se mostrarán en los nodos, con

Manage fields y Display fields, así como con la pestaña Add group con la cual agrupamos varios campos. Esto es muy útil para asignar un peso a la pestaña del grupo y que todos los campos se muestren a ese mismo nivel en el formulario de alta.

Resaltaremos el uso del campo “Foto usuario” tipo Image para que un usuario pueda incluir su foto en su ficha de personal. También existe dicha posibilidad desde el menú de alta de usuario, pero no podríamos mostrar a través de las vistas dicho campo en el orden que pretendemos, por tanto hemos eliminado dicha posibilidad en:

Page 165: PFC Antonio Bernal Baena

165

Administrar > Gestión de usuarios > Opciones del usuario:

También hemos podido dar de alta el campo “Web” tipo Link gracias al módulo contribuido Link que añade un campo enlace a CCK. Es importante asignar un alias automático de URL a este tipo de

contenido, esto nos servirá para trabajar con las vistas. Administrar > Configuración del sitio > Alias automático de URL > Opciones para nodos:

Page 166: PFC Antonio Bernal Baena

166

Con lo cual ya podemos dar de alta contenidos Tipo Ficha de personal en Administración > Gestión de usuarios > Usuarios > Lista > editar:

Page 167: PFC Antonio Bernal Baena

167

5.3.9.6.5. Creación de vistas Para cumplir con los requerimientos que nos muestra el inventario de contenidos necesitamos la generación de cuatro vistas distintas; vamos a adelantarnos porque algunas de ellas necesitarían ya tener varios tipos de contenido creados, que veremos posteriormente, pero la finalidad es mostrar cómo hemos implementado la vista de profesores y cómo hemos podido enlazarla con sus asignaturas, sus grupos de investigación, sus proyectos fin de carrera o de máster propios y el formulario de contacto individual. Por otra parte la vista personal que crearemos ahora nos servirá para mostrar a todo el personal del departamento. Vista personal Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 168: PFC Antonio Bernal Baena

168

Page 169: PFC Antonio Bernal Baena

169

Introduciremos un argumento como parámetro a pasar a la vista y obtener contenido dinámico que cambiará según el argumento. Este argumento nos servirá para el que resultado de la vista arroje un contenido distinto según el ID que define cada término de la categoría Perfil. Con %1 definimos que el Título de las distintas vistas que generemos a partir de ésta coincida con el nombre de los términos cuyos IDs se están pasando como argumentos a la vista.

Page 170: PFC Antonio Bernal Baena

170

Page 171: PFC Antonio Bernal Baena

171

Ejemplo del resultado:

Obtenemos una vista que mostrará a los componentes de todos los perfiles. Discriminaremos cuando construyamos los elementos del menú.

Page 172: PFC Antonio Bernal Baena

172

Vista asignaturas_profesor Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Creamos un bloque que expondremos tan solo en unas determinadas páginas, las de personal.

Page 173: PFC Antonio Bernal Baena

173

Page 174: PFC Antonio Bernal Baena

174

Devolvemos al argumento el valor del usuario-profesor que debe pasar por la vista, por defecto el argumento no será opcional, si usamos “Mostrar todos los valores” el argumento será opcional y mostraría el bloque de asignaturas en todas las páginas personal/* menos en las del valor de usuario que se le ha pasado. El código PHP:

//comprueba si el estamos en una dirección de tipo /node/<numero> es decir, si estamos viendo un nodo

if (arg(0) == 'node' && is_numeric(arg(1))) {

$node = node_load( arg(1)); //cargamos el objeto nodo correspondiente a ese nid para obtener toda su información

$user = user_load(array('uid' => $node->uid)); //cargamos el usuario que ha creado ese nodo para obtener toda la información relacionada

$nodes = node_load(array('uid' => $user->uid, 'type' => 'personal')); //de todos sus nodos creados necesitamos tener los de tipos "personal" (sólo habrá uno) para conocer su ficha de personal con los datos relacionados

if($user->roles[4]){ //comprobamos por si acaso que el rol del usuario propietario del nodo que estamos viendo es de tipo 4 (profesor) y entonces le indicamos a la vista el argumento que debe tomar, que no es sino el nid de la ficha de personal del autor que ha creado el nodo que estamos viendo en ese instante.

$args[0] = $nodes->nid;

}

return $args; //devolvemos los argumentos

}

Page 175: PFC Antonio Bernal Baena

175

Page 176: PFC Antonio Bernal Baena

176

Ejemplo del resultado:

Page 177: PFC Antonio Bernal Baena

177

Vista grupo_investigación_profesor Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 178: PFC Antonio Bernal Baena

178

Disponemos el mismo código PHP con el mismo objetivo que en la vista anteriormente descrita “asignaturas_profesor”.

Page 179: PFC Antonio Bernal Baena

179

Ejemplo del resultado:

Page 180: PFC Antonio Bernal Baena

180

Vista pfc_profesor Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 181: PFC Antonio Bernal Baena

181

Utilizamos la misma técnica para obtener los argumentos que en las dos vistas anteriores.

Page 182: PFC Antonio Bernal Baena

182

Page 183: PFC Antonio Bernal Baena

183

Ejemplo del resultado:

En este punto comentar que un aspecto para la construcción de vistas que puede facilitar mucho el trabajo, cuando se trata de un número elevado de ellas y la técnica a emplear es similar es la clonación de vistas en: Administrar > Construcción del sitio > Views > Lista: > Escogemos la vista que deseemos clonar y seleccionamos Clone, tan solo nos queda renombrarla y adaptarla a nuestras necesidades.

Page 184: PFC Antonio Bernal Baena

184

5.3.9.6.6. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: No haremos uso del elemento de menú “Personal” generado con la

vista. En el menú Personal previamente creado al principio seleccionamos

Añadir opción para crear hasta cuatro elementos de dicho menú que llamaremos:

Profesores Administrativos Becarios Estudiantes

Obtendremos el ID que define cada término de la categoría Perfil:

Si editamos cada término podremos comprobar su ID; el de Profesores es 11, el de Director del departamento es 38, etc. Por tanto tan solo debemos introducirlos en la Ruta interna de Drupal:

Page 185: PFC Antonio Bernal Baena

185

Page 186: PFC Antonio Bernal Baena

186

Page 187: PFC Antonio Bernal Baena

187

Page 188: PFC Antonio Bernal Baena

188

5.3.9.6.7. Visibilidad de bloques Administrar > Construcción del sitio > Bloques > Lista: En la región “content bottom” exponemos los bloques:

asignaturas_profesor grupo_investigacion_profesor pfc_profesor Author Contact

Y los configuramos para que solo aparezcan en las páginas de personal. En todos los casos:

Administrar > Construcción del sitio > Bloques > Lista: En la región “lateral izquierdo” exponemos el menú general:

Personal

Page 189: PFC Antonio Bernal Baena

189

5.3.9.6.8. Prototipos de pantalla Menú Personal. Elemento del menú Profesores.

Page 190: PFC Antonio Bernal Baena

190

Menú Personal. Elemento del menú Administrativos.

Page 191: PFC Antonio Bernal Baena

191

Menú Personal. Elemento del menú Becarios.

Page 192: PFC Antonio Bernal Baena

192

Menú Personal. Elemento del menú Estudiantes.

Page 193: PFC Antonio Bernal Baena

193

5.3.9.7. Estudio del caso: Docencia. Estudios. Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Docencia Estudios 1º y 2º ciclo

Tabla de “Licenciatura + Diplomatura + Ingeniería + Ingeniería Técnica”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Licenciatura, Diplomatura, Ingeniería, Ingeniería Técnica), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

EEES

Tabla de “Grado + Posgrado-Máster + Posgrado-Doctorado”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Grado, Posgrado-Máster, Posgrado-Doctorado), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Máster Oficial

Tabla de “Máster Oficial”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Máster Oficial), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Formación Permanente

Tabla de “Curso + Título de Experto + Máster”: Titulación Código Oferta Académica

Ficha de contenido “Titulación”: Nombre de Titulación, Oferta Académica (Curso, Título de Experto, Máster), Código, Descripción de los estudios, Guía docente, Web. Tabla de “Asignaturas de los estudios”: Asignatura Año Académico

Page 194: PFC Antonio Bernal Baena

194

Descripción de Elementos de Drupal Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Titulación: Nombre de Titulación Código Group Detalles de los estudios: Descripción de los estudios Guía docente Web

Oferta Académica: Licenciatura Diplomatura Ingeniería Ingeniería Técnica Grado Posgrado-Máster Posgrado-Doctorado Máster Oficial Curso Título de Experto Máster

estudios asignaturas_titulacion

Page Menu Block

Campo obligatorio.

Page 195: PFC Antonio Bernal Baena

195

5.3.9.7.1. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Titulación

Page 196: PFC Antonio Bernal Baena

196

5.3.9.7.2. Creación de Categorías Administrar > Gestión de contenido > Categorías > Añadir vocabulario: Creamos el vocabulario Oferta Académica:

Page 197: PFC Antonio Bernal Baena

197

Creamos también la lista de términos del vocabulario:

Page 198: PFC Antonio Bernal Baena

198

5.3.9.7.3. Creación de campos Administrar > Gestión de contenido > Tipo de contenido > Edit Titulación: Creamos los campos CCK y cómo se mostrarán en los nodos, con

Manage fields y Display fields, así como con la pestaña Add group con la cual agrupamos varios campos

Como vemos, el campo etiquetado como Guía docente, es del tipo File, aportado por el módulo File Field a Content (CCK). Es importante asignar un alias automático de URL a este tipo de

contenido, esto nos servirá para trabajar con las vistas. Administrar > Configuración del sitio > Alias automático de URL > Opciones para nodos:

Page 199: PFC Antonio Bernal Baena

199

Con lo cual ya podemos dar de alta contenidos Tipo Titulación en Administración > Gestión de contenido > Contenido > Añadir Titulación:

Page 200: PFC Antonio Bernal Baena

200

5.3.9.7.4. Creación de vistas Para cumplir con los requerimientos que nos muestra el inventario de contenidos necesitamos la generación de dos vistas distintas; una propia referente a los propios estudios y otra en la que reflejaremos las asignaturas de cada una de las titulaciones específicamente. Vista estudios Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 201: PFC Antonio Bernal Baena

201

Page 202: PFC Antonio Bernal Baena

202

Asignaremos los IDs de los términos componentes de la categoría Oferta Académica para obtener los distintos elementos del menú.

Page 203: PFC Antonio Bernal Baena

203

Page 204: PFC Antonio Bernal Baena

204

Ejemplo del resultado:

Obtenemos una vista que mostrará a los componentes de todas las ofertas académicas. Discriminaremos cuando construyamos los elementos del menú.

Page 205: PFC Antonio Bernal Baena

205

Vista asignaturas_titulacion Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 206: PFC Antonio Bernal Baena

206

Page 207: PFC Antonio Bernal Baena

207

Devolvemos al argumento el valor de la Titulación que debe pasar por la vista, por defecto el argumento no será opcional. El código PHP:

$args[0] = arg(1); //utilizamos arg(1) para recoger el parámetro 1 de la url, es decir, el nodo //por ejemplo en la url node/12, argo(0) será “node” y arg(1) será 12 //indicamos así a la vista el argumento que debe tomar

return $args; //devolvemos los argumentos

Page 208: PFC Antonio Bernal Baena

208

Ejemplo del resultado:

Page 209: PFC Antonio Bernal Baena

209

5.3.9.7.5. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: No haremos uso del elemento de menú “Estudios” generado con la

vista. En el menú Docencia previamente creado al principio seleccionamos

Añadir opción para crear hasta cuatro elementos de dicho menú que llamaremos:

Estudios 1º y 2º Ciclo EEES Máster Oficial Formación Permanente

Obtendremos el ID que define cada término de la categoría Oferta Académica:

Si editamos cada término podremos comprobar su ID; el de Diplomatura es 51, el de Grado es 47, etc. Por tanto tan solo debemos introducirlos en la Ruta interna de Drupal:

Page 210: PFC Antonio Bernal Baena

210

Page 211: PFC Antonio Bernal Baena

211

Page 212: PFC Antonio Bernal Baena

212

5.3.9.7.6. Visibilidad de bloques Administrar > Construcción del sitio > Bloques > Lista: En la región “content bottom” exponemos el bloque:

asignaturas_titulacion

Y lo configuramos para que solo aparezca en las páginas de estudios:

Administrar > Construcción del sitio > Bloques > Lista: En la región “lateral izquierdo” exponemos el menú general:

Docencia

Page 213: PFC Antonio Bernal Baena

213

5.3.9.7.7. Prototipos de pantalla Menú Docencia. Elemento del menú Estudios 1º y 2º Ciclo.

Page 214: PFC Antonio Bernal Baena

214

Menú Docencia. Elemento del menú EEES.

Page 215: PFC Antonio Bernal Baena

215

Menú Docencia. Elemento del menú Máster Oficial.

Page 216: PFC Antonio Bernal Baena

216

Menú Docencia. Elemento del menú Formación Permanente.

Page 217: PFC Antonio Bernal Baena

217

5.3.9.8. Estudio del caso: Docencia. Asignaturas. Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Docencia Asignaturas Tabla de “Asignaturas Impartidas”: Asignatura Coordinador Año Académico *Búsqueda por texto *Áreas

Ficha de contenido “Asignatura”: Nombre de la asignatura, Código de la asignatura, Titulación, Créditos, Año Académico (2009/2010, 2010/2011, 2011/2012), Curso / Cuatrimestre (Primero, Segundo, Tercero, Cuarto, Quinto ), Área (CCIA, LSI), Coordinador, Acceso para el coordinador, Profesores de la asignatura, Descriptores de la asignatura, Guía docente, Web, Bibliografía recomendada. Lista de “Noticias” de la asignatura

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Noticias Lista de “Noticias” 5 ítems. y Todas las noticias

Ficha de contenido “Noticias”: Título Asignatura de referencia Cuerpo

Page 218: PFC Antonio Bernal Baena

218

Descripción de Elementos de Drupal Tipo de Contenido y campos

Categoría y términos

View Bloque / Page / Menú

Asignatura: Nombre de la asignatura Código de la asignatura Titulación Créditos Bibliografía recomendada Group Detalles de la asignatura: Coordinador Acceso para el coordinador Profesores de la asignatura Descriptores de la asignatura Guía docente Web

Año Académico: 2009/2010 2010/2011 2011/2012 Área: CCIA LSI Curso/Cuatrimestre: Primero Segundo Tercero Cuarto Quinto

argumento_coordinador asignaturas noticias_por_asignatura

Page Page Menú Block

Campo obligatorio.

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Noticias: Título Asignatura de referencia Cuerpo

noticias Page Block Menu

Campo obligatorio.

Implementaremos los Tipos de Contenido, Asignatura y Noticia para dar respuesta a este apartado.

Entre los requerimientos de acceso está la edición por parte del profesorado de sus propias asignaturas, pero no la creación de las mismas. La creación de asignaturas es potestad del Administrador y Drupal fija como autor por defecto al creador del nodo, por tanto el acceso de edición a nodos propios que nos aporta Drupal por defecto no sería de aplicación en este caso. Para resolverlo el Administrador asignará cuando cree por primera vez cada asignatura a un usuario que sí podrá, gracias a los tres módulos que configuraremos y explicaremos en el siguiente apartado, editar ese nodo que será del Tipo Asignatura.

Page 219: PFC Antonio Bernal Baena

219

5.3.9.8.1. Configuración de módulos Administrar > Construcción del sitio > Módulos: User Reference Añade un tipo de campo CCK que nos servirá para referenciar a un usuario del sistema por el rol que ocupa:

Node Access User Reference Permitirá acceso a ver, editar o borrar un nodo al usuario referenciado:

Page 220: PFC Antonio Bernal Baena

220

Content Access Permite la posibilidad de control de vista, edición y borrado a nivel de rol para cada Tipo de Contenido creado, instalándose como la pestaña “Control de acceso”. De este módulo nos interesa activar su control de acceso por nodo para el Tipo de Contenido Asignatura exclusivamente.

Obtendríamos el usuario a referenciar de entre los roles profesores, director o secretario; la garantía del acceso a la edición del nodo por parte de un usuario en concreto de entre estos roles que será “Requerido” (no admitirá valores múltiples) y la activación de dicho acceso a nivel de nodo individual para el Tipo de Contenido Asignatura.

Page 221: PFC Antonio Bernal Baena

221

5.3.9.8.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Noticias

Page 222: PFC Antonio Bernal Baena

222

Creamos el Tipo de Contenido Asignatura

Page 223: PFC Antonio Bernal Baena

223

5.3.9.8.3. Creación de categorías Administrar > Gestión de contenido > Categorías > Añadir vocabulario: Creamos varios vocabularios que se relacionan con el Tipo de

Contenido Asignatura así como con otros tipos de contenido que iremos viendo. Los resumimos en la siguiente tabla:

Nombre Tipo Año Académico Asignatura, Proyecto FC/FM Área Asignatura, Ficha de personal, Proyecto FC/FM Curso / Cuatrimestre Asignatura, Proyecto FC/FM

Creamos también la lista de términos de cada vocabulario:

Page 224: PFC Antonio Bernal Baena

224

Page 225: PFC Antonio Bernal Baena

225

5.3.9.8.4. Creación de campos Campos del Tipo de Contenido Noticias

El campo con etiqueta “Asignatura de referencia” nos permitirá seleccionar la asignatura a la que puede ir referida una noticia; no es un campo requerido, por tanto una noticia podrá o no estar dedicada a una asignatura. Hemos marcado como tipo de contenido que puede ser referenciado a “Asignatura” durante la configuración del campo.

Page 226: PFC Antonio Bernal Baena

226

Campos del Tipo de Contenido Asignaturas

Page 227: PFC Antonio Bernal Baena

227

En los casos anteriores hemos trabajado con campos de Asignatura que hacían referencia a profesores y a titulaciones, dichos campos son del Tipo Node Reference: El campo etiquetado como Titulación hace referencia al Tipo de

Contenido Titulación. Los campos etiquetados como Coordinador y como Profesores de la

asignatura hacen referencia al Tipo de Contenido Ficha de personal; en ambos casos tenemos que discriminar que dichos campos devuelvan al Administrador cuando rellene la ficha de asignatura tan solo nombres de profesores, entre todos los usuarios del sistema. A tal efecto se implementa la vista argumento_coordinador que nos devolverá los nodos que pueden ser exclusivamente referenciados.

Page 228: PFC Antonio Bernal Baena

228

El campo Bibliografía recomendada hace referencia al Tipo de Contenido Publicaciones que explicaremos próximamente.

El campo Acceso para el coordinador nos va a permitir el acceso de los profesores a editar sus propias asignaturas a pesar de que no hayan sido creadas por ellos; en la pantalla siguiente vemos, como al principio, la interactuación de los módulos User Reference y Node Access User Reference:

Page 229: PFC Antonio Bernal Baena

229

En la pestaña Control de Acceso que instala el módulo Content Access hemos activado el control de acceso para este tipo de nodo:

Con este sistema obtenemos el objetivo propuesto de acceso a la edición de asignaturas por parte del profesorado, pero no a su creación. Es importante asignar un alias automático de URL al tipo de contenido Asignatura, esto nos servirá para trabajar con las vistas. Administrar > Configuración del sitio > Alias automático de URL > Opciones para nodos:

Page 230: PFC Antonio Bernal Baena

230

Con lo cual ya podemos dar de alta contenidos Tipo Noticias en Administración > Gestión de contenido > Contenido > Añadir Noticias:

Page 231: PFC Antonio Bernal Baena

231

Y también podemos dar de alta contenidos Tipo Asignatura en Administración > Gestión de contenido > Contenido > Añadir Asignatura:

Page 232: PFC Antonio Bernal Baena

232

5.3.9.8.5. Creación de vistas Para cumplir con los requerimientos que nos muestra el inventario de contenidos necesitamos la generación de cuatro vistas:

• asignaturas • argumento_coordinador • noticias • noticias_por_asignatura

Vista asignaturas Administrar > Construcción del sitio > Views > Añadir Creamos la vista

Page 233: PFC Antonio Bernal Baena

233

Page 234: PFC Antonio Bernal Baena

234

Page 235: PFC Antonio Bernal Baena

235

Ejemplo del resultado:

Page 236: PFC Antonio Bernal Baena

236

Vista argumento_coordinador Administrar > Construcción del sitio > Views > Añadir Creamos la vista

Page 237: PFC Antonio Bernal Baena

237

Ejemplo del resultado:

Page 238: PFC Antonio Bernal Baena

238

Vista noticias Administrar > Construcción del sitio > Views > Añadir Creamos la vista

Page 239: PFC Antonio Bernal Baena

239

Page 240: PFC Antonio Bernal Baena

240

El componente del módulo Views, Views RSS, nos facilita este recurso para suscripciones. Lo añadimos.

Page 241: PFC Antonio Bernal Baena

241

Ejemplo del resultado:

Page 242: PFC Antonio Bernal Baena

242

Vista noticias_por_asignatura Administrar > Construcción del sitio > Views > Añadir Creamos la vista

Page 243: PFC Antonio Bernal Baena

243

Page 244: PFC Antonio Bernal Baena

244

Devolvemos al argumento el valor de la Asignatura que debe pasar por la vista. El código PHP:

$args[0] = arg(1); //utilizamos arg(1) para recoger el parámetro 1 de la url, es decir, el nodo //indicamos así a la vista el argumento que debe tomar

return $args; //devolvemos los argumentos

Page 245: PFC Antonio Bernal Baena

245

Ejemplo del resultado:

Page 246: PFC Antonio Bernal Baena

246

5.3.9.8.6. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista Activamos el elemento de menú Noticias y lo asignamos a Primary

links:

Activamos el elemento de menú Asignaturas y lo asignamos a

Docencia:

Page 247: PFC Antonio Bernal Baena

247

5.3.9.8.7. Visibilidad de bloques Administrar > Construcción del sitio > Bloques > Lista: En la región “content bottom” exponemos el bloque:

noticias

Y lo configuramos para que solo aparezca en página inicial:

En la región “content bottom” también exponemos el bloque:

noticias_por_asignatura

Y lo configuramos para que solo aparezca en páginas de asignaturas:

Page 248: PFC Antonio Bernal Baena

248

5.3.9.8.8. Prototipos de pantalla Menú Docencia. Elemento del menú Asignaturas.

Page 249: PFC Antonio Bernal Baena

249

5.3.9.9. Estudio del caso: PFC / Fin de Máster Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Docencia PFC/Fin Máster Tabla de “Proyectos FC/FM”: Título del proyecto Coordinador Disponibilidad

Ficha de contenido “Proyecto FC/FM”: Título, Código del proyecto, Créditos, Titulación, Año Académico (2009/2010, 2010/2011, 2011/2012) , Curso / Cuatrimestre (Primero, Segundo, Tercero, Cuarto, Quinto), Área (CCIA, LSI), Disponibilidad (Asignado, Leído, Propuesto), Disponibilidad (detalles), Coordinador del proyecto, Profesores del proyecto, Descripción del proyecto, Guía docente, Web, Bibliografía recomendada.

Descripción de Elementos de Drupal

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Proyecto FC/FM: Título Código del proyecto Créditos Titulación Disponibilidad (detalles) Bibliografía recomendada Group Detalles del proyecto: Coordinador del proyecto Profesores del proyecto Descripción del proyecto Guía docente Web

Año Académico: 2009/2010 2010/2011 2011/2012 Área: CCIA LSI Curso/Cuatrimestre: Primero Segundo Tercero Cuarto Quinto Disponibilidad: Asignado Leído Propuesto

pfc Page Menu

Campo obligatorio.

Page 250: PFC Antonio Bernal Baena

250

5.3.9.9.1. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Proyecto FC/FM

Page 251: PFC Antonio Bernal Baena

251

5.3.9.9.2. Creación de categorías Administrar > Gestión de contenido > Categorías > Añadir vocabulario: Existen varios vocabularios que se relacionan con el Tipo de

Contenido Proyecto FC/FM, y creamos uno nuevo llamado Disponibilidad. Los resumimos en la siguiente tabla:

Nombre Tipo Año Académico Asignatura, Proyecto FC/FM Área Asignatura, Ficha de personal, Proyecto FC/FM Curso / Cuatrimestre Asignatura, Proyecto FC/FM Disponibilidad Proyecto FC/FM

Creamos también la lista de términos del vocabulario Disponibilidad:

Page 252: PFC Antonio Bernal Baena

252

5.3.9.9.3. Creación de campos Administrar > Gestión de contenido > Tipo de contenido > Edit Proyecto FC/FM > Añadir un campo: El resultado podemos verlo en la pestaña Manage fields:

Page 253: PFC Antonio Bernal Baena

253

Describimos los campos Tipo Node Reference: El campo etiquetado como Titulación hace referencia al Tipo de

Contenido Titulación. Los campos etiquetados como Coordinador del proyecto y Profesores

del proyecto hacen referencia al Tipo de Contenido Ficha de personal e incorporan la vista argumento_coordinador que nos devolverá los nodos que pueden ser exclusivamente referenciados (nombres de profesores).

El campo etiquetado como Bibliografía recomendada hace referencia al Tipo de Contenido Publicaciones.

Asignamos un alias automático de URL a este tipo de contenido, esto nos servirá para trabajar con las vistas. Administrar > Configuración del sitio > Alias automático de URL > Opciones para nodos:

Page 254: PFC Antonio Bernal Baena

254

Con lo cual ya podemos dar de alta contenidos Tipo Proyecto FC/FM en Administración > Gestión de contenido > Contenido > Añadir Proyecto FC/FM:

Page 255: PFC Antonio Bernal Baena

255

5.3.9.9.4. Creación de vistas Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 256: PFC Antonio Bernal Baena

256

Page 257: PFC Antonio Bernal Baena

257

Ejemplo del resultado:

Page 258: PFC Antonio Bernal Baena

258

5.3.9.9.5. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: Activamos el elemento de menú PFC/Fin Máster y lo asignamos a

Docencia:

Page 259: PFC Antonio Bernal Baena

259

5.3.9.9.6. Prototipos de pantalla

Page 260: PFC Antonio Bernal Baena

260

5.3.9.10. Estudio del caso: Tutorías Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Docencia Tutorías Tabla de “Tutorías”: Profesor Horario Despacho

Descripción de Elementos de Drupal

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú tutorías Page

Menu

Page 261: PFC Antonio Bernal Baena

261

5.3.9.10.1. Creación de vistas Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 262: PFC Antonio Bernal Baena

262

Page 263: PFC Antonio Bernal Baena

263

Ejemplo del resultado:

Page 264: PFC Antonio Bernal Baena

264

5.3.9.10.2. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: Activamos el elemento de menú Tutorías y lo asignamos a Docencia:

Page 265: PFC Antonio Bernal Baena

265

5.3.9.10.3. Prototipos de pantalla

Page 266: PFC Antonio Bernal Baena

266

5.3.9.11. Estudio del caso: Investigación Inventario de Contenidos y Etiquetado Menú Elemento del

menú Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Investigación

Grupos

Tabla de “Grupos de investigación”: Grupo Responsable Web

Ficha de contenido “Grupo de investigación”: Nombre del grupo, Responsable, Miembros del grupo, Web, Descripción del grupo.

Publicaciones

Lista de “Publicaciones” Todas las publicaciones

Ficha de contenido “Publicaciones”: Título Año Autor

Seminarios

Lista de “Seminarios” Todos los seminarios

Ficha de contenido “Seminario”: Título, Descripción del seminario, Fecha, Ponente, Coordinador, Web.

Descripción de Elementos de Drupal Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Grupo de investigación: Nombre del grupo Responsable Miembros del grupo Web Descripción del grupo

grupos_investigacion Page Menú

Campo obligatorio.

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Publicaciones

Utilizaremos el módulo contribuido Bibliography Module

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú Seminario: Título Descripción del seminario Fecha Ponente Coordinador Web

seminarios Page Menu

Campo obligatorio.

Implementaremos los Tipos de Contenido, Grupo de investigación, Publicaciones y Seminario para dar respuesta a este apartado.

Page 267: PFC Antonio Bernal Baena

267

5.3.9.11.1. Configuración de módulos Biblio Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido Biblio que genera un Tipo de

Contenido propio, definido por el sistema llamado biblio. Podemos configurar el módulo en:

Administrar > Configuración del sitio > Ajustes Bibliografía >Preferencias:

En esta pestaña hemos determinado el Path para los contenidos de Publicaciones que generemos. En la opción de Predeterminar Campos podemos escoger los campos que deseamos usar y cómo llamarlos; también podemos acceder a la Personalización de tipos y editar cada tipo de publicación para editar u ocultar la lista de tipos de publicaciones que se ofrece al usuario. Nosotros hemos traducido los títulos de los campos requeridos por defecto, no obstante, este módulo no aporta mucha flexibilidad en la gestión de contenidos de una biblioteca.

Page 268: PFC Antonio Bernal Baena

268

5.3.9.11.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Grupo de investigación

Page 269: PFC Antonio Bernal Baena

269

Creamos el Tipo de Contenido Publicaciones

Hemos renombrado el tipo de contenido biblio como Publicaciones.

Page 270: PFC Antonio Bernal Baena

270

Creamos el Tipo de Contenido Seminario

Page 271: PFC Antonio Bernal Baena

271

5.3.9.11.3. Creación de campos Campos del Tipo de Contenido Grupo de investigación

El campo etiquetado como Responsable es del tipo Node Reference al Tipo de Contenido Ficha de Personal, filtrado por la vista argumento_coordinador, al igual que ocurre con Miembros del grupo. Campos del Tipo de Contenido Publicaciones

Para este Tipo de Contenido no definimos campos CCK adicionales. Ya hemos visto que por defecto el módulo aporta multitud de ellos.

Page 272: PFC Antonio Bernal Baena

272

Campos del Tipo de Contenido Seminario

• El campo etiquetado como Fecha es del tipo Date, lo cual nos da la posibilidad de que aparezca en el Calendario.

• El campo etiquetado como Coordinador es Node Reference a Ficha de personal y filtrado por la vista argumento_coordinador.

Administrar > Configuración del sitio > Alias automático de URL > Opciones para nodos:

Page 273: PFC Antonio Bernal Baena

273

Con lo cual ya podemos dar de alta contenidos Tipo Grupo de investigación en Administración > Gestión de contenido > Contenido > Añadir Grupo de investigación:

Page 274: PFC Antonio Bernal Baena

274

Dar de alta contenidos Tipo Publicaciones en Administración > Gestión de contenido > Contenido > Añadir Bibliography:

Page 275: PFC Antonio Bernal Baena

275

Dar de alta contenidos Tipo Seminario en Administración > Gestión de contenido > Contenido > Añadir Seminario:

Page 276: PFC Antonio Bernal Baena

276

5.3.9.11.4. Creación de vistas Crearemos dos vistas:

• grupos_investigacion • seminarios

Vista grupos_investigacion Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 277: PFC Antonio Bernal Baena

277

Page 278: PFC Antonio Bernal Baena

278

Ejemplo del resultado:

Page 279: PFC Antonio Bernal Baena

279

Vista seminarios Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 280: PFC Antonio Bernal Baena

280

Esta vista es una Lista de resúmenes, por tanto no tiene objeto el apartado Campos.

Page 281: PFC Antonio Bernal Baena

281

Ejemplo del resultado:

Page 282: PFC Antonio Bernal Baena

282

5.3.9.11.5. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: Activamos el elemento de menú Grupos y lo asignamos a

Investigación:

Page 283: PFC Antonio Bernal Baena

283

En el menú Investigación seleccionamos Añadir opción para dar de alta el elemento de menú Publicaciones con su ruta URL:

Activamos el elemento de menú Seminarios y lo asignamos a

Investigación:

Page 284: PFC Antonio Bernal Baena

284

5.3.9.11.6. Visibilidad de bloques Administrar > Construcción del sitio > Bloques > Lista: En la región “lateral izquierdo” exponemos el menú general:

Investigación

Page 285: PFC Antonio Bernal Baena

285

5.3.9.11.7. Prototipos de pantalla Menú Investigación. Elemento del menú Grupos.

Page 286: PFC Antonio Bernal Baena

286

Menú Investigación. Elemento del menú Publicaciones.

Page 287: PFC Antonio Bernal Baena

287

Menú Investigación. Elemento del menú Seminarios.

Page 288: PFC Antonio Bernal Baena

288

5.3.9.12. Estudio del caso: Gestión y Calendario Inventario de Contenidos y Etiquetado

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Gestión Menú restringido a usuarios identificados

Convocatorias Tabla de “Comisión Permanente”: Convocatoria Fecha

Ficha de contenido “Comisión Permanente”: Convocatoria, Tipo de convocatoria (Ordinaria, Extraordinaria), Fecha, Hora segunda convocatoria, Lugar, Orden del día, Lista de convocados * Comunicación de la convocatoria vía correo electrónico

Tabla de “Consejo de Departamento”: Convocatoria Fecha

Ficha de contenido “Consejo de Departamento”: Convocatoria, Tipo de convocatoria (Ordinaria, Extraordinaria), Fecha, Hora segunda convocatoria, Lugar, Orden del día, Lista de convocados * Comunicación de la convocatoria vía correo electrónico

Menú Elemento del menú

Presentación de la información al usuario

Ficha de Contenido que se presenta al usuario

Calendario Imagen Calendario Vista mensual Anotaciones del Calendario: Seminarios Comisiones Permanentes Consejos de Departamento

Descripción de Elementos de Drupal Tipo de Contenido y campos

Categoría y términos

View Bloque / Page / Menú

Comisión Permanente: Convocatoria Fecha Hora segunda convocatoria Lugar Orden del día Lista de convocados

Tipo de Convocatoria: Ordinaria Extraordinaria

argumento_comision convocatorias_comision

Page Page Menú

Consejo de Departamento: Convocatoria Fecha Hora segunda convocatoria Lugar Orden del día Lista de convocados

Tipo de Convocatoria: Ordinaria Extraordinaria

argumento_consejo convocatorias_consejo

Page Page Menú

Campo obligatorio.

Tipo de Contenido y campos Categoría y términos View Bloque / Page / Menú calendario Page

Block

Page 289: PFC Antonio Bernal Baena

289

En este caso enlazamos varios requerimientos a los que vamos a dar respuesta. Debemos crear un menú restringido a usuarios identificados en donde se depositen las convocatorias de Comisiones Permanentes y de Consejos de Departamento, que a su vez, cuando son creadas por el usuario (será el Secretario del Departamento) queden publicadas en un Calendario mostrado a la audiencia (incluyendo en él los Seminarios) y se envíe un mail a una lista de usuarios del Departamento previamente suscritos.

5.3.9.12.1. Configuración de módulos Administrar > Construcción del sitio > Módulos: Activamos:

• Messaging • Notifications • Calendar • Date

Messaging y Notifications Administrar > Mensajes y Notificaciones: Messaging methods:

Page 290: PFC Antonio Bernal Baena

290

Messaging templates: Desde aquí podemos personalizar encabezado, cuerpo y pie de los mensajes que reciban los usuarios descritos. Decidimos generar enlaces a los nodos de convocatorias como cuerpo de los envíos para evitar un tránsito de información pesada en el sistema. Existen muchas posibilidades de personalización, por ejemplo:

Page 291: PFC Antonio Bernal Baena

291

Notifications settings:

Opciones generales: Inmediate sending Events: notificar cuando se creen o actualicen nodos

Tipo de contenido: solo usaremos este módulo para notificaciones referentes a Comisión Permanente o Consejo de Departamento.

Notifications settings: es un registro de notificaciones.

Cuando demos de alta a un usuario, el Administrador podrá suscribirlo directamente; no obstante, aquellos usuarios que dispongan de la posibilidad de editar su Ficha de personal, también podrán suscribirse en dicho momento para recibir las convocatorias por correo electrónico.

Page 292: PFC Antonio Bernal Baena

292

Administración > Usuarios > Lista > editar usuario > Notificaciones > Content type:

Calendar Date Estos módulos se sitúan en el apartado de Módulos “Date/Time”, hemos activado los siguientes componentes:

Page 293: PFC Antonio Bernal Baena

293

Como vemos los módulos Views y Content son fundamentales para que Calendar y Date nos aporten la funcionalidad que necesitamos para generar una vista tipo calendario y mostrarlo en un bloque así como para que gracias al campo CCK que genera Date podamos incluir contenidos en el calendario. En la administración Calendar se sitúa en: Administrar > Configuración del sitio > Calendar Setup

Page 294: PFC Antonio Bernal Baena

294

5.3.9.12.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Creamos el Tipo de Contenido Comisión Permanente

Page 295: PFC Antonio Bernal Baena

295

Creamos el Tipo de Contenido Consejo de Departamento

Page 296: PFC Antonio Bernal Baena

296

5.3.9.12.3. Creación de categorías Administrar > Gestión de contenido > Categorías > Añadir vocabulario: Creamos la categoría Tipo de convocatoria

Creamos sus términos

Page 297: PFC Antonio Bernal Baena

297

5.3.9.12.4. Creación de campos Los campos de ambos tipos de contenido son iguales:

Es aquí donde el módulo Date nos aporta la posibilidad de incluir un campo CCK tipo fecha. El campo etiquetado como Lista de convocados aportará automáticamente la lista del personal del departamento que pertenece a la comisión o al consejo. Recordemos que en la Ficha de personal existe un campo que nos indica si el usuario pertenece a uno u otro Organo de Gobierno, por tanto el Node Reference que hace Lista de convocados a Ficha de personal será filtrado por dos vistas que crearemos:

• argumento_comision: devolverá el personal del departamento que pertenece al órgano de gobierno Comisión Permanente.

• argumento_consejo: devolverá el personal del departamento que pertenece al órgano de gobierno Consejo de Departamento.

En este caso no hemos introducido un path predefinido en alias automático.

Page 298: PFC Antonio Bernal Baena

298

Con lo cual ya podemos dar de alta contenidos Tipo Comisión Permanente en Administración > Gestión de contenido > Contenido > Añadir Comisión Permanente:

Page 299: PFC Antonio Bernal Baena

299

Alta de contenidos Tipo Consejo de Departamento en Administración > Gestión de contenido > Contenido > Añadir Consejo de Departamento:

Page 300: PFC Antonio Bernal Baena

300

5.3.9.12.5. Creación de vistas Necesitamos crear cinco vistas para dar respuesta al caso:

• argumento_comision • argumento_consejo • convocatorias_comision • convocatorias_consejo • calendario

Las vistas argumento_comisión y argumento_consejo están clonadas, por tanto nos referiremos solo a una de ellas, argumento_consejo, teniendo en cuenta que la diferencia estriba en los títulos y en el término de la taxonomía que escogemos para filtrar: Comisión Permanente o Consejo de departamento. Las vistas convocatorias_comision y convocatorias_consejo también están clonadas. En este caso hemos optado por visualizar las vistas en un menú de solapas que enlace directamente desde el elemento de menú Convocatorias.

Page 301: PFC Antonio Bernal Baena

301

Vista argumento_consejo Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 302: PFC Antonio Bernal Baena

302

Ejemplo del resultado:

Page 303: PFC Antonio Bernal Baena

303

Vistas convocatorias_comision y convocatorias_consejo Administrar > Construcción del sitio > Views > Añadir: El filtro que aplicaremos será por Tipo de nodo, Comisión Permanente o Consejo de Departamento en cada caso. Explicaremos el sistema de solapas generado y luego reflejaremos los campos y filtros de la vista convocatorias_comision. Primero creamos la vista convocatorias_comision con URL de página “convocatorias/comision” y en Menú:

Seleccionamos “Poner por defecto el menú solapa” para que aparezca como una pestaña y sea la pestaña por defecto para la URL asignada.

Page 304: PFC Antonio Bernal Baena

304

Después vemos la vista convocatorias_consejo, con URL de página “convocatorias/consejo” y en Menú:

Se generará una pestaña anexa a la ya creada para vistas con URL del tipo “convocatorias/*”.

Page 305: PFC Antonio Bernal Baena

305

Campos y filtros de la vista convocatorias_comisión:

Page 306: PFC Antonio Bernal Baena

306

Ejemplo del resultado:

Vista calendario Administrar > Construcción del sitio > Views > Añadir: Creamos la vista

Page 307: PFC Antonio Bernal Baena

307

Gracias al módulo contribuido tenemos la posibilidad de seleccionar un Tipo de Vista Calendar.

Igualmente disponemos de un bloque Calendar que será el que mostraremos más tarde a la audiencia.

Page 308: PFC Antonio Bernal Baena

308

Disponemos los argumentos de una vista tipo Calendar.

Aunque no se ve en la imagen también hemos seleccionado el tipo de nodo Seminario cuya fecha es también un campo CCK tipo Date.

Page 309: PFC Antonio Bernal Baena

309

Ejemplo del resultado:

Page 310: PFC Antonio Bernal Baena

310

5.3.9.12.6. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Lista: Añadir opción del menú Gestión para mostrar las convocatorias:

Page 311: PFC Antonio Bernal Baena

311

5.3.9.12.7. Visibilidad de bloques Administrar > Construcción del sitio > Bloques > Lista: En la región “lateral izquierdo” exponemos los bloques:

calendario Gestión

Configuramos Gestión para que solo aparezca para los roles indicados:

Page 312: PFC Antonio Bernal Baena

312

5.3.9.12.8. Prototipos de pantalla

Page 313: PFC Antonio Bernal Baena

313

5.3.9.13. Estudio del caso: Utilidades de los usuarios Inventario de Contenidos y Etiquetado

Utilidades de los Usuarios Iconos de acciones de impresión, envío por e-mail y descarga en PDF de las Fichas de contenido que se presentan al usuario final Carga de archivos en los distintos Tipos de contenido que generarán los usuarios con acceso identificado Control de Spam en los Formularios de contacto

Descripción de Elementos de Drupal Para dar respuesta al inventario de contenidos hemos instalado tres módulos contribuidos:

• Print • File Field (también Upload que es un módulo core-opcional) • CAPTCHA

Page 314: PFC Antonio Bernal Baena

314

5.3.9.13.1. Configuración de módulos Print Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido Print

Administrar > Configuración del sitio > Versiones para impresora, enviar por correo electrónico y exportar como PDF: Opciones generales PDF: este módulo necesita una herramienta de generación de PDF

externa. Descargamos la herramienta TCPDF de

http://sourceforge.net/projects/tcpdf/ Instalamos TCPDF vía FTP en

www/drupal/sites/all/modules/print/lib

Y configuramos el módulo:

Page 315: PFC Antonio Bernal Baena

315

correo electrónico: efectuamos la configuración de opciones de igual modo que anteriormente.

Página Web: repetimos la operación. Para terminar con la configuración ajustamos en los Tipos de Contenidos que hemos creado para dejar tan solo la opción “Mostrar enlace” tanto para impresora como para correo electrónico y PDF:

Page 316: PFC Antonio Bernal Baena

316

File Field y Upload Administrar > Construcción del sitio > Módulos: Activamos el módulo core-opcional Upload: el sistema de Drupal

activará la opción “Adjuntos” en los Tipos de Contenido.

Activamos el módulo contribuido File Field: tendremos un nuevo

campo CCK en los Tipos de Contenido que nos permitirá cargar distintos tipos de fichero.

Page 317: PFC Antonio Bernal Baena

317

CAPTCHA Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido CAPTCHA

Administrar > Configuración del sitio > Gestión de usuarios > CAPTCHA > Configuraciones generales:

Page 318: PFC Antonio Bernal Baena

318

Hemos elegido el Tipo de reto matemático pero también existe el tipo texto:

Page 319: PFC Antonio Bernal Baena

319

5.3.9.14. Estudio del caso: Control de acceso Inventario de Contenidos y Etiquetado

Acceso identificado de los Usuarios Permisos del usuario Profesores Director Secretario Estudiantes PAS Editar su propia ficha de personal • • •

Editar su propia asignatura • • •

Crear y Editar su propio Proyecto FC/FM • • •

Crear y Editar sus propias Noticias • • •

Editar Grupo de Investigación • • •

Crear y Editar su propio Seminario • • •

Crear y Editar Comisión Permanente

Crear y Editar Consejo de Departamento

Crear y Editar Destacados • •

Crear y Editar Publicaciones • • •

Crear y Editar Enlaces • • •

Suscripción por mail a convocatorias • • • • • El usuario administrador del sistema dispone de todos los privilegios para la administración del Portal, sus principales responsabilidades serán:

- Configuración de la plataforma personalizando las áreas de contenidos que se precisen - Actualización de los contenidos de la Web - Gestión de altas y bajas de usuarios - Control de acceso a las zonas públicas y privadas de la Web - Actualización del software del CMS

Descripción de Elementos de Drupal En los anexos “Manual del Administrador” y “Manual del Usuario” explicaremos cómo pueden gestionar los distintos roles el Sistema de Gestión de Contenidos implementado para el Departamento. La asignación de permisos se hace desde el apartado de administración de Drupal. Previamente instalaremos un módulo llamado SimpleMenu que facilitará a los distintos roles de usuario el acceso a las funcionalidades que hemos determinado en el inventario de contenidos.

Page 320: PFC Antonio Bernal Baena

320

5.3.9.14.1. Configuración de módulos SimpleMenu Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido SimpleMenu

Genera un sistema de administración configurable mediante la asignación de menús. El objetivo de instalación de este módulo proviene del uso de Content Access para la edición de asignaturas propias por parte del profesorado. El módulo Administration Menu no controlaba bien los conflictos de permisos que surgían de los diferentes módulos instalados a tal efecto, ya que se trata de un módulo preferentemente dedicado a proveer un menú de administración lo más usable posible y no hace un control exhaustivo del acceso. Con SimpleMenu creamos un menú con los enlaces que debía incluir (Crear contenido, Terminar sesión, etc.) y seleccionamos desde la administración este menú como preferente; en las pruebas efectuadas conseguimos el objetivo de presentar un menú de gestión a los distintos roles de usuario que respondiera a sus autorizaciones.

Page 321: PFC Antonio Bernal Baena

321

5.3.9.14.2. Creación de elementos de menú Administrar > Construcción del sitio > Menús > Añadir menú:

Crear/Publicar contenido. Escogemos del menú Navegación al elemento Crear contenido (y sus

hijos), lo editamos y lo reasignamos a Crear/Publicar contenido:

Page 322: PFC Antonio Bernal Baena

322

Igualmente asignamos como elemento del menú Crear/Publicar contenido a Cerrar sesión:

Administrar > Configuración del sitio > SimpleMenu:

Page 323: PFC Antonio Bernal Baena

323

Escogemos el menú que hemos creado y un tema de los que aporta el módulo:

Obtenemos una barra de menú adicional a la de administración con los apartados Crear contenido y Cerrar sesión que resulta eficaz en la gestión de los permisos asignados a los usuarios identificados.

Page 324: PFC Antonio Bernal Baena

324

5.3.9.14.3. Asignación de permisos Administrar > Gestión de usuarios > Control de acceso:

Marcamos las distintas opciones de autorización para el acceso identificado de los usuarios del sistema, agrupados en roles. El Administrador del sistema podrá gestionar estos permisos ante nuevos requerimientos.

Page 325: PFC Antonio Bernal Baena

325

5.3.10. Tema Un tema (theme) es una colección de archivos que definen el look & feel de un sitio Web. La comunidad de Drupal ha creado su propio motor (engine) para los temas, llamado PHPTemplate, basado en PHP. Se encuentra ubicado en drupal/themes/engines/phptemplate: Plantillas (templates) por defecto:

• block.tpl.php • box.tpl.php • comment.tpl.php • default.tpl.php • node.tpl.php

Motor:

• phptemplate.engine Los archivos contenidos en el directorio phptemplate trabajan en conjunción con los archivos localizados en el directorio activo de temas (principalmente page.tpl.php) para producir la salida resultante. Cuando instalamos Drupal, el tema activado por defecto es Garland. Gracias a él podemos comenzar con la administración y configuración del gestor, pero normalmente, no suele ser suficiente ya que no se ajusta a las necesidades visuales de casi ningún proyecto. Sin embargo se pueden descargar otros temas contribuidos por la comunidad Drupal en: http://drupal.org/project/Themes Si ninguno de estos temas se adapta a nuestros requisitos tendremos que desarrollar un nuevo tema o adaptar alguno de los existentes. Zen, http://drupal.org/project/zen, es un tema ampliamente aceptado por la comunidad Drupal para la adaptación de plantillas, sin embargo, dispone de excesivos componentes que hemos reducido con la finalidad de alcanzar nuestros objetivos visuales para crear un tema ligero y limpio.

Page 326: PFC Antonio Bernal Baena

326

De esta manera tomamos de Zen-core ciertas partes que aportarían flexibilidad para la maquetación:

• page.tpl.php • node.tpl.php • block.tpl.php • template.php • tabs.css • print.css • ie.css

Y sobre ellas modificamos funciones (dentro de template.php) y el propio código (dentro de page.tpl.php y node.tpl.php) para conseguir un tema más ajustado a nuestros propósitos. Uno de los aspectos fundamentales durante el proceso de creación de la plantilla es la sobreescritura de funciones. En Drupal, cualquier función que exista en un módulo con el prefijo “theme_” podrá ser sobrescrita y modificada tal y como queramos que se presente el contenido y se genere el código HTML. Por tanto creamos el código de nuestra tema desde cero, generando los estilos necesarios y tomando de Zen el código y las funciones que precisemos.

Page 327: PFC Antonio Bernal Baena

327

5.3.10.1. Tema framebasico Para crear el tema que denominamos framebasico hemos creado dentro de un directorio con ese nombre la siguiente estructura de archivos y directorios:

• page.tpl.php: es el layout genérico, la plantilla o base de código XHTML genérico para albergar cualquier contenido en Drupal. Maqueta la página Web llamando a las regiones y situándolas en pantalla. Ha sido modificado a partir de Zen.

• node.tpl.php: define la zona de contenido individual de cada nodo.

Incorpora una variante para mostrar las taxonomías. Ha sido modificado a partir de Zen.

• block.tpl.php: define la zona de contenido individual de cada bloque.

Modificado a partir de Zen.

Estos tres primeros ficheros son los encargados del marcado HTML de la página general, de los nodos y de los bloques.

• template.php: se efectúa la declaración de regiones y se definen las

funciones específicas del tema (se han renombrado todas las funciones de “zen” por “framebasico”); también se crean variables usadas en los anteriores archivos. Modificado a partir de Zen.

• style.css: se han introducido estilos para hacer un reset, es decir,

para proceder a dar estilos desde cero y que todos los navegadores lo respeten. El reset usado es de BluePrintCSS, http://www.blueprintcss.org/, concretamente el archivo reset.css. También de BluePrintCSS hemos incorporado, modificada en el mismo archivo style.css, el fichero typography.css

• tabs.css: controla el estilo de las pestañas, procede de Zen, la única

modificación que se ha hecho ha sido sobre la disposición (float) ahora alineado a la derecha.

• print.css: incorporada de Zen y modificada para mejorar la

visualización de los contenidos y adaptarla a las nuevas clases e identificadores (class, id) creadas en la plantilla.

Page 328: PFC Antonio Bernal Baena

328

• estilos-generales.css: definición de estilos generales como el layout de los objetos y estilos tipográficos básicos y genéricos. Dependiendo de los bloques que se activen en las columnas izquierda o derecha se mostrará un layout de tres columnas o de dos columnas.

• nodos-vista.css: estilos que se han adaptado par la visualización de

los nodos y las vistas creadas. • ie.css: Hemos copiado íntegramente la hoja de estilos para IE que

contiene Zen. • images: es el directorio que contiene las imágenes usadas en las

CSS. Las imágenes usadas para las pestañas_tabs proceden directamente de Zen. Las otras imágenes han sido extraídas de la Web de referencia de la Universidad de Huelva: http://www.uhu.es/sevirtual/ y modificadas para adaptarlas:

borde-inf-dcho.gif borde-inf-izdo.gif degradado_sup.jpg sello-uhu.jpg

Los comentarios y modificaciones se han hecho sobre el propio código de los distintos archivos que componen el tema framebasico, quedando documentado.

Page 329: PFC Antonio Bernal Baena

329

5.3.10.2. Instalación del Tema Para instalar un tema contribuido, y en este caso, el tema framebasico hay que crear previamente el subdirectorio themes dentro de drupal/sites/all/. Accedemos por FTP a nuestro sitio Web e instalamos la carpeta framebasico en: drupal/sites/all/themes/. De esta forma la ruta del sistema para nuestro tema contribuido será: www/drupal/sites/all/themes/framebasico. En www/drupal/files cargamos el logo personalizado del tema que es la imagen previamente preparada framebasico_logo.gif cuya original es titulo-uhu.jpg descargada de la Web de referencia comentada de la Universidad de Huelva:

Accedemos como administradores del sistema y vamos al menú de administración, siguiendo estos pasos para configurar el tema de Drupal: Administrar > Construcción del sitio > Temas > Lista:

Activamos framebasico y seleccionamos que quede activo por defecto en el sistema. El tema garland quedará activo pero no será el tema que veamos a partir de ahora:

Page 330: PFC Antonio Bernal Baena

330

Pestaña configurar > Opciones globales: Desactivamos la opción de mostrar información del envío en todos los Tipos de Contenido creados, para que no se muestre la información del autor del nodo en pantalla.

Pestaña configurar > framebasico: Activaremos:

- Logo - Nombre del sitio - Bloque de búsqueda - Ruta al logo personalizado (previamente cargado por FTP):

files/framebasico_logo.gif

Page 331: PFC Antonio Bernal Baena

331

Cuando guardemos la configuración obtendremos nuestro logo situado en la cabecera de la Web; en page.tpl.php habíamos codificado previamente el link de enlace con la Web de la Universidad de Huelva. En Administrar > Configuración del sitio > Información del sitio, recordamos que activamos el nombre del Departamento:

Nombre: “Departamento de Tecnologías de la Información”

Page 332: PFC Antonio Bernal Baena

332

5.3.10.3. Mostrar un menú de enlaces hacia la UHU

Administrar > Construcción del sitio > Menús: Vamos a construir los enlaces hacia la Web de la Universidad de Huelva.

Añadir menú: “Menú Universidad de Huelva” Y creamos tres elementos del menú:

Rectorado Servicios Centros

Cada uno con el enlace correcto, de la misma forma que “Rectorado”:

Page 333: PFC Antonio Bernal Baena

333

Administrar > Construcción del sitio > Bloques: Los bloques pueden mostrarse en diferentes Regiones, dependiendo de las que defina el Tema usado en cada momento. El tema framebasico define ocho regiones posibles:

• navigation • encabezado • content top • lateral derecho • lateral izquierdo • content bottom • closure • pie

Para la definición visual del sitio usaremos la región navigation para presentar el bloque del menú de enlaces “Menú Universidad de Huelva” y la región encabezado para exponer una serie de imágenes aleatorias que completarán la imagen corporativa de la Web. Esta región también presenta al menú que contenga los enlaces primarios, en nuestro caso llamado “Primary links” y el buscador. Ahora veremos cómo hemos implementado la galería de imágenes aleatorias.

Page 334: PFC Antonio Bernal Baena

334

5.3.10.4. Mostrar una galería de imágenes aleatorias A continuación veremos cómo hemos construido una galería de imágenes de aparición aleatoria en pantalla, que serán personalizables por el administrador del sitio. El objetivo es completar el aspecto corporativo del sitio.

Descripción de Elementos de Drupal Tipo de Contenido y campos

Categoría y términos

View Bloque / Page / Menú

Módulos

Imagen portada: Nombre Imagen

imágenes_portada_aleatorias Block

Campo obligatorio.

Para el desarrollo de nuestro objetivo previamente descargamos varias imágenes de la Web de la Universidad de Huelva que nos está sirviendo de referencia:

• banner03.jpg • banner04.jpg • banner05.jpg • banner07.jpg

Instalaremos los módulos:

• ImageCache Este módulo permite generar imágenes de diferente tamaño y dimensiones a partir de una original. A través de un interfaz gráfico de usuario se pueden programar una serie de modificaciones, llamadas “presets” que serán cacheadas y permitirán mostrar una misma imagen de muchas maneras diferentes. Gracias al módulo Views podremos generar una galería de imágenes aleatorias que mostrar en el encabezado de la Web del Departamento.

Page 335: PFC Antonio Bernal Baena

335

• ImageCache Actions: Añade acciones para el diseño de un “preset”, en otras palabras, extiende las funcionalidades de ImageCache

Sin ImageCache Actions:

Con ImageCache Actions:

Por tanto mantenemos este módulo para añadir estas funcionalidades por si el administrador las pudiera considerar válidas en un futuro.

• ImageAPI: Necesitado por ImageCache

Page 336: PFC Antonio Bernal Baena

336

5.3.10.4.1. Configuración de módulos ImageAPI Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido ImageAPI

Administrar > Configuración del sitio > ImageAPI > Configure:

Por defecto nos devuelve una calidad del 75%

ImageCache Administrar > Construcción del sitio > Módulos: Activamos el módulo contribuido ImageCache

Administrar > Construcción del sitio > Add New Preset:

Page 337: PFC Antonio Bernal Baena

337

Añadimos el preset “imagenes_portada” y lo editamos:

Hemos usado dos acciones, Crop y Desature, con la primera definimos el área de tamaño al que se ajustará la imagen que carguemos y lo centramos en el mismo área; con la segunda eliminamos el color de las imágenes convirtiéndolas en escala de grises (el administrador decidirá qué imágenes quiere ubicar y tan solo tiene que borrar esta acción). El preset es un formato para la imagen que queremos mostrar y por esto las dimensiones son muy importantes, nuestro ancho de pantalla y alto del bloque: 960 x 120. El preset ajustará las imágenes, según las opciones con las que haya sido construido para respetar estas dimensiones.

Page 338: PFC Antonio Bernal Baena

338

Por ejemplo, en vez de usar Crop, que rellena dimensiones del área si la imagen es menor y recorta dimensiones para ajustar si se excede, podemos usar Resize que reajusta el tamaño de la imagen al área ignorando el ratio; entre otras opciones posibles. La opción de peso nos propone un orden para las acciones.

Page 339: PFC Antonio Bernal Baena

339

5.3.10.4.2. Creación de tipos de contenido Administrar > Gestión de contenido > Tipo de contenido > Añadir tipo de contenido: Crearemos el Tipo de Contenido Imagen portada:

Page 340: PFC Antonio Bernal Baena

340

5.3.10.4.3. Creación de campos Administrar > Gestión de contenido > Tipo de contenido > Edit Imagen portada: Creamos el campo Imagen:

Dejamos el alias automático de URL por defecto.

Page 341: PFC Antonio Bernal Baena

341

Con lo cual ya podemos dar de alta contenidos Tipo Imagen portada en Administración > Gestión de contenido > Contenido > Añadir Imagen portada:

Page 342: PFC Antonio Bernal Baena

342

5.3.10.4.4. Creación de vistas ImageCache se integra perfectamente con el módulo Views ya que nos permite listar imágenes asociadas a nodos en el preset que queramos, al añadir un campo de tipo imagen, tal y como hemos hecho al crear el tipo de contenido, podemos seleccionar uno de los presets ya existentes para mostrar la imagen con un determinado formato. Después gracias a la generación de un bloque lo mostraremos en pantalla. Administrar > Construcción del sitio > Views > Añadir: Creamos la vista imagenes_portada_aleatorias

Page 343: PFC Antonio Bernal Baena

343

Es aquí donde seleccionamos el preset creado previamente.

Page 344: PFC Antonio Bernal Baena

344

5.3.10.4.5. Visibilidad de bloques Administrar > Construcción del sitio > Bloques:

Mostramos el bloque y cuando se hayan cargado las cuatro imágenes que preparamos al inicio completaremos el diseño visual del sitio Web del Departamento.

Page 345: PFC Antonio Bernal Baena

345

5.3.10.4.6. Prototipos de pantalla

Page 346: PFC Antonio Bernal Baena

346

5.4. DISTRIBUCION DEL SITIO En la versión 5, Drupal agrega Perfiles de instalación (a veces confusamente llamados Perfiles de distribución) a su lista de características. Un perfil de la instalación básicamente no es más que una lista de módulos requeridos y una gran variedad de código de configuración. Una “distribución” de Drupal es uno o más perfiles de instalación que incluyen a Drupal por sí mismo y a todos los módulos necesarios. Vamos a hacer posible compartir nuestro sitio de Drupal, y vamos a hacerlo de la forma más rápida posible. El método tradicional de creación de perfiles de instalación consiste en escribir código para cada cambio efectuado en nuestro sitio, etc. Podemos ayudarnos de módulos como Install Profile API http://drupal.org/project/install_profile_api y Profile Generator http://drupal.org/project/profile_generator pero aún así es un duro esfuerzo. Sin embargo, hay una cosa que todos los tipos de CCK, Views, Bloques, etc. que componen nuestro sitio tienen en común: todos ellos están almacenados en la base de datos. Podemos utilizar este hecho como una gran ventaja y simplemente colocar un Drupal previamente preparado junto con un volcado consistente de la base de datos para obtener una distribución de nuestro sitio Drupal. Paso 1: Depuración de contenidos del sitio Paso 2: Volcado del Drupal del sitio a local Paso 3: Reemplazar settings.php y robots.txt Paso 4: Volcado consistente de la base de datos del sitio Paso 5: Compresión de carpetas

Page 347: PFC Antonio Bernal Baena

347

Paso 1: Depuración de contenidos del sitio

- Respetamos los Roles creados - Eliminamos los usuarios creados y renombramos al usuario

administrador como: Nombre de usuario: administrador E-Mail: [email protected] Contraseña: uhu

- Contenidos > Lista; respetamos los contenidos:

Imagen Portada Web Links Localización Ficha de personal: exclusivamente la del administrador

- Configuración del sitio > Información del sitio; introducimos una

información básica para su posterior edición una vez instalada la distribución

El resto de información del sistema permanece inalterada. Paso 2: Volcado del Drupal del sitio a local Accedemos por FTP y descargamos completo el directorio drupal, www/drupal, de nuestro sitio a local. Una vez obtenemos el volcado realizamos las siguientes operaciones:

- drupal/files: eliminamos contenido personalizado para nuestro sitio - drupal/files/pictures: eliminamos contenido personalizado - drupal/sites/all/themes: dejaremos exclusivamente el tema propio

de la Universidad de Huelva, framebasico Paso 3: Reemplazar settings.php y robots.txt

- drupal/sites/default: reemplazamos settings.php de nuestro sitio por un settings.php original de la última versión de Drupal, en este caso Drupal 5.19

- drupal: reemplazamos robots.txt de nuestro sitio que fue desactivado para impedir que nuestro sitio fuera encontrado durante su desarrollo en una búsqueda por un robots.txt original de la última versión de Drupal.

Page 348: PFC Antonio Bernal Baena

348

Paso 4: Volcado consistente de la base de datos del sitio Accedemos a cPanel apartado Base de Datos y con el phpMyAdmin llevamos a cabo las siguientes operaciones:

- Selección de la base de datos Drupal de nuestro sitio para prepararla de forma consistente antes de exportarla a local:

Seleccionamos tablas cache_ opción “Vaciar” Seleccionamos tabla sessions opción “Vaciar”

Seleccionamos toda aquella tabla que tenga residuos

con la opción “Reparar la tabla”

- Exportar > Seleccionar todo> Enviar (genera un archivo descargable)

- Ya en local renombramos el archivo de base de datos que hemos obtenido por bd.sql

Page 349: PFC Antonio Bernal Baena

349

Paso 5: distribución_departamento.rar Ya tenemos la distribución de nuestro sitio. Hacemos una compresión de carpetas que llamaremos distribución_departamento.rar compuesto de:

- Una carpeta “drupal” lista para añadirse por FTP a un nuevo sitio - Un archivo de bases de datos “bd.sql” preparado para importarse al

nuevo sitio

Con estos dos recursos podemos fácilmente distribuir el sistema de gestión de contenidos implementado para la Web de nuestro Departamento a cualquier otro Departamento de la Universidad de Huelva.

- readme.txt con la guía de la instalación para el nuevo sitio donde se desee implementar la distribución.

Recursos: http://www.lullabot.com

Page 350: PFC Antonio Bernal Baena

350

6. EVALUACION 6.1. GUIA DE EVALUACION HEURISTICA PARA LA VALIDACION DE LA USABILIDAD DEL SITIO Jakob Nielsen estudió 249 problemas de usabilidad y a partir de ellos diseñó lo que llamó las “reglas generales” para identificar los problemas de usabilidad. Los principios definidos por Nielsen son los siguientes:

• Visibilidad del estado del sistema: el sistema siempre debería mantener informados a los usuarios de lo que está ocurriendo, a través de retroalimentación apropiada dentro de un tiempo razonable.

• Relación entre el sistema y el mundo real: el sistema debería hablar el lenguaje de los usuarios mediante palabras, frases y conceptos que sean familiares al usuario, más que con términos relacionados con el sistema. Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.

• Control y libertad del usuario: hay ocasiones en que los usuarios elegirán las funciones del sistema por error y necesitarán una “salida de emergencia” claramente marcada para dejar el estado no deseado al que accedieron, sin tener que pasar por una serie de pasos. Se deben apoyar las funciones de deshacer y rehacer.

• Consistencia y estándares: los usuarios no deberían cuestionarse si acciones, situaciones o palabras diferentes significan en realidad la misma cosa; siga las convenciones establecidas.

• Prevención de errores: mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevenga la ocurrencia de problemas.

• Reconocimiento antes que recuerdo: se deben hacer visibles los objetos, acciones y opciones. El usuario no tendría que recordar la información que se le da en una parte del proceso, para seguir adelante. Las instrucciones para el uso del sistema deben estar a la vista o ser fácilmente recuperables cuando sea necesario.

• Flexibilidad y eficiencia de uso: la presencia de aceleradores, que no son vistos por los usuarios novatos, puede ofrecer una interacción más rápida a los usuarios expertos que la que el sistema puede proveer a los usuarios de todo tipo. Se debe permitir que los usuarios adapte el sistema para usos frecuentes.

Page 351: PFC Antonio Bernal Baena

351

• Estética y diseño minimalista: los diálogos no deben contener información que es irrelevante o poco usada. Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y disminuye su visibilidad relativa.

• Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores: los mensajes de error se deben entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución constructiva al mismo.

• Ayuda y documentación: incluso en los casos en que el sistema pueda ser usado sin documentación, podría ser necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de buscar, estar enfocada en las tareas del usuario, con una lista concreta de pasos a desarrollar y no ser demasiado extensa.

Basándonos en estos principios elaboramos una guía de criterios, estructurada en forma de checklist, para facilitar la práctica de la evaluación. Todos los puntos están formulados como preguntas en donde la respuesta afirmativa implica que no existe un problema de usabilidad, y la negativa que sí.

Page 352: PFC Antonio Bernal Baena

352

6.1.1. Checklist del sitio Web

Aspectos generales

• ¿Los contenidos y servicios que ofrece se corresponden con los objetivos del sitio Web? Sí

• ¿Muestra de forma precisa y completa qué contenidos o servicios ofrece realmente el sitio Web? Sí

• ¿La estructura general del sitio Web está orientada al usuario? Sí • ¿El look & feel general se corresponde con los objetivos,

características, contenidos y servicios del sitio Web? Sí • ¿Es coherente el diseño general del sitio Web? Sí • ¿El sitio Web se actualiza periódicamente? ¿Indica cuándo se

actualiza? Sí

Las fechas que se muestren en la página deben corresponderse con actualizaciones, noticias, eventos... no con la fecha del sistema del usuario.

Branding

• ¿Muestra la página inicial la naturaleza del negocio y se identifica bien el logotipo o marca? Sí

• ¿Aparecen elementos de la marca o de la imagen corporativa en todas las páginas? Sí

• ¿Aparece la marca en un lugar importante dentro de la página? Sí • ¿Se proporciona mecanismos para poner en contacto con la

empresa? Sí

Navegación

• ¿Se mantiene una navegación consistente y coherente a lo largo del sitio? Sí

• ¿Es predecible la respuesta del sistema antes de hacer clic sobre el enlace? Sí

Esto está relacionado con el nivel de significación del rótulo del enlace.

• ¿Se ha controlado que no existan enlaces rotos? Sí • ¿Existen elementos de navegación que orienten al usuario acerca de

dónde está y cómo deshacer su navegación tales como breadcrumbs o enlaces a la página de inicio? Sí

Page 353: PFC Antonio Bernal Baena

353

Lay-Out de la Página

• ¿Se aprovechan las zonas de alta jerarquía informativa de la página para contenidos de mayor relevancia? Sí

Como por ejemplo la zona central.

• ¿Es una interfaz limpia, sin ruido visual? Sí • ¿Existen zonas en "blanco" entre los objetos informativos de la

página para poder descansar la vista? Sí

Búsqueda

• ¿Se encuentra fácilmente accesible? Sí

Es decir: directamente desde la home, y a ser posible desde todas las páginas del sitio, y colocado en la zona superior de la página.

• ¿Es fácilmente reconocible como tal? Sí

Ayuda

• ¿Se ofrece ayuda contextual en tareas complejas? Sí

Referente a los usuarios con acceso identificado al sistema y al administrador del sistema en particular: Todos los campos de los formularios de alta de contenidos, así como categorías y vistas presentan un texto explicativo de su significado. También se incorpora texto de ayuda para guiar al usuario cuando rellene un formulario de alta de un tipo de contenido.

Accesibilidad

• ¿Es compatible el sitio Web con los diferentes navegadores? Sí

Entre otros, la aplicación ha sido testeada tanto en IE como en Mozilla Firefox que son dos de los más utilizados por la audiencia.

• ¿Puede el usuario disfrutar de todos los contenidos del sitio Web sin necesidad de tener que descargar e instalar plugins adicionales? Sí

• ¿Se puede imprimir las páginas sin problemas? Sí

Feedback

• ¿Puede el usuario ponerse en contacto para hacer sugerencias o comentarios? Sí

Page 354: PFC Antonio Bernal Baena

354

7. CONCLUSIONES La metodología empleada para el desarrollo de este proyecto ha sido efectiva. El CMS Drupal ha respondido a las expectativas mostrándose como una herramienta potente y ágil durante la fase de implementación y ayudándonos ha alcanzar los objetivos propuestos. Consideremos por tanto que el sistema cumple con la misión y objetivos planteados por el Departamento. 7.1. MANTENIMIENTO Con una aplicación desarrollada con Drupal debemos tener en cuenta que el proceso de mejora continua, y el ritmo y modelo de desarrollo por módulos contribuidos, supone que en la vida del sitio Web tengamos que realizar cambios y trabajos de actualización controlados. Uno de los retos a los que se enfrenta todo administrador de Drupal es la gestión del cambio. En un sistema que funcione simplemente con el core de Drupal el proceso de actualización a la siguiente versión de Drupal es muy simple. Al añadir las funcionalidades de los módulos contribuidos debemos tener en cuenta que los módulos utilizados hayan sido previamente actualizados antes de efectuar un cambio de versión y dichas actualizaciones estén testeadas y contrastadas convenientemente por su uso en la comunidad Drupal.

Page 355: PFC Antonio Bernal Baena

355

7.2. EXTENSIONES Y MEJORAS Si bien el sistema cumple con los requerimientos efectuados, podemos mejorar la presencia del sitio Web frente a su audiencia mediante nuevas opciones o funcionalidades para el sistema. Recomendamos la siguiente ampliación que puede llevarse a cabo una vez el sistema esté instalado en cada Departamento: Publicar el mapa del sitio Web Para ello recomendamos el módulo contribuido XML Sitemap de Drupal, que puede descargarse desde http://drupal.org/project/xmlsitemap.

El módulo XML Sitemap nos sirve para generar un mapa de nuestro sitio Web y poder enviarlo a los principales buscadores. El mapa del sitio puede ser automáticamente enviado a Google y Yahoo! entre otros buscadores de Internet. Al enviárselo ayudaremos al buscador al rastreo de nuestra Web para una mejor indexación. Este módulo también puede añadir enlaces al mapa del sitio para contenidos, menús y perfiles de usuario. Por otra parte, proponemos algunos de los servicios que podría ser interesante añadir al sitio Web en posteriores versiones del producto: Formularios Adaptación de los formularios tipo usados por el departamento para solicitudes de permisos, etc. del profesorado, a un sistema digital, accesible solo por usuarios autorizados, en donde un profesor pueda escoger el tipo de formulario que necesita para el asunto que desea comunicar y una vez enviado dicho formulario a través de la intranet del departamento se distribuya a las personas adecuadas para su visto bueno o autorización electrónica. Firma digital Abundando en la propuesta anterior se podría implantar un sistema de autorización por firma digital de la solicitud efectuada a través de los formularios haciendo un control añadido del flujo de autorizaciones para cada tipo de solicitud. Foro Presentar un foro, restringido a usuarios autorizados, podría servir como herramienta de transmisión del conocimiento entre el alumnado del departamento y como espacio de debate académico.

Page 356: PFC Antonio Bernal Baena

356

8. BIBLIOGRAFIA

• Libros: Pro Drupal Development. John K. VanDyk y Matt Westgate, 2007. Drupal 5 Themes. Ric Shreves, 2007. The elements of user experience. Jesse James Garrett, 2003. No me hagas pensar. Steve Krug, 2006. Usabilidad. Prioridad en el diseño Web. JaKob Nielsen y Hoa Loranger, 2007. Desarrollo Web con Dreamweaver CS3, CSS, Ajax y PHP. David Powers, 2008. HTML, XHTML y CSS. Elizabeth Castro, 2007.

• Sitios Web: http://www.uhu.es Web oficial de la Universidad de Huelva. http://drupal.org Web oficial de Drupal. http://iainstitute.org/ Web oficial de The Information Architecture

Institute. http://www.usabilitynet.org/ Web oficial de UsabilityNet. Adicionalmente hemos accedido a la información de otros sitios Web que indicamos como Recursos a lo largo del desarrollo de la presente memoria.

Page 357: PFC Antonio Bernal Baena

357

9. ANEXOS 9.1. MANUAL DE INSTALACION 9.1.1. Introducción El presente manual le servirá como guía para efectuar la instalación de Drupal 5 usando cPanel. También le permitirá fácilmente implementar la distribución generada, del desarrollo Web llevado a cabo, en los distintos Departamentos de la Universidad de Huelva. En este caso no tiene porqué instalar previamente Drupal 5 puesto que ya está incluido en la distribución. Lo que sí necesitará es un sitio Web activo que cumpla los requisitos mínimos para una instalación bajo Drupal. Durante el desarrollo de los distintos apartados de la presente guía usaremos el sitio www.ejemplo.com/drupal como ejemplo tanto en el caso de que efectuáramos una instalación de Drupal 5 desde cero, bajo cPanel, como en el caso de que dispongamos del sitio Web y lo que deseemos sea implementar directamente la distribución para nuestro Departamento.

Page 358: PFC Antonio Bernal Baena

358

9.1.2. Requisitos del sistema Servidor Web Apache (recomendado) Drupal trabaja con Apache 1.3 ó Apache 2.x hospedado sobre UNIX/Linux, OS X, o Windows. La mayor parte de los desarrollos de Drupal ha sido hecha bajo Apache, por tanto existe un mayor grado de experiencia con Apache que con otros servidores Web como podría ser Microsoft IIS. PHP Recomendado: PHP 5.2.x Requerido: PHP versión 4.3.5 o superiores Servidor de Bases de Datos Recomendado: MySQL 4.1 o MySQL 5.0 Navegadores Adjuntamos una lista de navegadores que trabajan correctamente con Drupal:

• Internet Explorer 6.x y posteriores • Firefox 2.x y posteriores • Opera 7 y posteriores • Safari 1.x y posteriores • Camino 1.x y posteriores

El sitio Web departamental desarrollado ha sido chequeado tanto con Internet Explorer versión 8 como con Firefox versión 3.0.13, siendo satisfactorio el resultado.

Page 359: PFC Antonio Bernal Baena

359

9.1.3. Instalación de Drupal 5 usando cPanel Muchos proveedores de alojamiento utilizan un panel de control para proteger a los usuarios de la complejidad de sus servidores. cPanel es uno de estos paneles de control. Desestimamos la utilidad Fantastico puesto que haremos uso extensivo del archivo update.php para la actualización de la base de datos con la Distribución así como los upgrades a nuevas versiones del core o de módulos contribuidos, y procedemos a efectuar la instalación de Drupal 5 en una cuenta perteneciente a nuestro dominio, por ejemplo: www.ejemplo.com/drupal Paso 1: Instalación desde cPanel Paso 2: Descarga de la última versión de Drupal 5 e instalación en el sitio Paso 3: Primera cuenta de Drupal

Page 360: PFC Antonio Bernal Baena

360

Paso 1: Instalación desde cPanel Necesitamos una cuenta de FTP para subir el paquete de archivos. Dicha cuenta nos la facilitará nuestro proveedor de hosting. Podemos usar el paquete FileZilla. Accedemos a cPanel con nuestros datos de usuario y contraseña facilitados por el proveedor de hosting:

Page 361: PFC Antonio Bernal Baena

361

Una vez en cPanel crearemos la base de datos desde el menú Base de Datos > Asistente de bases de datos MySQL:

Page 362: PFC Antonio Bernal Baena

362

Posteriormente nos pedirá asignar permisos del usuario creado a la base de datos, seleccionamos “All privileges” y guardamos los cambios completando el paso 4:

Estos datos nos serán solicitados durante el proceso de instalación de Drupal. Ya tenemos preparada la base de datos para Drupal.

Page 363: PFC Antonio Bernal Baena

363

Paso 2: Descarga de la última versión de Drupal 5 e instalación en el sitio

- Descargamos la última versión de Drupal 5 desde el sitio http://drupal.org, actualmente la versión 5.19

- Lo descomprimimos y abrimos el cliente FTP para subir los ficheros. - Creamos un subdirectorio /drupal dentro de la carpeta www del

directorio raíz para no interferir con otros archivos de instalaciones propias.

- Subimos todos los archivos contenidos dentro del archivo descomprimido drupal-5.19

- El fichero robots.txt indica a los bots de los buscadores que pueden entrar en la Web para explorar y cómo, si queremos evitarlo durante el periodo de desarrollo e implementación del sistema editamos este fichero añadiendo la segunda línea:

User-agent: * Disallow: /

- También debemos crear un nuevo directorio desde la raíz del sitio www/drupal llamado “files”: www/drupal/files.

Una vez completada la operación realizamos los siguientes ajustes en la carpeta drupal:

- drupal/files: asignamos permisos de escritura 777 - drupal/sites/default: asignamos permisos 777 de escritura al archivo

settings.php

Introducimos la dirección de nuestro sitio Web en el navegador y Drupal nos requerirá la información de configuración de la base de datos que vamos a utilizar:

- Database name - Database username - Database password

A partir de ahora ya podemos acceder a nuestro sitio Web para crear la primera cuenta de Drupal. También debemos cambiar los permisos del archivo settings.php con el valor numérico 544 para dejarlo protegido.

Page 364: PFC Antonio Bernal Baena

364

Paso 3: Primera cuenta de usuario de Drupal Una vez creado el sitio debemos seleccionar create the first account > Create new account para crear la cuenta del primer usuario, que será el “súper usuario” con todos los permisos de administrador concedidos por el sistema de forma automática. Posteriormente tendremos la opción de cambiar la contraseña de la cuenta que Drupal nos ha generado. Antes de dar por finalizada la instalación debemos ir a Administer > User Management > User Settings > Public Registrations: > Only site administrators can create new user accounts > Save Configuration Así evitamos que alguien más pueda crear una cuenta desde el exterior del sistema. Hemos finalizado la instalación de Drupal en nuestro sitio de ejemplo.

A partir de ahora comenzaría el proceso de configuración y creación de contenidos del sitio. Esto no será necesario usando la Distribución que hemos preparado.

Page 365: PFC Antonio Bernal Baena

365

9.1.4. Instalación de la distribución Para la instalación de la Distribución partimos del supuesto de que tenemos un sitio, por ejemplo www.ejemplo.com/drupal con una base de datos ya preparada con cPanel. No necesitamos hacer una previa instalación de Drupal, éste ya está incluido en el paquete de la Distribución. Cuatro sencillos pasos: Paso 1: Descomprimir el archivo distribución_departamento.rar Paso 2: Importar el archivo bd.sql Paso 3: Instalación de la carpeta drupal en www/drupal Paso 4: Acceso al sitio

Page 366: PFC Antonio Bernal Baena

366

Paso 1: Descomprimir el archivo distribución_departamento.rar Obtenemos:

- Una carpeta “drupal” lista para añadirse por FTP a un nuevo sitio - Un archivo de bases de datos “bd.sql” preparado para importarse al

nuevo sitio

Con estos dos recursos podemos fácilmente distribuir el sistema de gestión de contenidos implementado para la Web de nuestro Departamento a cualquier otro Departamento de la Universidad de Huelva.

- readme.txt con la guía de la instalación para el nuevo sitio donde se desee implementar la distribución.

Paso 2: Importar el archivo bd.sql Accedemos a cPanel apartado Base de Datos y con phpMyAdmin llevamos a cabo las siguientes operaciones:

- Selección de la base de datos Drupal de nuestro sitio. - Importar > Examinar: introducimos la dirección de nuestro archivo

en local bd.sql - Continuar

Page 367: PFC Antonio Bernal Baena

367

- Debemos obtener un mensaje como éste indicando que la operación

se ha efectuado correctamente:

Page 368: PFC Antonio Bernal Baena

368

Paso 3: Instalación de la carpeta drupal en www/drupal Accedemos por FTP y subimos a www/ el drupal que hemos preparado. Una vez completada la operación realizamos los siguientes ajustes en la carpeta drupal:

- drupal/files: asignamos permisos de escritura 777 - drupal/files/pictures: asignamos permisos de escritura 777 - drupal/files/imagecache: asignamos permisos de escritura 777 - drupal/sites/default: asignamos permisos 777 de escritura al archivo

settings.php Paso 4: Acceso al sitio Introducimos la dirección de nuestro sitio Web en el navegador y Drupal nos requerirá la información de configuración de la base de datos que vamos a utilizar: www.ejemplo.com/drupal

Page 369: PFC Antonio Bernal Baena

369

Una vez introducidos obtenemos la siguiente pantalla:

Si pulsamos el vínculo recibiremos el siguiente mensaje alertándonos de que aún no nos hemos autentificado como administradores del sitio Web:

Por tanto demos acceder con el administrador prefijado por la Distribución, y cuando hayamos completado el proceso de instalación podremos editar sus datos a conveniencia:

Nombre de usuario: administrador Contraseña: uhu

Page 370: PFC Antonio Bernal Baena

370

Introducimos en nuestro navegador el siguiente link, con la instrucción update.php: www.ejemplo.com/drupal/update.php

Pulsamos en el link “run the database upgrade script”, y a continuación “Update”:

Finalmente hemos completado la actualización de la base de datos y nos dirigimos a las páginas de administración de nuestro sitio Web en Drupal:

Page 371: PFC Antonio Bernal Baena

371

Con el siguiente resultado:

Revisamos el informe de estado en Registro > Informe de estado:

Debemos acceder por FTP a drupal y modificar los permisos del archivo settings.php con el valor 544. También lo hubiéramos podido hacer antes de acceder como administradores para ejecutar update.php.

Page 372: PFC Antonio Bernal Baena

372

Si volvemos a Registro > Informe de estado:

A partir de este momento ya podemos gestionar los contenidos de nuestro nuevo sitio Web puesto que la instalación ha finalizado satisfactoriamente.

Page 373: PFC Antonio Bernal Baena

373

9.1.5. Actualización de la versión de Drupal La instalación de Drupal activará un aviso para informarnos de que una nueva versión del Drupal que tenemos instalado ha sido lanzada por la comunidad Drupal. No es necesario desactivar nada en la actual instalación, incluyendo a los módulos contribuidos que estamos usando. Seguimos los siguientes pasos: Paso 1: Descarga de la nueva versión de Drupal Paso 2: Back up de www/drupal a local Paso 3: Ajustes previos en local de la nueva versión Paso 4: Instalación de la carpeta drupal en www/drupal Paso 5: Acceso al sitio

Page 374: PFC Antonio Bernal Baena

374

Paso 1: Descarga de la nueva versión de Drupal Descargamos la nueva versión de Drupal 5 desde el sitio http://drupal.org Paso 2: Back up de www/drupal a local Accedemos por FTP y descargamos la actual instalación www/drupal a local y después eliminamos drupal del directorio www/ Paso 3: Ajustes previos en local de la nueva versión Vamos a preparar en nuestro disco duro la nueva versión de Drupal antes de subirla al directorio www/ de nuestro servidor. Preparamos una nueva carpeta llamada drupal para la nueva versión y aprovechando el back up efectuado de la versión antigua de nuestro sitio introducimos:

- Contenido de la carpeta con la última versión de drupal - Carpeta files de la instalación antigua - Archivo robots.txt de la instalación antigua reemplazando el de la

última versión de drupal - Archivo sites/default/settings.php de la instalación antigua

reemplazando el de la última versión de drupal - Dentro de sites/all ubicamos el directorio modules (módulos

contribuidos) y el directorio themes (temas contribuidos) de la antigua instalación de drupal, la de nuestro sitio

- Carpeta sites/all/modules/jquery_update/misc/jquery.js de la instalación original de nuestro sitio copiamos jquery.js en el directorio misc/jquery.js de la nueva versión de drupal sobrescribiendo el archivo existente de dicha versión

Paso 4: Instalación de la carpeta drupal en www/drupal Accedemos por FTP y subimos a www/drupal la nueva versión que hemos preparado previamente. Una vez completada la operación realizamos los siguientes ajustes en la carpeta drupal:

- drupal/files: asignamos permisos de escritura 777 - drupal/files/pictures: asignamos permisos de escritura 777 - drupal/files/imagecache: asignamos permisos de escritura 777

Page 375: PFC Antonio Bernal Baena

375

Paso 5: Acceso al sitio Introducimos la dirección de nuestro sitio Web en el navegador y accedemos como administradores Introducimos en nuestro navegador el siguiente link, con la instrucción update.php: www.ejemplo.com/drupal/update.php Pulsamos en el link “run the database upgrade script”, y a continuación “Update”. Finalmente hemos completado la actualización de la base de datos y nos dirigimos a las páginas de administración de nuestro sitio Web en Drupal. Si volvemos a Registro > Informe de estado debemos comprobar que todas las verificaciones están correctas y la nueva versión se ve reflejada como instalada.

Page 376: PFC Antonio Bernal Baena

376

9.1.6. Actualización de la versión de las extensiones La instalación de Drupal activará un aviso para informarnos de que una nueva versión de alguno de los módulos contribuidos que tenemos instalado ha sido lanzada por la comunidad Drupal.

Este sería un ejemplo de mensaje, si pulsamos en “disponibilidad de actualizaciones” vemos que Drupal nos está indicando que hay una nueva versión del módulo contribuido “Bibliography Module”.

Page 377: PFC Antonio Bernal Baena

377

El proceso no afecta a los módulos activados ni a la configuración de los mismos. Seguimos los siguientes pasos: Paso 1: Descarga de la nueva versión del módulo Paso 2: Acceso por FTP para eliminar la actual versión del módulo Paso 3: Acceso al sitio Paso 4: Traducción del módulo

Page 378: PFC Antonio Bernal Baena

378

Paso 1: Descarga de la nueva versión del módulo Directamente en el link que nos indica el sistema o en http://drupal.org Paso 2: Acceso por FTP para eliminar la actual versión del módulo Accedemos por FTP para eliminar directamente la actual versión del módulo contribuido de nuestro sitio Web en www/drupal/ sites/all/modules y reemplazarlo por la nueva versión previamente descomprimida en local. En módulos con herramientas externas adicionales, como Print, no debemos olvidar incluir la herramienta por ejemplo en este caso TCPDF. Paso 3: Acceso al sitio Accedemos a nuestro sitio y ejecutamos update.php para actualizar la base de datos de nuestro drupal Paso 4: Traducción del módulo Si la carpeta del módulo contiene fichero “es.po” dentro de la carpeta “po” debemos traducir al español las cadenas que permita dicho fichero en Configuración del sitio > Localización > Gestionar idiomas > Importar

Subimos el fichero correspondiente al módulo actualizado. Hemos finalizado la actualización del módulo.

Page 379: PFC Antonio Bernal Baena

379

9.1.7. Rendimiento de la instalación Opcionalmente podemos activar la caché de páginas para aumentar el rendimiento del sitio Web. Los pasos a seguir una vez habiendo accedido a la Web son: > Administrar > Configuración del sitio > Rendimiento

Marcar como Normal la opción Modo de caché.

Page 380: PFC Antonio Bernal Baena

380

9.2. MANUAL DEL USUARIO 9.2.1. Introducción El presente manual le servirá como guía para gestionar los contenidos del sitio Web del Departamento de Tecnologías de la Información de la Universidad de Huelva. Cada usuario tendrá uno o varios roles asignados por el Administrador del sistema, dependiendo de dicha asignación podrá tener acceso a la creación o edición y borrado de una serie de contenidos. Le mostraremos cómo podrá acceder a cada uno de los formularios de contenido para crearlo o editar un elemento que se ha dado de alta previamente.

Page 381: PFC Antonio Bernal Baena

381

9.2.2. Usuario administrador El usuario administrador es el primer usuario del sistema y tiene todos los permisos de acceso a la administración del mismo. Este usuario podrá nombrar a otros usuarios como administradores del sistema mediante la asignación del rol “administradores” adicionalmente al que ya ocupen. El administrador del sistema debiera seguir este orden en la introducción de contenidos cuando inicialice el nuevo sitio Web:

• Alta de usuarios y asignación de roles. • Alta de contenidos Ficha de personal. • Alta de contenidos Titulación. • Alta de contenidos Asignatura. • Alta de contenidos Grupo de investigación.

Posteriormente, si así lo requiere, podrá gestionar contenidos como:

• Imagen portada. • Página estática.

El resto de contenidos relacionados a continuación podrá darlos de alta bien el administrador u otros usuarios del sistema autorizados, no obstante los contenidos de edición propia marcados en negrita, deben ser creados por los mismos profesores que van a editarlos, si quieren poder acceder posteriormente a dicha edición:

• Contenidos tipo Noticias. • Contenidos tipo Proyecto FC/FM. • Contenidos tipo Seminario. • Contenidos tipo Comisión Permanente. • Contenidos tipo Consejo de Departamento. • Contenidos tipo Publicaciones. • Contenidos tipo Destacados. • Contenidos tipo Web Links.

Page 382: PFC Antonio Bernal Baena

382

9.2.3. Definición de formularios Definición de formularios de los tipos de contenido creados.

• Ficha de personal: Formulario de alta y edición de la información académica de los distintos usuarios que componen el departamento.

• Titulación: Formulario de alta y edición de los estudios impartidos por el Departamento en la UHU.

• Asignatura: Formulario de alta y edición de las asignaturas del Departamento.

• Grupo de investigación: Formulario de alta y edición de los grupos de investigación compuestos por profesores del Departamento.

• Imagen portada: Formulario de alta y edición de imágenes que podrán aparecer en la portada de forma aleatoria.

• Página estática: Formulario para crear una página de información estática a la que pueden añadirse subpáginas para crear una estructura jerárquica de contenido. Se ha implementado para construir el apartado Localización y normalmente no tendrá uso.

• Noticias: Formulario de alta y edición de noticias del Departamento. Pueden estar asignadas a una asignatura en concreto o informar de temas generales.

• Proyecto FC/FM: Formulario de alta y edición de los Proyectos final de carrera o final de máster que oferte el Departamento.

• Seminario: Formulario de alta y edición de la información relacionada con Seminarios.

• Comisión Permanente: Formulario de alta y edición de Comisión Permanente.

• Consejo de Departamento: Formulario de alta y edición de Consejo de Departamento.

• Publicaciones: Formulario de alta y edición de los distintos contenidos bibliográficos que genere o recomiende el Departamento.

• Destacados: Formulario de alta y edición de noticias o comunicaciones destacadas que por su relevancia formarán parte de la página principal del Departamento.

• Web Links: Formulario para generar enlaces a las páginas favoritas del Departamento.

Page 383: PFC Antonio Bernal Baena

383

9.2.4. Permisos de los usuarios del sistema

Tipo de Contenido

Permisos asignados en base al sistema de roles

Alta

Edición Edición propio

Ficha de personal profesores

director secretario

Asignatura profesores

director secretario

Grupo de investigación profesores

director secretario

Noticias profesores director secretario

profesores director secretario

Proyecto FC/FM profesores director secretario

profesores director secretario

Seminario profesores director secretario

profesores director secretario

Comisión Permanente

secretario secretario

Consejo de Departamento

secretario secretario

Publicaciones profesores director secretario

profesores director secretario

Destacados

director secretario

director secretario

Web Links profesores director secretario

profesores director secretario

Page 384: PFC Antonio Bernal Baena

384

Consideraciones Generales:

Todos los usuarios identificados, independientemente del rol que desempeñen, podrán editar su ficha de usuario para cambiar su dirección de correo electrónico y su clave de acceso.

Los roles:

• pas • estudiantes (consejo) • becarios

No tienen asignados permisos de gestión de contenidos en el sistema. Será decisión del administrador del sistema la asignación de cualquiera de ellos.

Los contenidos:

• Titulación. • Imagen portada. • Página estática.

Solo pueden ser gestionados por el administrador del sistema.

Existe una utilidad del sistema, consistente en la subscripción a la información por correo electrónico de las distintas convocatorias que efectúe el Secretario del Departamento a Consejos de Departamento y Comisiones Permanentes a la cual pueden acceder todos los usuarios identificados en el sistema.

Page 385: PFC Antonio Bernal Baena

385

9.2.5. Roles activos Roles propios del sistema:

• anonymous user: audiencia de la Web • authenticated user: usuario genérico identificado

Roles implementados:

• profesores • director: debe añadírsele rol profesores • secretario: debe añadírsele rol profesores • pas • estudiantes (consejo) • becarios • administradores: añadir este rol a los roles que tenga cualquier

usuario del sistema para convertirlo en administrador del sistema

Page 386: PFC Antonio Bernal Baena

386

9.2.6. Alta y edición de usuarios El alta de usuarios es un permiso del Administrador. Posteriormente todos los autorizados podrán acceder a editar sus datos de Usuario. > Desde la página principal del sitio Web: Acceso identificado

Page 387: PFC Antonio Bernal Baena

387

Iniciar sesión Administrar > Gestión de usuarios > Usuarios > Añadir

usuario:

Marcamos los Roles que desempeñará el usuario en el sistema (el rol director y el rol secretario deben incorporar el rol profesores).

Crear cuenta nueva

Page 388: PFC Antonio Bernal Baena

388

Administrar > Gestión de usuarios > Usuarios > Lista Escogemos el usuario que hemos creado y seleccionamos

editar

Procedemos a la edición de las opciones introducidas durante el alta.

Enviar Administrar > Logout

Page 389: PFC Antonio Bernal Baena

389

Podemos dar de baja a una lista de usuarios desde Administrar > Gestión de usuarios > Usuarios > Lista, marcándolos y escogiendo la opción Eliminar los usuarios seleccionados, a continuación, Actualizar:

Page 390: PFC Antonio Bernal Baena

390

9.2.7. Gestión de contenidos 9.2.7.1. Alta de administrador 9.2.7.1.1. Ficha de personal

Acceso identificado Administrar > Gestión de usuarios > Usuarios > Lista Escogemos el usuario que hemos creado y seleccionamos

editar Opción Ficha de personal Rellenamos los campos:

Nombre Perfil Área Órganos de Gobierno Foto usuario Teléfono Despacho Web Horario de tutoría

Enviar Logout.

El contenido Ficha de personal siempre debe rellenarse desde la Gestión de usuarios para que el sistema asigne el permiso de edición de la misma al propio usuario dado de alta.

Page 391: PFC Antonio Bernal Baena

391

9.2.7.1.2. Suscripciones Suscripción de los usuarios del sistema a las convocatorias del departamento.

Acceso identificado Administrar > Gestión de usuarios > Usuarios > Lista Escogemos el usuario que hemos creado y seleccionamos

editar Opción Notificaciones Opción Content type Marcamos el tipo de suscripción

Guardar Logout.

9.2.7.1.3. Otros contenidos del sistema

Acceso identificado Administrar > Gestión de contenido > Contenido Escogemos el Tipo de Contenido que deseamos añadir y

rellenamos sus campos Enviar Logout.

Page 392: PFC Antonio Bernal Baena

392

9.2.7.2. Edición de administrador 9.2.7.2.1. Ficha de personal

Acceso identificado Administrar > Gestión de usuarios > Usuarios > Lista Escogemos el usuario que hemos creado y seleccionamos

editar Opción Ficha de personal Editamos los campos que deseemos modificar Enviar o Borrar si deseamos eliminar la ficha Logout.

9.2.7.2.2. Otros contenidos del sistema

Acceso identificado Administrar > Gestión de contenido > Contenido > Lista Escogemos el contenido que deseamos editar y la operación

editar para acceder a la modificación de sus campos Enviar Logout.

Page 393: PFC Antonio Bernal Baena

393

9.2.7.3. Alta de contenidos por otros roles

Acceso identificado Administrar > Crear contenido: escogemos el contenido que

deseamos añadir. Según el nivel de autorización de cada rol tendremos acceso a crear unos u otros contenidos

Rellenamos los campos del Formulario Enviar Cerrar sesión.

Page 394: PFC Antonio Bernal Baena

394

9.2.7.4. Edición de contenidos por otros roles 9.2.7.4.1. Ficha de personal

Acceso identificado Debajo del título “Ficha de personal” escogemos la opción

Vista Opción Editar Modificamos el contenido de los campos del Formulario Enviar Cerrar sesión.

9.2.7.4.2. Datos del usuario

Acceso identificado Escogemos la pestaña Editar Editamos los campos que deseemos modificar Enviar Cerrar sesión.

9.2.7.4.3. Suscripciones

Acceso identificado Escogemos la pestaña Notificaciones > Content type Marcamos el tipo de suscripción Guardar Cerrar sesión.

Page 395: PFC Antonio Bernal Baena

395

9.2.7.4.4. Procedimiento general Procedimiento general de edición de contenidos para los roles no administradores.

Acceso identificado El contenido que buscamos está incorporado a los elementos

que se presentan a la audiencia, es decir, forma parte del sistema de menús del Web, por tanto debemos acceder al apartado apropiado donde se encuentra alojado dicho contenido. Por ejemplo, editar una asignatura propia:

Menú Docencia Elemento de menú Asignaturas Seleccionamos nuestra asignatura Obtenemos la ficha de nuestra asignatura que

dispondrá de una pestaña llamada Editar en donde accederemos a su contenido para modificarlo.

Este procedimiento es el que hay que seguir para editar cualquier contenido creado anteriormente desde Administrar > Crear contenido

Modificamos el contenido de los campos del Formulario Enviar Cerrar sesión.

Page 396: PFC Antonio Bernal Baena

396

9.2.8. Formulario de ficha de personal

Page 397: PFC Antonio Bernal Baena

397

9.2.9. Formulario de titulación

Page 398: PFC Antonio Bernal Baena

398

9.2.10. Formulario de asignatura

Page 399: PFC Antonio Bernal Baena

399

9.2.11. Formulario de noticias

Page 400: PFC Antonio Bernal Baena

400

9.2.12. Formulario de proyecto FC/FM

Page 401: PFC Antonio Bernal Baena

401

9.2.13. Formulario de grupo de investigación

Page 402: PFC Antonio Bernal Baena

402

9.2.14. Formulario de seminario

Page 403: PFC Antonio Bernal Baena

403

9.2.15. Formulario de comisión permanente

Page 404: PFC Antonio Bernal Baena

404

9.2.16. Formulario de consejo de departamento

Page 405: PFC Antonio Bernal Baena

405

9.2.17. Formulario de publicaciones

Page 406: PFC Antonio Bernal Baena

406

9.2.18. Formulario de destacados

Page 407: PFC Antonio Bernal Baena

407

9.2.19. Formulario de Web links

Page 408: PFC Antonio Bernal Baena

408

9.2.20. Formulario de imagen portada

Page 409: PFC Antonio Bernal Baena

409

9.2.21. Personalización del departamento En caso de haber instalado la Distribución, el usuario Administrador puede proceder a personalizar los datos del Departamento. A continuación indicamos los pasos a seguir en cada apartado. 9.2.21.1. Identificación del departamento

Acceso al sitio Administrar > Configuración del sitio > Información del sitio:

Personalizamos los campos referentes al nuevo Departamento Guardar la configuración.

Page 410: PFC Antonio Bernal Baena

410

9.2.21.2. Formulario de página estática Edición del contenido Localización.

Acceso al sitio Pulsamos en “Localización”

Seleccionamos la pestaña Editar Accedemos al formulario de edición del contenido para poder

personalizar, con texto y código HTML de Google Maps, el campo Cuerpo del contenido

Enviar.

Page 411: PFC Antonio Bernal Baena

411

9.2.21.3. Formulario de contacto

Acceso al sitio Administrar > Formulario de contacto > Lista > editar Personalizamos el campo Destinatarios con la dirección de

mail que deseemos Enviar Administrar > Formulario de contacto > Opciones generales Personalizamos el campo Información adicional con los datos

que deseemos Guardar la configuración.

9.2.21.4. Modificar categorías

Acceso al sitio Administrar > Gestión de contenido > Categorías > Lista:

Desde aquí podemos editar cualquier categoría y sus términos, no obstante recomendamos personalizar:

Área: dependiendo de las áreas del departamento en cuestión lista de términos editar cada término Modificar el Nombre del término o Borrar Enviar.

Año Académico: para los sucesivos años. añadir términos Nombre del término Enviar