Diseño e implementación de un portal web de rutas de senderismo

Valencia, 2 de Noviembre de 2010 Diseño e implementación de un portal web de rutas de senderismo Autora: Marta Gómez Gimeno Director: Sergio Saez Barona Departamento: DISCA Titulación: Ingeniería Técnica en Informática de Gestión Índice de contenidos 1. Información inicial................................................................................................03 1.1. Motivaciones..............................................................................................04 1.2. Planteamiento técnico..................................................................................04 2. Especificación de requisitos..................................................................................05 2.1. Introducción...............................................................................................05 2.1.1. Propósito.......................................................................................05 2.1.2. Ámbito..........................................................................................05 2.1.3. Definiciones, acrónimos y abreviaturas..............................................06 2.1.4. Referencias....................................................................................08 2.1.5. Visión general................................................................................08 2.2. Descripción general.....................................................................................09 2.2.1. Perspectiva del producto..................................................................09 2.2.2. Funciones del producto....................................................................09 2.2.3. Características del usuario...............................................................10 2.2.4. Restricciones generales...................................................................10 2.3. Requisitos específicos..................................................................................11 2.3.1. Requisitos funcionales.....................................................................11 2.3.1.1. Usuario anónimo................................................................11 2.3.1.2. Usuario.............................................................................11 2.3.1.3. Moderador.........................................................................12 2.3.1.4. Administrador....................................................................12 2.3.2. Requerimientos de interfaces externos..............................................13 2.3.2.1. Interfaz de usuario.............................................................13 2.3.2.2. Interfaces hardware...........................................................13 2.3.2.3. Interfaces software.............................................................13 2.3.2.4. Interfaces de comunicaciones..............................................13 2.3.3. Requisitos de eficiencia....................................................................13 2.3.4. Obligaciones de diseño....................................................................13 2.3.4.1. Estándares cumplidos.........................................................13 2.3.4.2. Limitaciones hardware........................................................14 2.3.5. Atributos.......................................................................................14 2.3.5.1. Seguridad.........................................................................14 2.3.5.2. Facilidades de mantenimiento..............................................15 2.3.6. Otros requisitos..............................................................................15 2.3.6.1. Base de datos....................................................................15 3. Análisis.................................................................................................................16 3.1. Casos de uso..............................................................................................16 3.1.1. Casos de uso de los consejos...........................................................17 3.1.2. Casos de uso de las rutas................................................................18 3.1.3. Casos de uso de los grupos..............................................................19 3.1.4. Casos de uso de los eventos.............................................................20 3.1.5. Casos de uso de los comentarios......................................................21 3.1.6. Casos de uso de las valoraciones......................................................21 3.2. Diagramas de secuencia...............................................................................22 3.2.1. Alta de un consejo..........................................................................22 3.2.2. Edición de una ruta.........................................................................23 3.2.3. Borrado de un grupo.......................................................................24 3.2.4. Unirse a un grupo...........................................................................25 3.2.5. Cancelar la asistencia a un evento....................................................26 3.2.6. Revisar una ruta.............................................................................27 1 4. Diseño..................................................................................................................28 4.1. Nivel de presentación..................................................................................28 4.2. Nivel lógico................................................................................................38 4.3. Nivel de persistencia....................................................................................38 4.3.1. Diagrama de entidad-relación...........................................................39 4.3.2. Diseño lógico.................................................................................39 5. Implementación e integración..............................................................................42 5.1. Tecnologías................................................................................................42 5.2. Herramientas..............................................................................................43 5.3. Detalles de la implementación.......................................................................43 5.3.1. Perfiles de usuario..........................................................................43 5.3.2. Autentificación de usuarios...............................................................43 5.3.3. Aspectos generales.........................................................................44 5.4. Integración................................................................................................44 5.5. Diagramas de navegabilidad.........................................................................44 5.5.1. Usuario anónimo............................................................................44 5.5.2. Usuario.........................................................................................44 5.5.3. Moderador.....................................................................................48 5.5.4. Administrador.................................................................................50 6. Evaluación y pruebas............................................................................................53 6.1. Evaluación.................................................................................................53 6.2. Pruebas.....................................................................................................54 6.2.1. Validación XHTML y CSS..................................................................54 6.2.2. Comprobación de enlaces rotos........................................................56 6.2.3. Comprobación de la resolución.........................................................56 6.2.4. Pruebas de uso...............................................................................59 7. Conclusiones.........................................................................................................68 8. Bibliografía...........................................................................................................69 2 1. Información inicial El proyecto se ha desarrollado en la Universidad Politécnica de Valencia, más concretamente en el departamento DISCA y cuyo director del proyecto es Sergio Saez. El proyecto llamado “ Diseño e implementación de un portal web de rutas de senderismo ” constará de un sitio web donde los usuarios podrán obtener diversa información acerca del senderismo. Entre algunas de las funciones que se podrán realizar se contemplan la recopilación de consejos, rutas y grupos para poder practicar senderismo. Hay que tener en cuenta que se trata de una web participativa en la que los usuarios podrán aportar contenido y opiniones acerca de prácticamente toda la información que se recopile. El sitio web estará formado por cuatro tipos de usuarios claramente diferenciados. Por una parte tendremos toda la parte de consulta de datos, donde los usuarios podrán acceder libremente y consultar las distintas secciones que disponga el sitio como son mostrar las últimas novedades publicadas en la web. Así mismo, se reunirá a modo informativo una serie de consejos para todos aquellos que quieran iniciarse en el senderismo. También contará con un buscador de rutas para localizar las rutas que les interesen a los usuarios y poder visualizar toda la información relacionada con ellas (comentarios, imágenes, datos técnicos...). El segundo tipo de usuarios, los usuarios registrados podrán, además de realizar las mismas acciones anteriormente mencionadas, crear nuevas rutas o consejos, subir fotos relacionadas con la ruta o el consejo, puntuar y comentar las rutas o consejos disponibles en el sitio web. Además de poder unirse o crear un grupo de senderismo para poder hacer salidas en grupo. En tercer lugar, los moderadores solo podrán llevar la revisión total de las rutas o consejos. En el caso de los grupos, únicamente podrán modificar los datos del grupo dejando la opción de borrado del mismo para el grupo de administradores. Finalmente, el último apartado contemplará a los administradores. Estos además de poder realizar todas las acciones anteriormente mencionadas serán los encargados de gestionar todo el sitio web para su correcto funcionamiento. Deberán revisar tanto las rutas como las fotos subidas por los usuarios con el fin de comprobar que son correctas. Además deberán corregir errores en las rutas, si los hubiera. Revisar los comentarios introducidos evitando lenguaje inapropiado u ofensivo. 3 A lo largo del documento se presentarán todas aquellas funcionalidades de forma detallada. Para ello, se realizará una especificación de requisitos seguida de un análisis junto con el diseño que se aplicará al sitio web. Sin olvidarnos de como se ha llevado a cabo la implementación y las pruebas necesarias para cerciorarse de que la aplicación funciona como realmente se esperaba. Por último, se aportan unas conclusiones y una bibliografia utilizada para poder desarrollar todo el sitio web. 1.1. Motivaciones Mi principal motivación es la de poder aplicar aquellos conocimientos que he ido adquiriendo a través de la realización de prácticas en empresas y por cuenta ajena. Y de esta forma, poder llegar a ampliar dichos conocimientos con el fin de llegar a tener una visión más amplia de las posibilidades que php ofrece para las aplicaciones web. Otro de los motivos que me impulsaron a coger este proyecto y no otro tipo de aplicación web, es que el senderismo es una actividad que siempre me ha llamado la atención. Por lo tanto, gracias a la información que necesitara para la realización de este proyecto podría llegar a conocerlo un poco más. 1.2. Planteamiento técnico La aplicación tiene una serie de características pensadas: •Se ha intentado cuidar la imagen de la aplicación con una interfaz de usuario sencilla a la vez que eficiente. •La aplicación se ha realizado de forma que es portable, se puede ejecutar tanto en un servidor basado en Linux como en Windows. •Acceso por web, lo que permite poder acceder a la aplicación desde cualquier navegador web. En cuanto a la imagen de la aplicación se puede decir que se ha diseñado de forma cuidada con el fin de que resulte agradable al usuario. Esto tiene un motivo y es que a un usuario le atraen más las aplicaciones vistosas. Es por ello, que además de crear una aplicación completamente funcional, se ha creado de forma que sea vistosa y del agrado de los usuarios. En el desarrollo de la aplicación, se ha seguido el estándar XHTML 1.0 estricto y para la presentación se han usado hojas de estilos CSS. Se han seguido las normas del estándar W3C y he conseguido una aplicación que sigue completamente los estándares y que se visualiza a la perfección en los navegadores que implementan el estándar, como son los de la familia Mozilla. Otro dato a tener en cuenta es la sencillez de la aplicación. Se puede observar que existen multitud de aplicaciones tanto web como de escritorio que son muy potentes, pero el hecho de que su uso no sea simple reduce bastante el número de usuarios que finalmente las utilizan. Es por ello que se ha intentado que la aplicación sea muy intuitiva. En cuanto a la portabilidad, hay que mencionar que la aplicación se ha realizado para que funcione bajo cualquier plataforma. Como ya se ha mencionado antes, para la elaboración de la interfaz gráfica se han seguido los estándares del W3C, lo que permite que se visualice correctamente en cualquier navegador. Para la elaboración de la lógica de la aplicación también se han seguido los mismos pasos, para poder desarrollar una aplicación que se pueda ejecutar bajo cualquier sistema operativo. Tanto si el servidor web se ejecuta en Windows como en Linux o Unix, la aplicación funcionara correctamente. 4 2. Especificación de requisitos En lo sucesivo procederé a detallar la especificación de requisitos del propio sitio web. Para ello, definiré cuál es el propósito o los objetivos a los que deseo llegar, y recopilaré información necesaria para el posterior análisis. 2.1. Introducción 2.1.1. Propósito A través de este apartado, llevaremos a cabo la especificación de requisitos del proyecto “Diseño e implementación de un portal web de rutas de senderismo”. La especificación dará una visión que englobe los requisitos de la aplicación, haciéndonos más sencillo el análisis de las funcionalidades el proyecto, además de aportar de manera global un planteamiento del problema al que me enfrentaré. 2.1.2. Ámbito El proyecto “Diseño e implementación de un portal web de rutas de senderismo”, a partir de ahora lo llamaré web de senderismo, consiste en la realización de una aplicación que permita a todos sus usuarios obtener información acerca del senderismo de forma rápida y sencilla. Además, en el caso de que los usuarios desearan registrarse podrían optar a formar parte de un grupo de senderismo y así poder realizar eventos con los miembros del grupo. Por lo tanto, en dicha aplicación existirán distintos tipos de usuarios y con cada uno de ellos distintos servicios personalizados. A continuación detallaré dichos usuarios y servicios. Todos aquellos usuarios que visiten la web podrán acceder libremente a todas las secciones de las que disponga el sitio web. Dichos usuarios no podrán participar con comentarios y aportes para la web sin que hayan sido registrados e identificados. 5 El sitio web constará de cuatro apartados claramente diferenciados. Por una parte tendremos toda la parte de consulta de datos, donde los usuarios podrán acceder libremente y consultar las distintas secciones que disponga el sitio como son: •Mostrar las últimas novedades publicadas en la web, rutas, consejos, fotos… •Consejos para todos aquellos que quieran iniciarse en el senderismo. •Buscador de rutas para buscar las rutas que interesen y poder visualizar toda la información relacionada con ella, comentarios, imágenes, valoraciones... •Grupos de senderismo a los que el usuario, si estuviera registrado, se podría unir y participar en sus eventos. En el segundo apartado podrán acceder únicamente los usuarios que estén registrados en el sitio web. Estos usuarios podrán, además de realizar las mismas acciones anteriormente mencionadas, realizar lo siguiente: •Crear nuevas rutas. •Subir fotos relacionadas con la ruta. •Puntuar las rutas disponibles en el sitio web. •Comentar las rutas publicadas en el sitio web. En tercer lugar, los moderadores solo podrán llevar la revisión parcial de algunos contenidos de la web. Además de las acciones permitidas para los usuarios registrados. •Gestión total de las rutas o consejos. •Gestión parcial de los grupos, únicamente podrán modificar los datos del grupo dejando la opción de borrado del mismo para el grupo de administradores. Finalmente, en el último apartado contemplara a los administradores. Estos además de poder realizar todas las acciones anteriormente mencionadas serán los encargados de gestionar todo el sitio web para su correcto funcionamiento. Sus tareas serán las siguientes: •Revisar tanto las rutas como las fotos subidas por los usuarios con el fin de comprobar que son correctas. •Corregir errores en las rutas. •Ayudar a los usuarios que tengan dudas. •Comprobar los comentarios publicados por los usuarios. •Sancionar a los usuarios que no cumplan las normas. •Comprobar que la aplicación funcione correctamente. 2.1.3. Definiciones, acrónimos y abreviaturas •Notepad++: es un editor de texto y de código fuente libre con soporte para varios lenguajes de programación en Microsoft Windows. Se trata de un editor que permite el coloreado y envoltura de sintaxis. Además cuenta con autocompletado de código, soporte para buscar o reemplazar, resaltado de paréntesis e identación. •Photoshop: es una de las aplicaciones más utilizadas en el ámbito de diseño y edición de imágenes. Asimismo, también se utiliza para diseñar bocetos web, realizar retoques fotográficos... 6 •MySQLAdmin: se trata de un administrador de bases de datos que permite llevar a cabo toda la gestión de MySQL, permitiendo no solo realizar modificaciones sobre la base de datos sino también el poder tener de una forma rápida y sencilla los datos de la misma. Además, cuenta con una herramienta que nos permite visualizar el diagrama entidad-relación de la base de datos creada. A todo esto, se suma el hecho de poder exportar e importar en distintos formatos y de una forma rápida el contenido y estructura de nuestras bases de datos. •Firefox: se trata de un navegador libre. Sigue los estándares marcados por W3C y tiene numerables complementos que proporcionan una gran ayuda a los desarrolladores web. •XAMPP: es una forma fácil de instalar la distribución Apache que contiene MySQL, PHP y Perl. XAMPP es realmente simple de instalar y usar. Basta descargarlo, extraerlo y comienzar. •Open Office: es una suite ofimática libre (código abierto y distribución gratuita) que incluye herramientas como procesador de textos, hoja de cálculo, presentaciones, herramientas para el dibujo vectorial y base de datos. Además soporta numerosos formatos de archivo, incluyendo como predeterminado el formato estándar ISO/IEC OpenDocument (ODF), entre otros formatos comunes, así como también soporta más de 110 idiomas. •StarUML: es una herramienta para el modelado de software basado en los estándares UML (Unified Modeling Language) y MDA (Model Driven Arquitecture). •XHTML: acrónimo en inglés de eXtensible Hypertext Markup Language (lenguaje extensible marcado de hipertexto), es un lenguaje que está pensado para sustituir al HTML como estándar para las páginas web. Su objetivo es avanzar el proyecto del World Wide Web Consortium de lograr una web semántica, donde la información y la forma de representarla están claramente separadas. •CSS: más conocidas como hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos. Se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los estilos definen la forma de mostrar los elementos HTML y XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento. •W3C: es un consorcio internacional que produce recomendaciones para la World Wide Web. 7 •JavaScript: es un lenguaje de scripting basado en objetos sin tipo y liviano. Principalmente, se utiliza integrado en un navegador web permitiendo el desarrollo de interfaces de usuario mejoradas y páginas web dinámicas. JavaScript es un dialecto de EMACScript y se caracteriza por ser un lenguaje basado en prototipos, con entrada dinámica y con funciones de primera clase. JavaScript ha tenido influencia de múltiples lenguajes y se diseñó con una sintaxis similar al lenguaje de programación Java, aunque más fácil de utilizar para personas que no programan. Todos los navegadores modernos interpretan el código JavaScript integrado dentro de las páginas web. Para interactuar con una página web se provee al lenguaje JavaScript de una implementación del Document Object Model (DOM). •JQuery: es una biblioteca o framework de JavaScript que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la tecnología AJAX a páginas web. JQuery es software libre y de código abierto permitiendo su uso en proyectos libres y privativos. JQuery, al igual que otras bibliotecas, ofrece una serie de funcionalidades basadas en JavaScript que de otra manera requerirían de mucho más código, es decir, con las funciones propias de esta biblioteca se logran grandes resultados en menos tiempo y espacio. 2.1.4. Referencias Para la realización de la web de senderismo se han tenido en cuenta la información de los siguientes sitios web: •http://www.trotamontes.org/ •http://www.euro-senders.com/web_cas/index.htm •http://senderismorioja.blogspot.com/ •http://www.nuestrascaminatas.com/ •http://www.piedrasobrepiedra.com/ •http://www.pateatusmontes.com/ •http://www.haciendohuella.com/ •http://fclm.com/ •http://www.excursionesysenderismo.com/ •http://www.bttysenderismo.com/ •http://www.arawakviajes.com/home/home.htm •http://www.andarines.com/ Además, he consultado la siguiente documentación: •Memoria Proyecto Final de Carrera: Portal web de acceso a una casa de cultura. •IEEE Std 830-1998 2.1.5. Visión general A partir de este momento detallaré los conceptos que se van a desarrollar en la aplicación. Además de definir los objetivos que quiero alcanzar. El documento de ERS seguirá el estándar IEEE. 8 2.3.5.2. Facilidades de mantenimiento El mantenimiento de la aplicación se llevará a cabo por parte, tanto de los usuarios registrados como por los moderadores y administradores. Cada uno teniendo unas características diferentes. En caso de nueva funcionalidad o modificación de la base de datos sería necesaria la intervención de una persona cualificada, que seguramente sería externa a la aplicación. 2.3.6. Otros requisitos 2.3.6.1. Base de datos El sitio web contará con una base de datos MySQL, donde se almacenará toda la información dinámica de la aplicación. De esta forma la información siempre será accesible de forma rápida y sin necesidad de mantenimientos en el software, simplemente empleando los formularios que se detallan en la aplicación se podrá ampliar, modificar o incluso eliminar su contenido. Por lo tanto, las consultas a la base de datos las llevará a cabo el servidor web mediante PHP y las funciones que serán generadas para obtener los distintos datos que se necesitarán. 15 3. Análisis A continuación procederé a desarrollar el análisis de la aplicación. Para ello, definiré todas y cada una de las funcionalidades que deberá tener el proyecto. Más detalladamente, se mostrará todos y cada uno de los diagramas necesarios: casos de uso y diagramas de secuencia. 3.1. Casos de uso Para desarrollar la aplicación se va a utilizar la metodología UML. Por ello, comenzaremos por los casos de uso. De esta forma se puede entender de una forma más intuitiva las acciones que cada usuario va a poder realizar en el sitio web. Con el fin de tener una visión lo más legible posible se va a separar en distintos diagramas. 16 3.1.1. Casos de uso de los consejos Los consejos son accesibles para todos los usuarios de la web. Pero los únicos que podrán insertar nuevos, valorarlos o comentarlos serán aquellos usuarios registrados. Al editar y borrar hay que tener en cuenta que un usuario solo podrá hacerlo los consejos en los que figure como autor. Sin embargo, un moderador o administrador podrá editar y borrar cualquier consejo. 17 3.1.2. Casos de uso de las rutas Las rutas son accesibles para todos los usuarios de la web. Pero los únicos que podrán insertar nuevas, valorarlas o comentarlas serán aquellos usuarios registrados. Al editar y borrar hay que tener en cuenta que un usuario solo podrá hacerlo en las que figure como autor. Sin embargo, un moderador o administrador podrá editar y borrar cualquier ruta. 18 3.1.3. Casos de uso de los grupos Los grupos podrán visualizarse por todos los distintos usuarios del sitio web. En caso de que un usuario no pertenezca a un grupo, podrá crear uno en el que figurará como coordinador. Posteriormente podrá editar dicho grupo. Si por el contrario, el usuario no desea ser el coordinador de un grupo podrá unirse a uno que ya exista. Un vez inscrito en un grupo podrá darse de baja siempre que lo desee. 19 3.1.4. Casos de uso de los eventos Los usuarios anónimos únicamente podrán leer los eventos y ver las personas que asistirán. En cambio un usuario que sea el coordinador del grupo podrá crear, editar y borrar los eventos de su propio grupo. Además, todos los usuarios registrados del sitio web podrán asistir a los eventos del grupo al que estén subscritos. Asimismo, podrán cancelar la asistencia a dichos eventos. Por otro lado, tanto moderadores como administradores podrán crear, editar y borrar todos los eventos independientemente de si son o no los coordinadores del grupo. 20 3.1.5. Casos de uso de los comentarios Los comentarios podrán visualizarse por todos los usuarios, pero solo los registrados podrán insertar nuevos comentarios. En cuanto al borrado de comentarios solo los administradores podrán hacerlo. 3.1.6. Casos de uso de las valoraciones Las valoraciones se pueden visualizar por todos los usuarios del sitio web. Únicamente los usuarios registrados podrán valorar los consejos o rutas, teniendo en cuenta que sólo se permite una valoración por usuario. 21 3.2. Diagramas de secuencia Una vez realizados los casos de uso, desarrollaré los diagramas de secuencia. Estos diagramas explican mediante un sencillo gráfico la funcionalidad de la aplicación, de tal forma, que resulte esquemática y se pueda seguir un hilo de ejecución de forma rápida y sencilla. Desarrollaré algunos de los más importantes puesto que muchos son similares, como es el caso de la inserción, edición y borrado de los distintos elementos de la web. 3.2.1. Alta de un consejo Al dar de alta un consejo el usuario deberá acceder al apartado gestionar consejo. Se le mostrará una tabla con todos los consejos introducidos por dicho usuario, en el caso de tratarse de un usuario normal; por el contrario, si se trata de un moderador o administrador se mostrarán todos los consejos insertados en el sitio web. Justo debajo de esta tabla, se ubica un formulario para proceder a introducir los datos de un nuevo consejo. 22 3.2.2. Edición de una ruta Para poder editar una ruta el usuario deberá acceder al apartado gestionar ruta. Se le mostrará una tabla con todas las rutas introducidas por dicho usuario, en el caso de tratarse de un usuario normal; por el contrario, si se trata de un moderador o administrador se mostrarán todas las rutas insertadas en el sitio web. Una vez identificada la ruta que desee modificar, se pulsará en el enlace editar y se le mostrará un formulario con los datos actuales para proceder a introducir los cambios. 23 3.2.3. Borrado de un grupo Solo los administradores podrán eliminar grupos. Para ello, deberán acceder a la sección gestionar grupo. Se le mostrarán todos los grupos del sitio web, localizará el grupo en cuestión y pulsará el enlace borrar grupo. A continuación, se le pedirá una confirmación para asegurarme de que no se pulso el enlace por error, y una vez confirmada la eliminación del grupo se procederá a borrar todas las referencias relacionadas con dicho grupo. 24 Página de los consejos Al igual que en el caso de las rutas, el sitio web contará con una página personalizada para los consejos. El usuario podrá visualizar los distintos consejos a través del menú situado a su derecha. Además, si se trata de un usuario identificado podrá valorar y comentar los consejos, pudiendo así ofrecer su opinión sobre dicho consejo al resto de visitantes del sitio web. 31 Página de los grupos En esta página el usuario puede visualizar todos los grupos de senderismo que existen en el sitio web. En caso de que desee tener más información acerca de uno de ellos solo deberá pulsar en su nombre. 32 Página detalle de los grupos En esta página se muestran todos los detalles de un grupo, como son sus eventos, los usuarios que asistirán e imágenes de algunos eventos que se hayan realizado. 33 Gestión de consejos Esta página nos permite gestionar los consejos introducidos en la aplicación. En primer lugar se muestra una tabla con los consejos introducidos por los usuarios, con las opciones que se pueden llevar a cabo respectivamente con cada consejo. Además, existe la posibilidad de dar de alta un nuevo usuario utilizando el formulario de alta de un nuevo consejo. 34 Si un usuario pulsa en la opción imágenes en un consejo en concreto se le mostrará una nueva página con todas las imágenes que existen para ese consejo. En dicha página podrá añadir nuevas imágenes, visualizar o borrar las existentes. 35 Gestión de grupos En esta página un usuario que no pertenezca a un grupo podrá unirse a uno de los existentes o bien crear su propio grupo de senderismo en cuyo caso deberá completar el formulario del alta de un nuevo grupo. 36 Gestión de rutas Esta página muestra las rutas que existen en el sitio web junto con todas las acciones que se pueden llevar a cabo para cada una de ellas. Además, existe la posibilidad de que el usuario desee dar de alta una nueva ruta en cuyo caso deberá proceder a insertar los datos correspondientes en el formulario de alta de nueva ruta. 37 Gestión de datos personales Esta página muestra los datos personales del usuario que se ha identificado en el sitio web. Si lo desea podrá modificar algún dato. 4.2. Nivel lógico La capa del nivel lógico de la aplicación permite tener una independencia con respecto a las capas de presentación y persistencia. De esta forma, podremos realizar cambios en dicha capa sin que afecte al resto. En esta aplicación se ha desarrollado una serie de funciones para poder recuperar, modificar e incluso eliminar, en parte o en su totalidad, la base de datos. Por lo tanto la capa de presentación únicamente tendrá que llamar a dichas funciones para poder recuperar los datos necesarios para que la aplicación funcione correctamente. 4.3. Nivel de persistencia La capa de persistencia va a utilizar el sistema de gestión de bases de datos MySQL. Esta capa permite el almacenamiento de toda la información relevante de la aplicación, por ejemplo, los consejos junto con sus fotos, comentarios y valoraciones. Además se almacena la información de que tipos de permisos tiene cada usuario, que aunque no es algo que vayamos a usar en la aplicación resulta informativo para futuros cambios. He elegido MySQL porque es una herramienta gratuita y de fácil uso que me permite llevar a cabo la gestión de la información de una forma rápida y fiable. A la hora de determinar que datos deben ser almacenados he realizado un pequeño estudio, teniendo en cuenta la información que se va a modificar y que puede variar con el tiempo. 38 4.3.1. Diagrama de entidad-relación 4.3.2. Diseño lógico A continuación voy a describir el diseño lógico de la base de datos, de esta forma se puede detallar todos los atributos de todas las entidades y se verá implementado el diagrama entidad-relación. comentarios_consejos(id_comentario: INTEGER, id_consejo: INTEGER, id_usuario:INTEGER, descripcion: TEXT) CP{id_comentario} →CAj{id_consejo} consejos →CAj{id_usuario} usuarios VNN{descripcion} comentarios_rutas(id_comentario: INTEGER, id_ruta: INTEGER, id_usuario:INTEGER, descripcion: TEXT) CP{id_comentario} →CAj{id_ruta} rutas →CAj{id_usuario} usuarios VNN{descripcion} consejos(id_consejo: INTEGER, id_usuario:INTEGER, titulo: VARCHAR(255), descripcion: TEXT, fecha_alta: DATETIME) CP{id_consejo} →CAj{id_usuario} usuarios VNN{titulo, descripcion, fecha_alta} 39 eventos(id_evento: INTEGER, id_grupo: INTEGER, id_ruta:INTEGER, fecha: DATE, descripcion: TEXT) CP{id_evento} →CAj{id_grupo} grupos →CAj{id_ruta} rutas VNN{fecha, descripcion} eventos_usuarios(id_evento: INTEGER, id_usuario: INTEGER) CP{id_evento, id_usuario} →CAj{id_evento} eventos →CAj{id_usuario} usuarios grupos(id_grupo: INTEGER, id_coordinador: INTEGER, nombre: VARCHAR(255), descripcion: TEXT, logo_grupo: VARCHAR(255)) CP{id_grupo} →CAj{id_coordinador} usuarios VNN{nombre, descripcion} grupos_usuarios(id_grupo: INTEGER, id_usuario: INTEGER) CP{id_grupo, id_usuario} →CAj{id_grupo} grupos →CAj{id_usuario} usuarios imagenes_consejos(id_imagen: INTEGER, id_consejo: INTEGER, nombre_imagen: VARCHAR(255), descripcion: VARCHAR(255)) CP{id_imagen} →CAj{id_consejo} consejos VNN{nombre_imagen, descripcion} imagenes_grupos(id_imagen: INTEGER, id_evento: INTEGER, nombre_imagen: VARCHAR(255), descripcion: VARCHAR(255)) CP{id_imagen} →CAj{id_evento} eventos VNN{nombre_imagen, descripcion} imagenes_rutas(id_imagen: INTEGER, id_ruta: INTEGER, nombre_imagen: VARCHAR(255), descripcion: VARCHAR(255)) CP{id_imagen} →CAj{id_ruta} rutas VNN{nombre_imagen, descripcion} poblaciones(id_poblacion: INTEGER, nombre: VARCHAR(255), id_provincia: INTEGER) CP{id_poblacion} →CAj{id_provincia} provincias VNN{nombre} provincias( id_provincia: INTEGER, nombre: VARCHAR(255)) CP{id_provincia} VNN{nombre} 40 47 5.5.3. Moderador En el caso del moderador podrá tanto editar como borrar las rutas y consejos de todos los usuarios, independientemente de si es o no el autor. Además podrá borrar únicamente un grupo si es el coordinador del mismo. 48 49 5.5.4. Administrador El administrador puede realizar todas las gestiones disponibles en el sitio web. 50 51 52 6. Evaluación y pruebas Esta sección me permitirá demostrar que la aplicación ha superado las pruebas de validación, además de detallar algunos casos de uso interesantes para poder demostrar a simple vista que el sitio web lleva a cabo la funcionalidad de una forma correcta. 6.1. Evaluación El siguiente paso después de la implementación es la evaluación que se va a realizar a través de una serie de pruebas y análisis de usabilidad. La usabilidad se centra en las necesidades del usuario. Para conseguirlo se deben cumplir una serie de pautas: –Ponerse en el lugar del usuario para proporcionar la información de una forma que sea fácil de encontrar. –Tener en cuenta las limitaciones del usuario. Por ejemplo, la resolución de pantalla que utiliza, el tiempo estimado para cargar imágenes... –Definir un árbol de navegación coherente y sencillo para el usuario. –Que la aplicación resulte funcional para poder suplir las características de los usuarios. Estos son algunos aspectos a tener en cuenta para afirmar que la aplicación tiene una buena usabilidad. Si comparamos estos datos con la aplicación podemos constatar que la información aparece de forma ordenada, y únicamente se visualiza la necesaria para cada apartado. Por ejemplo, en el caso de los grupos se muestra un listado con todos los grupos que existe y solo si accedemos a través del enlace se nos mostrarán los datos del grupo de una forma más detallada. Otro ejemplo, de que estamos siguiendo estas pautas es la sencillez de uso de la aplicación. Se ha hecho una interfaz de usuario muy sencilla para que no existan dificultades a la hora de navegar por ella y realizar las operaciones que se necesiten en cada momento. 53 6.2. Pruebas Para comprobar la correcta funcionalidad de la web se han llevado a cabo una serie de pruebas basadas en el cumplimiento de los estándares, comprobación de enlaces rotos y comprobación de visualización de la aplicación en diferentes resoluciones. 6.2.1. Validación XHTML y CSS Todas las páginas han sido validadas para comprobar que cumplen el estándar de la W3C, y más concretamente con el estándar XHTML 1.0 estricto. Para validarlas he utilizado una extensión para el navegador Mozilla Firefox que se llama HTML Validator. Esta extensión muestra un icono en la barra de estado del navegador, dependiendo del icono que se muestra se sabe si cumple o no el estándar. Esta utilidad me ha servido de ayuda durante todo el desarrollo de la aplicación. Además cabe destacar que se trata de una herramienta gratuita y fácil de utilizar. 54 El icono que se muestra junto al de validación es el del complemento Firebug. Este complemento sirve para hacer todo un seguimiento del código y por tanto ayudar a la hora de la búsqueda de errores, poder concretar donde se encuentra el error. Una vez comprobado que el código está validado correctamente pasando los estándares, he revisado toda la parte de CSS. Para poder validar las hojas de estilo he utilizado el validador de CSS de la W3C. 55 6.2.2. Comprobación de enlaces rotos Para comprobar que ningún enlace de la aplicación este roto, es decir, que todos los enlaces del sitio web nos lleven a una página existente, se ha utilizado otra aplicación del W3C llamada link checker. Para usar esta aplicación simplemente se tiene que indicar la URL donde está alojada la aplicación y comenzará a comprobar los enlaces de todo el sitio web. 6.2.3. Comprobación de la resolución La última prueba realizada a sido comprobar que todo el sitio web se visualiza perfectamente para las distintas resoluciones de pantalla. Hay que tener en cuenta que la resolución mínima para evitar el scroll horizontal sería 1024x768. A continuación mostraré una serie de pantallas con algunas de las resoluciones. 56 Seguidamente al pulsar enviar el comentario será enviado y mostrado. 63 Alta de un evento para un grupo Para poder crear un evento de un grupo lo primero identificarse en el sitio web. Para identificarse deberá pulsar el enlace loguearte e introducir los datos necesarios para su logueo. Una vez identificado correctamente aparecerá un nuevo menú llamado gestionar. El usuario deberá pulsar sobre dicho menú y seleccionar dentro del mismo la opción grupos. Al hacerlo se le mostrará una tabla con el grupo del que es coordinador. 64 A continuación, seleccionará los eventos del grupo pulsando en el enlace correspondiente. Una vez hecho se le mostrará una tabla con todos los eventos que existen para ese grupo, junto con un formulario para el alta de un nuevo evento. 65 El usuario procederá a completar el formulario pero en el caso de que la fecha no sea válida se le mostrará un error. Es decir, si la fecha es inferior al día actual se comunicará al usuario que ha habido un error. 66 Si por el contrario, introducimos una fecha correcta el evento se introducirá correctamente y nos lleva automáticamente a la ventana de eventos de dicho grupo donde se podrá visualizar el nuevo evento. 67 7. Conclusiones Por último, voy a exponer brevemente las conclusiones finales que he obtenido una vez finalizado este proyecto. La idea inicial de hacer este proyecto era conseguir asentar los conocimientos que he ido adquiriendo en mi estancia en prácticas. Una vez finalizado puedo concluir que he adquirido una serie de conocimientos útiles para poder realizar una aplicación simple pero todavía queda mucho camino por delante para poder realizar aplicaciones de mayor envergadura. Aun con todo esto, creo que la aplicación web sobre senderismo cumple las expectativas que me plantee desde el inicio del proyecto. Otra de las razones por las que seleccione este proyecto es porque el tema de la aplicación lo considero interesante a nivel personal. Para poder dar un enfoque lo más realista posible, me informe de todas y cada una de las características que implica la actividad del senderismo. Gracias a ello pude ampliar mis conocimientos acerca de este deporte al aire libre. En cuanto a los aspectos menos agradables del proyecto debo decir que personalmente lo más fatigoso ha sido la planificación del mismo, debido a que he tenido que rectificar varias veces sobre lo que en un primer momento había planteado. Imagino que esto será fruto de la inexperiencia en la planificación de un proyecto, por lo tanto, me ayudará a que en un futuro dedique más tiempo a planificar y menos tiempo a rectificar. En conclusión, me siento orgullosa del trabajo que he realizado y de haber conseguido las metas planteadas. 68 8. Bibliografía Para la realización de la parte de la implementación del sitio web de senderismo he utilizado la documentación perteneciente a los siguientes sitios web: •http://www.sxc.hu/ •http://jquery.com/ •http://php.net/ •http://www.anieto2k.com/2008/06/25/validar-formularios-con-jquery/ •http://www.restaurantesvegetarianos.es/content/view/311/296/ •http://www.w3c.org/ 69