TRABAJO FIN DE GRADO. Herramienta de análisis web y auditoría SEO

TRABAJO FIN DE GRADO Título Herramienta de análisis web y auditoría SEO Autor/es Raúl Pérez López Director/es Ana Romero Ibáñez Facultad Facultad de Ciencias, Estudios Agroalimentarios e Informática Titulación Grado en Ingeniería Informática Departamento Curso Académico 2013-2014

Herramienta de análisis web y auditoría SEO, trabajo fin de grado de Raúl Pérez López, dirigido por Ana Romero Ibáñez (publicado por la Universidad de La Rioja), se difunde bajo una Licencia Creative Commons Reconocimiento-NoComercial-SinObraDerivada 3.0 Unported. Permisos que vayan más allá de lo cubierto por esta licencia pueden solicitarse a los titulares del copyright. El autor Universidad de La Rioja, Servicio de Publicaciones, 2014 publicaciones.unirioja.es E-mail: publicaciones@unirioja.es

Facultad de Ciencias, Estudios Agroalimentarios e Informática TRABAJO FIN DE GRADO Grado en Ingeniería Informática HERRAMIENTA DE ANÁLISIS WEB Y AUDITORÍA SEO Autor: Raúl Pérez López Tutor: Dr. Ana Romero Ibáñez Departamento de Matemáticas y Computación Logroño, junio de 2014

Resumen El objetivo de este Trabajo de Fin de Grado, es la elaboración de una aplicación web que pueda analizar rápidamente algunos de los elementos clave que influyen en el posicionamiento de un sitio web en los principales buscadores, centrándose principalmente en los utilizados por Google para establecer el orden de aparición en sus resultados de búsqueda. Esta aplicación tiene como fin que cualquier persona o empresa pueda realizar, de forma totalmente gratuita, una auditoría SEO de su web, sin necesitar para la elaboración de dicho informe conocimientos técnicos de la materia. Este proyecto responde a la necesidad concreta de la empresa Netbrain Media Solutions, S.L. de proporcionar a sus clientes una plataforma a través de la cual puedan realizar el análisis y seguimiento del trabajo llevado a cabo por la misma. La página web ha sido completamente desarrollada y diseñada por Raúl Pérez López, bajo la tutoría de Dr. Ana Romero Ibáñez. Palabras clave: Posicionamiento, SEO, Auditoría, Buscadores, Análisis. Abstract The objective of this Final Degree Project is the development of a web application that can quickly analyze some of the principal elements which influence for the positioning of a web site in the main search engines, focusing primarily on those utilized by Google to establish the order of appearance in their search results. This application is designed in order that any person or company can perform, completely free, a SEO audit of their website, without the needing of having technical knowledge about the subject. This project responds to the specific business necessity of the company Netbrain Media Solutions, S.L. to provide their customers with a platform across which they can carry out the analysis and monitoring of the work carried out by themselves. Keywords: Positioning, SEO, Auditing, Search engines, Analysis. 1

2

Índice Resumen... 1 Abstract... 1 Índice... 3 Introducción... 6 Objetivos del TFG... 7 Objetivos globales del proyecto... 7 Objetivos particulares del proyecto... 7 Planificación Inicial... 9 Diagrama de Gantt... 9 Planificación... 10 Análisis... 10 Diseño... 10 Implementación...10 Pruebas... 11 Reacción memoria TFG... 11 Preparación de la defensa... 11 Metodología utilizada... 11 Análisis... 12 Requisitos funcionales... 12 Requisitos funcionales del portal para los visitantes... 12 Requisitos funcionales del portal para los usuarios registrados... 12 Requisitos funcionales del portal para administradores.... 13 Requisitos no funcionales... 13 Casos de uso... 14 Diagrama de casos de uso... 14 Especificación de los casos de uso... 15 Esquema de Navegación de Casos de uso... 21 Diseño... 22 Diseño de la interfaz de usuario... 22 3

Generalidades... 23 Colores de la página... 23 Encabezado de página... 23 Pie de página... 27 Página de inicio... 27 Formularios... 29 Formulario de Login... 30 Formulario de Registro... 31 Formulario de contacto... 32 Página de informe... 33 Diseño de la base de datos... 34 Modelo Entidad Relación... 34 Entidades y atributos de la base de datos... 35 Arquitectura del sistema... 37 Implementación... 38 Tecnologías utilizadas... 38 Entorno de desarrollo... 38 Control de versiones... 38 Lenguajes de programación... 39 PHP... 39 Javascript... 40 CSS... 40 HTML... 40 Librerías Utilizadas... 40 Zurb Foundation... 41 UserCake... 41 Algoritmos representativos... 42 Algoritmo de seguimiento de la posición de un sitio en Google dada una keyword... 42 Algoritmo para conocer las imágenes del sitio sin atributo ALT... 43 Algoritmo para conocer los +1's del sitio en Google+... 44 Algoritmo que obtiene el número de páginas indexadas en Google de un sitio.... 44 Algoritmo que obtiene el ranking Alexa de tráfico para el sitio en su país de origen.... 45 4

Algoritmo que comprueba si un sitio web se encuentra listado en el directorio DMOZ.... 45 Problemas encontrados durante la implementación... 46 Pruebas... 47 Revisión de la planificación... 48 Conclusiones... 48 Lecciones aprendidas... 49 Bibliografía... 50 5

Introducción Esta memoria refleja el trabajo realizado a lo largo del proyecto "Herramienta de análisis web y auditoria SEO". El Trabajo de Fin de Grado utiliza parte del trabajo llevado a cabo durante el tiempo de prácticas para Netbrain Media Solutions, S.L., la misma empresa junto con la cual se desarrolla el proyecto. En dicho periodo de tiempo, el proyectante adquirió conocimientos técnicos acerca del posicionamiento web y tuvo ocasión de utilizar diversas herramientas diseñadas a medir factores SEO de un sitio, lo que le proporcionó información clave a la hora de la elaboración del proyecto. Esta herramienta consiste en una aplicación web a través de la cual los usuarios serán capaces de crear sus propios informes sobre los factores de posicionamiento de un sitio web, lo cual ahorrará mucho tiempo de elaboración manual y supondrá un gran beneficio para aquellos usuarios que no posean amplios conocimientos sobre la materia, ya que con la utilización de la página realizada podrán saber cuáles son los elementos que deben alterar para conseguir una mayor visibilidad en los buscadores. El diseño de la página será totalmente responsivo, lo cual significa que responderá al tamaño del dispositivo desde el que se está visualizando la web, adaptando las dimensiones del contenido y mostrando los elementos de una forma ordenada y optimizada sea cual sea el soporte. La parte pública de la web permitirá crear un informe de una web a cualquier persona, con solo introducir la URL de dicha página. También le permitirá realizar un seguimiento de un número determinado de palabras clave, mediante la posición ocupada por dichas palabras en el buscador de Google. Los usuarios también podrán registrarse y, una vez registrados, acceder a la página web con su nombre de usuario y una contraseña, que solo ellos conocerán. Estos usuarios registrados almacenarán sus informes creados, teniendo la posibilidad de ver los informes realizados más adelante. También dispondrán de formularios en los cuales puedan trasladar al responsable de la página sus dudas o las posibles sugerencias acerca de la herramienta. 6

Objetivos del TFG Objetivos globales del proyecto Desarrollo de una herramienta que permita realizar auditorías SEO de sitios web de una forma rápida y sencilla. Implementación de una comunicación eficiente entre la aplicación web y la base de datos que ésta utilizará para la gestión de usuarios, permisos, configuración y el almacenamiento de los informes. Realización de un manual y un video demostrativo de la utilización de la herramienta, para ayudar a los clientes con su utilización. Objetivos particulares del proyecto Efectuar las fases de análisis, diseño, implementación y pruebas del TFG. Realizar un seguimiento del impacto del proyecto y del tráfico que generará y los registros realizados. Llevar a cabo una estrategia de marketing en la web, utilizando para ello la plataforma de Google Adwords. Hacer que la página sea adaptable y esté optimizada para todo tipo de pantallas, incluyendo a los dispositivos móviles. Diseño e implementación de la base de datos utilizada. Administración y migración de servidores del proyecto. 7

8

Planificación Inicial Diagrama de Gantt 9

Planificación Planificación horaria del proyecto mediante diagrama de Gantt. Fecha prevista de finalización: 14 de Febrero. Horas: 15. Análisis Captura de requisitos del proyecto, definición del alcance, modelado UML y estudio de las herramientas. Fecha prevista de finalización: 25 de Febrero. Horas: 30. Diagrama de casos de uso. Diagrama de flujo. Diagrama de clases. Identificación de requisitos. Estudio de herramientas que serán utilizadas. Diseño Desarrollo de un modelo o representación para el programa. Fecha prevista de finalización: 14 de Marzo. Horas: 42. Diseño de la interfaz de usuario. Diseño de la base de datos. Diseño y redacción de los contenidos. Implementación Implementación de la aplicación Fecha prevista de finalización: 9 de Mayo. Horas: 155. Creación e implantación de servidor. Estructura HTML/CSS. Base de datos. Funciones PHP. Registro de usuarios. Funciones de usuarios. Funciones Javascript. 10

Pruebas Fecha prevista de finalización: 15 de Junio. Horas: 22. Testeo de las funcionalidades de la herramienta. Pruebas con el sistema de gestión de usuarios. Probar la aplicación en los distintos dispositivos. Reacción memoria TFG Redacción y corrección de la memoria final. Fecha prevista de finalización: 23 de Junio. Horas: 22. Preparación de la defensa Elaboración y preparación de la presentación final del proyecto. Fecha prevista de finalización: 30 de Junio. Horas: 14. Horas totales realizadas: 300. Metodología utilizada Para la elaboración del proyecto, se ha utilizado el desarrollo en cascada. Esto es así al estar rigurosamente ordenadas las etapas del ciclo de vida del software. Es preciso haber terminado una etapa para poder comenzar con la siguiente. 11

Análisis Requisitos funcionales Requisitos funcionales del portal para los visitantes Los visitantes de la página web podrán crear un informe SEO introduciendo la URL deseada en la página de inicio. Los visitantes de la página web podrán acceder a los manuales, a las páginas de contenido y al formulario de contacto. Los visitantes de la página web podrán registrase como usuarios a través de un formulario sencillo. Los visitantes de la página web podrán hacer login de usuario a través de un formulario sencillo. Los visitantes de la página web podrán acceder a las redes sociales del sitio. Requisitos funcionales del portal para los usuarios registrados. Los usuarios registrados son aquellos usuarios que han accedido mediante un login con su nombre de usuario y contraseña. Los usuarios registrados podrán crear un informe SEO introduciendo la URL deseada en la página de inicio. Los usuarios registrados podrán acceder a los manuales, a las páginas de contenido y al formulario de contacto. Los usuarios registrados podrán editar su nombre de usuario, su correo electrónico y su contraseña. Los usuarios registrados almacenarán los informes generados. Los usuarios registrados podrán acceder a los informes almacenados previamente. Los usuarios registrados podrán recuperar su contraseña si la olvidan. 12

Requisitos funcionales del portal para administradores. Los administradores podrán editar los datos de los usuarios. Los administradores podrán eliminar usuarios. Los administradores podrán crear y editar niveles de permisos. Los administradores podrán asignar permisos a los usuarios. Los usuarios registrados podrán cambiar la configuración del sitio web. Requisitos no funcionales Disponibilidad: El sitio web debe de estar disponible y operativo 24/7, o lo que es lo mismo, a todas horas todos los días del año. Seguridad: La herramienta debe ser segura, utilizando encriptación en las contraseñas y haciendo lo posible para prevenir y evitar posibles ataques. Accesibilidad: La página debe ser accesible en la medida de lo posible a todo tipo de personas. Usabilidad: El sistema debe ser fácil de utilizar, aun para personas que no tengan conocimientos técnicos. Estabilidad: La página debe ser estable. Se evitarán los errores que sean posibles y los que no sea posible evitar serán capturados. Portabilidad: Se podrá acceder a la página en cualquier dispositivo que disponga de acceso a internet. Concurrencia: La herramienta podrá ser utilizada por múltiples usuarios a la vez y se podrán generar muchos informes simultáneamente. Interfaz: La interfaz deberá ser amigable para el usuario, atractiva y fácil de utilizar. También deberá ser responsiva, para que el acceso desde dispositivos móviles sea óptimo. 13

Casos de uso Diagrama de casos de uso 14

Especificación de los casos de uso A continuación se especifican todos los casos de uso obtenidos a partir de los requisitos de la aplicación. Caso de uso Descripción Actores Crear Informe Creación de un informe mediante la introducción de la URL deseada y las keywords a analizar. Visitante, Usuario, Administrador Precondiciones Caso de uso Descripción Registrarse como usuario El usuario se registra mediante un formulario con la introducción de: Nombre de usuario Nombre mostrado Contraseña Email Código de seguridad (Captcha) Actores Visitante Precondiciones Caso de uso Descripción Acceder como usuario El usuario se logea mediante un formulario con la introducción de: Nombre de usuario Contraseña 15

Actores Visitante Precondiciones Caso de uso Descripción Actores Acceder a contacto El usuario accederá a la página de contacto y podrá enviar un mensaje utilizando el formulario de dicha página. Visitante, Usuario, Administrador Precondiciones Caso de uso Descripción Actores Compartir en redes sociales El usuario accederá a las redes sociales mediante los botones situados a tal efecto en la cabecera. Visitante, Usuario, Administrador Precondiciones Caso de uso Descripción Actores Acceder a descargas El usuario accederá a la página de descargas. Visitante, Usuario, Administrador Precondiciones Caso de uso Descripción Actores Suscribirse a newsletter El usuario podrá suscribirse a una newsletter a través de un formulario. Visitante, Usuario, Administrador Precondiciones 16

Caso de uso Descripción Actores Precondiciones Ver informes guardados El usuario visualizará una tabla con los informes generados con anterioridad. Usuario, Administrador El usuario debe estar identificado. Caso de uso Descripción Actores Precondiciones Guardar informes El usuario almacenará en base de datos los datos del informe generado. Usuario, Administrador El usuario debe estar identificado. Caso de uso Descripción Actores Precondiciones Imprimir informes El usuario podrá imprimir los informes guardados. Usuario, Administrador El usuario debe estar identificado. Caso de uso Descripción Actores Precondiciones Ver perfil El usuario visualizará sus datos de perfil almacenados. Usuario, Administrador El usuario debe estar identificado. Caso de uso Editar perfil 17

Descripción Actores Precondiciones El usuario podrá editar contraseña o correo electrónico. Usuario, Administrador El usuario debe estar identificado. Caso de uso Descripción Actores Precondiciones Eliminar cuenta El usuario podrá eliminar su cuenta. Usuario, Administrador El usuario debe estar identificado. Caso de uso Descripción Actores Precondiciones Eliminar usuario El administrador podrá eliminar cualquier cuenta de usuario. Administrador El usuario debe estar identificado como administrador. Caso de uso Descripción Actores Precondiciones Eliminar informes El administrador podrá eliminar los informes guardados por los usuarios. Administrador El usuario debe estar identificado como administrador. Caso de uso Descripción Actores Precondiciones Añadir contenidos El administrador podrá añadir contenidos estáticos. Administrador El usuario debe estar identificado como administrador. Caso de uso Editar permisos 18

Descripción Actores Precondiciones El administrador podrá crear y editar permisos de usuario. Administrador El usuario debe estar identificado como administrador. Caso de uso Descripción Actores Precondiciones Crear usuario El administrador podrá crear usuarios. Administrador El usuario debe estar identificado como administrador. 19

20

Esquema de Navegación de Casos de uso

Diseño Diseño de la interfaz de usuario Como se ha mencionado anteriormente, en el apartado de requisitos del proyecto, la interfaz de usuario es una parte muy importante del desarrollo de la aplicación. Esto es debido a que la página web será pública y de libre acceso a todos los visitantes. Estos visitantes en su mayoría no tendrán muchos conocimientos técnicos y es posible que no estén familiarizados con páginas demasiado complejas, por lo que el diseño tendrá que ser sencillo, a la par que agradable a la vista. Con el fin de minimizar el tiempo de carga de la página, se ha optado por un diseño minimalista, reduciendo al máximo los elementos de las páginas, con lo que se consigue un tiempo medio de carga inferior a 1 segundo, cumpliendo así uno de los cánones óptimos para Google. Para favorecer la portabilidad de la web, el diseño es full responsive, lo cual significa que la página se adaptará a cualquier pantalla de cualquier dispositivo utilizado, adaptando su ancho y reajustando los elementos para que sean visibles en la pantalla. Se intenta mantener un diseño de interfaz general para todo el sitio, de acuerdo al objetivo de no confundir al usuario y brindarle un diseño con una navegabilidad óptima. En los siguientes apartados se mostrarán las partes más importantes de la interfaz de usuario y se explicarán las decisiones que se han tomado en cada una de estas partes. 22

Generalidades En este apartado se tratarán las partes generales de la interfaz de usuario, como pueden ser los colores utilizados, la cabecera y el pie de página, que están incluidos en todas ellas. Colores de la página Con el objetivo de no sobrecargar la interfaz de usuario, se ha utilizado una combinación de colores sencilla. En primer lugar, el fondo de la página es blanco, para no dificultar la lectura ni distraer al usuario del resto de elementos. El siguiente color predominante es el azul claro, otro color para facilitar la lectura y para no causar demasiada impresión a la vista. El color utilizado en los textos es mayoritariamente negro, salvo en algún caso como en el encabezado, donde para facilitar la lectura sobre negro se utiliza el blanco. Encabezado de página En la siguiente página se muestran las diferentes versiones de la barra de acción que hace las veces de encabezado del sitio web. La razón de que existan distintas versiones de este encabezado es el objetivo de que la página se adapte automáticamente al tamaño de la pantalla de visualización. Este encabezado incluye el logotipo de la aplicación, que dirige al pulsarlo a la página de inicio, para facilitar la navegabilidad. En el caso de haber accedido a la página como un usuario registrado, el encabezado mostrará las opciones de acceder a la cuenta de usuario y la de cerrar sesión. En caso de acceder como visitante, se mostrarán las opciones para registrarse y para acceder como usuario. En el centro de la barra de acción se pueden encontrar 3 botones rotatorios que dirigen a las principales redes sociales, en las que la aplicación tendrá presencia: Google+, Facebook y Twitter. Si el acceso se produce desde una pantalla estrecha, se ocultarán dichos botones sociales para adaptarse al ancho, así como la opción de cerrar sesión. 23

24

Encabezado de página en una pantalla de PC estándar. Encabezado de página en una pantalla de PC minimizada o en una pantalla de una tableta. Encabezado de página en una pantalla de PC minimizada o en una pantalla móvil. 25

26

Pie de página En el pie de página, incluido en todas las pantallas y con la misma funcionalidad y aspecto en todas ellas, se visualiza el dueño de la propiedad de la página, además de contener enlaces a las secciones de contacto, acceso, premium y al aviso legal obligatorio. Página de inicio La página de inicio es la página más representativa de la web, pues desde ella llega la mayor parte del tráfico y es en la que se encuentra la funcionalidad más importante de la aplicación, la generación de informes SEO. Como la Landing page del proyecto, el aspecto del inicio debe ser atractivo, para facilitar un mayor rebote dentro de la web y para evitar que el visitante deseche la herramienta por el hecho de tener un diseño poco sugerente. En primer lugar, dejando aparte el encabezado, que es mostrado en todas las páginas del sitio, se puede ver la imagen principal del sitio web, con el logotipo representado por la araña incluido en la O final. La página incluye un formulario desde el cual se puede acceder al informe deseado. Dicho formulario está formado por un campo de relleno obligatorio en el cual se introduce la URL y 3 campos destinados a que el usuario introduzca las palabras clave sobre las cuales quiere realizar el seguimiento del posicionamiento. Estas palabras clave son opcionales. 27

Seguidamente, descendiendo en la página, se encuentra con imágenes que enlazan a una página con una lista de herramientas útiles para el posicionamiento SEO, a una sección que incluye guías para un correcto uso de los buscadores y el enlace a la sección de informes premium, que como se ha mencionado anteriormente, también se encuentra en el pie de página. También se enlaza desde está pagina al formulario del sitio. Es importante que este enlace de contacto tenga buena visibilidad, ya que cualquier problema o sugerencia podrá ser enviado al administrador de la página desde dicho formulario. 28

Formularios En el sitio web pueden encontrarse distintos formularios como son: Formulario de Login. Formulario de registro. Formulario de recordatorio de contraseña. Formulario de contacto. Edición de perfil. Estos formularios siguen el mismo patrón de diseño, con los colores del resto de la página y etiquetas para facilitar su uso. 29

Formulario de Login Desde este formulario, el visitante podrá identificarse como un usuario registrado de la página web. Una vez introducidos los datos, el sistema comprobará en la base de datos si éstos son correctos y procederá al inicio de la sesión del usuario. En caso contrario, se mostrará un mensaje de error como el siguiente. 30

Se ha decidido utilizar el color rojo para resaltar el error cometido por el usuario e informarle de una forma sencilla de éste. Formulario de Registro En el formulario de registro el usuario introducirá los datos que son necesarios y obligatorios para proceder a su almacenamiento como usuario en la base de datos. Por seguridad, también se deberá introducir un captcha para asegurar que ningún robot malicioso lleve a cabo un ataque contra el sitio. El nombre de usuario deberá ser único, no pudiéndose repetir con el de ningún usuario registrado en la página con anterioridad. El sistema de notificación de errores es similar al del formulario de login, por lo que no introduciré ninguna captura de pantalla del mismo. 31

Formulario de contacto El diseño de este formulario incluye iconos en los campos a rellenar, con el fin de hacerlo más agradable. Desde la página de contacto, el visitante o usuario de la web pueden ponerse en contacto con el administrador de la misma, con el fin de trasladarle algún error o una posible sugerencia. Son obligatorios los campos de nombre, email y de mensaje, para poder tratar de forma adecuada con el problema del usuario. Una vez introducidos los datos, un mensaje se envía al administrador de la página, que lo recibirá en su correo electrónico. 32

Página de informe La página en la cual se generan los informes, se encuentra diseñada de forma minimalista, facilitando que el usuario pueda acceder a la información que necesita rápidamente. En la sección de la izquierda, se encuentran unos link a las secciones del informe, para facilitar la navegabilidad, y unas imágenes que enlazan a las herramientas y los manuales recomendados. El apartado de la derecha está destinado a mostrar los resultados del informe, dividido en secciones y con una forma de listado. 33

Diseño de la base de datos. Para el desarrollo de este Trabajo de Fin de Grado, se ha empleado una base de datos relacional gestionada por MySQL. Esta decisión viene dada por la comodidad que brinda MySQL a la hora de interaccionar con funciones PHP. En este apartado se pueden encontrar la información relativa al diseño de las tablas, los atributos de éstas, y las relaciones que se establecen entre ellas. Se ha intentado hacer un diseño sencillo, que no utilice campos inútiles, buscando una fácil utilización del mismo y adaptándolo al requerido por la librería UserCake, utilizada para implementar la gestión de usuarios, como se verá más adelante. No se ha llevado a cabo una normalización de la base de datos, dada la sencillez de la misma, mencionada anteriormente. Modelo Entidad Relación 34

Entidades y atributos de la base de datos La tabla uc_users, almacenará la información relativa a los usuarios registrados del sitio: un id único autogenerado, el nombre de usuario, nombre mostrado, la contraseña encriptada, el email y el token de activación de la cuenta. También mostrará información de interés para el administrador, como son la hora de registro, si el usuario está activo, el nivel de permisos, y la hora en la que se ha conectado por última vez La tabla uc_permissions se utilizará con el fin de almacenar los distintos niveles de permisos que tendrá el sitio web. 35

La tabla uc_pages se utilizará con el fin de almacenar las páginas del sitio web. La tabla uc_user_permission_page_matches relaciona los niveles de permisos de la web con las páginas a las que este permiso afecta. En la tabla uc_user_permission_matches, se relacionarán los usuarios del sitio web con los niveles de permisos existentes. Cabe mencionar que un usuario puede tener más de un nivel de permisos diferente. La tabla informe almacena la URL de los informes generados por los usuarios registrados y la fecha en la que han sido creados. Finalmente, en lugar de almacenar todos los valores del resultado del informe, solamente se almacenarán la URL de la página analizada y la hora de realización del informe. 36

La tabla usuario_informes relaciona los informes almacenados con el usuario que ha generado dichos informes, para que en el futuro el usuario pueda ver qué informes ha generado y cuándo lo ha hecho. Arquitectura del sistema La naturaleza de aplicación web que tiene este proyecto requiere que el código esté implementado en un servidor. Como también se necesita que este código se comunique con una base de datos MySQL, la arquitectura física del sistema consistirá en un servidor Apache que se relacionará con la base de datos en el lado del servidor mediante PHP. Esta separación entre la lógica de la aplicación y el acceso a los datos, añade una enorme flexibilidad al diseño de la aplicación. 37

Implementación En esta sección se tratarán los temas referentes a las tecnologías utilizadas para desarrollar el proyecto, los lenguajes de programación utilizados, las herramientas utilizadas, las librerías que se han incorporado a la aplicación y algunos algoritmos representativos. Tecnologías utilizadas Entorno de desarrollo El entorno de desarrollo elegido para la implementación de este proyecto ha sido Netbeans ya que, tras decidir junto con el cliente los requisitos de la aplicación, se decidió que era el entorno más cómodo y el que ofrecía un desarrollo más ágil y eficiente en el caso de esta aplicación web. Algunos de los motivos para la elección de Netbeans son los siguientes: Se trata de un entorno libre y gratuito, lo que era imprescindible, ya que el proyectante no dispone de presupuesto para comprar una herramienta de pago. Ofrece soporte para todos los lenguajes de programación utilizados en este proyecto, que como se especifica más adelante, son PHP, CSS, Javascript y HTML. Netbeans también incorpora una interfaz gráfica de usuario para trabajar con GIT, el controlador de versiones que será utilizado. Se trata de un entorno de desarrollo que ha sido utilizado anteriormente por el proyectante, lo que reducirá las horas de formación del proyecto y ayudará a que éste sea más eficiente. Control de versiones Para el control de versiones del proyecto se ha utilizado GIT, el sistema más usado en la actualidad y uno de los más cómodos, ya que los principales entornos de desarrollo incorporan librerías que proporcionan una interfaz de usuario para actualizar las versiones rápidamente. En este caso ha sido especialmente útil, ya que garantizaba que el proyectante trabajará siempre sobre la versión más reciente del proyecto, trabajando desde casa o en la oficina. 38

Lenguajes de programación Como se ha mencionado varias veces a lo largo de la presente memoria, los lenguajes elegidos para la programación del proyecto han sido los siguientes: PHP, Javascript, HTML y CSS. En esta sección se expondrán los motivos que han dado lugar a dicha elección y se explicará para que se ha utilizado cada uno de ellos. PHP PHP (Hypertext Preprocessor) es un lenguaje de código abierto muy popular especialmente diseñado para el desarrollo web de contenido dinámico. Igual que el SSI, PHP se integra directamente en el código fuente de la página. La elección de PHP ha sido una elección motivada principalmente con la facilidad que nos ofrece este lenguaje para la interacción con otros como SQL y HTML. Otras características que han decantado la elección de PHP como principal lenguaje de programación del proyecto son: Velocidad de programación: PHP facilita que los programadores puedan generar código de forma rápida, reduciendo el tiempo de implementación gracias a su sencilla utilización. Estabilidad: PHP utiliza su propio sistema de administración de recursos y dispone de un método de manejo de variables muy perfeccionado, lo que hace de él un sistema robusto y estable. Además este lenguaje tiene una increíble comunidad de programadores y usuarios como respaldo y una gran bibliografía, lo que ayudará a solucionar los posibles errores que surjan. Seguridad: Se trata de un sistema que cuenta con protección contra posibles ataques maliciosos, una característica que estos pueden ser configurada de manera sencilla desde el archivo.ini. Integración: Se trata de un lenguaje muy versátil, que puede ser utilizado en multitud de plataformas y servidores, lo que ofrecerá facilidades a la hora de migrar el servidor en vistas de que la aplicación sea escalable. En esta aplicación, PHP será utilizado para generar todo el contenido dinámico de la web. Para esto PHP puede recoger los datos de la base de datos o bien utilizar determinadas funciones Javascript o PHP para recibirlos. 39