UNIVERSIDAD REGIONAL AUTONOMA DE LOS ANDES
“UNIANDES”
FACULTAD DE SISTEMAS MERCANTILES
CARRERA DE SISTEMAS
PROYECTO DE INVESTIGACIÓN PREVIO A LA OBTENCIÓN DEL TITULO DE INGENIERO EN SISTEMAS E INFORMÁTICA
TEMA:
“APLICACIÓN COLABORATIVA PARA LA GESTIÓN DE PROCESOS DEL
CONSEJO CANTONAL DE PROTECCION DE DERECHOS DEL CANTON TISALEO”
AUTOR: SILVA SOLIS ALEX SANTIAGO
ASESOR: ING. BAÑO NARANJO FREDDY PATRICIO
AMBATO-ECUADOR
APROBACIÓN DEL ASESOR DEL TRABAJO DE TITULACIÓN
CERTIFICACIÓN:
Quien suscribe, legalmente CERTIFICA QUE: El presente Trabajo de Titulación
realizado por el señor Silva Solis Alex Santiago, estudiante de la Carrera de Sistemas, Facultad de Sistemas Mercantiles, con el tema “APLICACIÓN COLABORATIVA
PARA LA GESTIÓN DE PROCESOS DEL CONSEJO CANTONAL DE PROTECCION DE DERECHOS DEL CANTON TISALEO”, ha sido prolijamente
revisado, y cumple con todos los requisitos establecidos en la normativa pertinente de la
Universidad Regional Autónoma de los Andes -UNIANDES-, por lo que apruebo su
presentación.
Ambato, Agosto de 2017
_______________________________
Ing. Baño Naranjo Freddy Patricio
ASESOR
DECLARACIÓN DE AUTENTICIDAD
Yo, Alex Santiago Silva Solis estudiante de la Carrera de Sistemas, Facultad de Sistemas
Mercantiles, declaro que todos los resultados obtenidos en el presente trabajo de
investigación, previo a la obtención del título de INGENIERO EN SISTEMAS E
INFORMATICA, son absolutamente originales, auténticos y personales; a excepción de
las citas, por lo que son de mi exclusiva responsabilidad.
Ambato, Agosto 2017
_____________________________
Sr. Alex Santiago Silva Solís
CI. 1804373742
DERECHOS DE AUTOR
Yo, Alex Santiago Silva Solis, declaro que conozco y acepto la disposición constante en
el literal d) del Art. 85 del Estatuto de la Universidad Regional Autónoma de Los Andes,
que en su parte pertinente textualmente dice: El Patrimonio de la UNIANDES, está
constituido por: La propiedad intelectual sobre las Investigaciones, trabajos científicos o
técnicos, proyectos profesionales y consultaría que se realicen en la Universidad o por
cuenta de ella;
Ambato, Agosto 2017
_______________________________
Sr. Alex Santiago Silva Solís
CI. 1804373742
DEDICATORIA
Dedico este trabajo principalmente a Dios, por haberme dado la vida y permitirme el
haber llegado hasta este momento tan importante de mi formación profesional. A mi
madre y padre, por ser las personas que me ha acompañado durante todo mi trayecto
estudiantil y de vida por ser el pilar más importante y por demostrarme siempre su cariño
y apoyo incondicional, a mi hermano que siempre ha estado junto a mí y brindándome su
apoyo muchas veces y a mi familia en general, porque me han brindado su apoyo
incondicional y por compartir conmigo siempre buenos momentos.
Alex Santiago Silva Solis
AGRADECIMIENTO
Expreso mi sincero agradecimiento a la UNIVERSIDAD REGIONAL AUTONOMA DE
LOS ANDES, a los distinguidos docentes quienes con su profesionalismo y experiencia
contribuyeron en mis estudios, en especial al Ing. Freddy Baño por su paciencia y acertada
asesoría en la calidad de tutor para la culminación exitosa de este trabajo de tesis.
Agradezco a la Abg. Alejandra Aldaz, Lic. Ana Cristina Arcos, Ing. Alexandra Baño y a
la Abg. Mercedes López quien muy amablemente nos asesoró y guiaron para poder
realizar este proyecto de investigación.
A mi madre y padre, que con su demostración ejemplar me han enseñado a no desfallecer
ni rendirme ante nada y siempre perseverar a través de sus sabios consejos.
Índice General
APROBACIÓN DEL ASESOR DEL TRABAJO DE TITULACIÓN DECLARACION DE AUTENTICIDAD
DERECHOS DE AUTOR DEDICATORIA AGRADECIMIENTO RESUMEN EJECUTIVO ABSTRACT
INTRODUCCION ... 1
Antecedentes de la investigación ... 1
SITUACIÓN PROBLEMÁTICA ... 2
PROBLEMA CIENTÍFICO ... 2
OBJETO DE INVESTIGACIÓN Y CAMPO DE ACCIÓN ... 2
LÍNEA DE INVESTIGACIÓN ... 3
OBJETIVOS ... 3
IDEA A DEFENDER ... 3
JUSTIFICACIÓN ... 4
CAPITULO I ... 5
1. MARCO TEORICO ... 5
1.1. Aplicación Colaborativa ... 5
1.1.1. Tipos de Colaboración ... 7
1.1.2. Programas informáticos colaborativos ... 9
1.2. Aplicaciones Web ... 11
1.2.1. Apache ... 11
1.2.2. El nacimiento de Apache ... 12
1.2.3. Instalación de Apache ... 14
1.2.4. Mysql.. ... 14
1.2.5. JavaScript ... 17
1.2.6. Php…… ... 18
1.2.7. Ajax….. ... 19
1.2.8. CSS…… ... 21
1.2.9. Breve historia de CSS ... 22
1.2.10. Soporte de CSS en los navegadores ... 23
1.3. Bootstrap ... 24
1.3.1. Introducción al diseño "responsive" ... 24
1.3.3. Funcionamiento del diseño adaptable ... 26
1.4. Herramientas de Desarrollo ... 29
1.4.1. Dreamweaver ... 29
1.5. Gestión de Procesos ... 31
1.6. Conclusiones parciales del capitulo ... 39
CAPITULO II ... 41
2. MARCO METODOLÓGICO ... 41
2.1. Caracterización del Sector ... 41
2.1.1. Consejo cantonal de protección de derechos del cantón Tisaleo ... 41
2.2. Proceso Metodológico ... 42
2.2.1. Modalidad de la investigación ... 42
2.2.2. Tipo de investigación ... 43
2.2.3. Población ... 43
2.2.4. Métodos, técnicas e instrumentos ... 44
2.2.5. Análisis e interpretación de resultados ... 45
2.2.5.1. Resultados ... 45
2.3. Propuesta del Investigador ... 50
2.4. Conclusiones parciales del capitulo ... 50
CAPITULO III ... 52
3. DESARROLLO DE LA PROPUESTA ... 52
3.1. Tema ... 52
3.1.1. Objetivos ... 52
3.2. Descripción de la propuesta ... 53
3.3. Metodología de desarrollo ... 53
3.3.1. Fase de análisis ... 54
3.4. Especificación de requisitos ... 54
3.5. Diagrama de Caso Uso ... 61
3.5.2. Diagrama de Secuencia ... 62
3.5.4. Fase de Diseño ... 65
3.5.5. Diseño de la Base de Datos ... 65
3.5.6. Fase de Desarrollo ... 67
3.6. Fase de Pruebas ... 69
3.7. Implementación ... 71
3.7.1. Proceso de Implementación ... 72
CONCLUSIONES ... 78
ÍNDICE DE TABLAS
Tabla 1: Soporte de CSS en los navegadores ... 23
Tabla 2: Resoluciones de pantalla más utilizadas ... 26
Tabla 3: Población ... 43
Tabla 4: Requerimientos Funcionales Autentificación del Usuario ... 54
Tabla 5: Requerimientos Funcionales Registrar Usuarios ... 55
Tabla 6: Requerimientos Funcionales Consultar Información ... 55
Tabla 7: Requerimientos Funcionales Modificar datos ... 56
Tabla 8: Requerimientos Funcionales Gestión de procesos ... 56
Tabla 9: Requerimientos Funcionales Gestionar Reportes Gráficos ... 57
Tabla 10: Requerimientos no Funcionales Interfaz de la aplicación colaborativa ... 57
Tabla 11: Requerimientos no Funcionales Ayuda en el uso del sistemas ... 58
Tabla 12: Requerimientos no Funcionales Diseño de la interfaz a las características de la web 58 Tabla 13: Requerimientos no Funcionales Nivel de Usuario ... 59
Tabla 14: Requerimientos no Funcionales Seguridad en la información ... 59
Tabla 15: Determinación de Pruebas de Caja Negra ... 69
Tabla 16: Pruebas de Caja Blanca, Pruebas de interfaz de usuario ... 70
Tabla 17: Pruebas de Caja Blanca, Pruebas de funcionalidad ... 70
ÍNDICE DE FIGURAS
Figura 1: Cuota de mercado de los servidores web desde Agosto de 1995 hasta Noviembre de
2000 ... 13
Figura 2: Variabilidad en las resoluciones de pantalla ... 25
Figura 3: Funcionamiento del diseño adaptable ... 27
Figura 4: Botones ... 29
Figura 5: Organigrama Municipio de Tisaleo ... 42
Figura 6: Metodología de desarrollo ... 53
Figura 7: Diagrama de Caso de uso ... 61
Figura 8: Diagrama de clases ... 62
Figura 9: Diagrama de secuencia, Obtención de la Línea Base ... 62
Figura 10: Diagrama de secuencia, Registro de Gestión de procesos... 63
Figura 11: Diagrama de secuencias, Registro de Línea Base, Gestión de procesos, Usuarios y portal web ... 63
Figura 12: Modelo lógico y físico ... 64
Figura 13: Diseño de la base de datos ... 65
Figura 14: Fase de diseño, Formulario Login ... 65
Figura 15: Fase de Diseño, Formulario menú... 66
Figura 16: Fase de Diseño Formulario Línea Base ... 66
Figura 17: Fase de desarrollo, Formulario login ... 67
Figura 18: Fase de desarrollo, Formulario menú ... 67
Figura 19: Fase de desarrollo, Formulario línea base ... 68
Figura 20: Interfaz del Cpanel ... 72
Figura 21: Interfaz Bases de datos MySQL en Cpanel ... 72
Figura 22: Archivo de la base de datos a restaurar ... 73
Figura 23: Interfaz de PHPMyAdmin de Cpanel ... 73
Figura 24: Interfaz de PHPMyAdmin ... 74
Figura 25: Código de acceso al servidor de alojamiento ... 74
Figura 26: Interfaz de FileZilla ... 75
Figura 27: Proceso de Transferencia de archivos del Sistema al hosting... 75
Figura 28: Interfaz de Administrador de Archivos del Cpanel ... 76
Figura 29: Interfaz del Portal web ... 76
RESUMEN EJECUTIVO
El presente proyecto se enmarca en la línea de investigación Desarrollo de Software y Programación de Sistemas, se ha realizado en el consejo cantonal de protección de derechos del cantón Tisaleo (CCPDT), que es la entidad responsable de asegurar el pleno ejercicio de derechos, igualdad y no discriminación de niñas, niños, adolescentes, jóvenes, adultos y adultas mayores. Institución en la cual, la gestión de procesos no registra un adecuado seguimiento en la información generada, en base a eso se ha identificado la existencia de problemas en la gestión de información, además de disminuir los recursos humanos y materiales.
En una primera fase del proyecto se determinó los objetivos y justificación del proyecto, posteriormente se desarrolló el levantamiento bibliográfico sobre los temas referentes al objeto de investigación, determinando el estado del arte de las variables de la Investigación.
Posteriormente, se desarrolló la investigación de campo en la cual se determinó los procedimientos para gestionar los procesos, la comunicación, el seguimiento de denuncias, mismos que a pesar de utilizar documentos impresos, reuniones periódicas, se podría decir que actualmente la gestión es de forma manual provocando en algunas ocasiones retrasos en el cumplimiento.
ABSTRACT
The research line of this work is software development and systems programming. This work has been carried out in the council of protection of rights of Tisaleo (CCPDT). This institution is responsible for ensuring the exercise of rights, equality and non-discrimination to children, adolescents, young people, and elderly. The management of processes in this institution does not register an adequate follow-up and register on information. It has identified the existence of problems in the management of information, as well as the decrease of human and material resources.
In the first part of this Project, the objectives and justification were identified. Then a bibliographical study on the issues relating to the object of research was done, thus the state of the art for the research variables were determined.
After that, the development of the research was done by field research which identified processes, communication, and follow-up of complaints. Despite using printed documents, and meetings, the management is manually currently done causing delays in compliance sometimes.
1
INTRODUCCION
Antecedentes de la investigación
En la actualidad es necesario utilizar sistemas de automatización en cualquier institución, tanto pública como privada, por supuesto cumpliendo con todas las normas requeridas que permitan llevar de manera clara, concisa, fácil y adecuada el proceso a manejar. Decimos que la integridad de la información hoy en día es importante ya que no debe ser cambiado y es así como cualquier operación se puede hacer afirmando la seguridad de que los datos que se emiten sean confiables, ya que de otro modo nadie utilizaría los medios informáticos. El desarrollo de una aplicación colaborativa, nos sirve como base para la investigación elaborando consultas. Esta investigación tiene como objetivo determinar mediante una evaluación tan eficaz, confiabilidad, veracidad y rapidez. (Delgado, 2008)
La implementación de una aplicación colaborativa es factible porque se resolverán los problemas, de almacenamiento de los datos que permitirán al departamento manejar la información de las personas aplicadas. Se obtendrá reportes para la toma de decisiones oportuna y disminuirá el uso de recursos físicos. Una aplicación Colaborativa se refiere al conjunto de programas informáticos que integran el trabajo en un sólo proyecto, con muchos usuarios concurrentes, que se encuentran en diversas estaciones de trabajo, conectadas a través de una red (internet o intranet). (Freire Silva, 2016) (Geronimo & Canseco, 2002)
2
Situación problemática
El consejo cantonal de protección de derechos del cantón Tisaleo busca mejorar los servicios que ofrecen. Actualmente en el Ecuador, no existen instituciones que brinden sus servicios como lo es los sistemas de protección de derechos del consejo cantonal de protección de derechos del cantón Tisaleo que es la entidad responsable de asegurar el pleno ejercicio de derechos, igualdad y no discriminación de niñas, niños, adolescentes, jóvenes, adultos y adultas mayores.
El consejo cantonal de protección de derechos del cantón Tisaleo actualmente la gestión de procesos no ha sido automatizada, para obtener un mejor control de las actividades realizadas, y así un seguimiento de tiempos, materiales y recurso humano utilizado.
Dichos procesos, actualmente se lo hace de manera manual y se utiliza grandes cantidades de papel en la documentación generada, por lo que existen datos erróneos no controlados, duplicación de información y demoras en los datos los aspectos de seguridad han estado presentes en toda organización, en mayor o menor grado de manera que se necesita mecanismos de seguridad para precautelar la integridad física, de su personal o de su información.
Problema científico
¿Cómo mejorara la gestión de procesos del consejo cantonal de protección de derechos del cantón Tisaleo?
Objeto de investigación y campo de acción
Objeto de investigación: Aplicación colaborativa
3
Línea de investigación
Desarrollo de Software y Programación de sistemas
Objetivos
Objetivo General:
Implementar una aplicación colaborativa para la gestión de procesos del consejo cantonal de protección de derechos del cantón Tisaleo
Objetivo Específico:
Fundamentar científicamente los sistemas informáticos, sus herramientas de
desarrollo y procesos.
Diagnosticar todas las dificultades que se generan en el manejo de procesos
del consejo cantonal de protección de derechos del cantón Tisaleo.
Desarrollar una aplicación colaborativa para la gestión de procesos del consejo cantonal de protección de derechos del cantón Tisaleo.
Validar la propuesta.
Idea a defender
4
Justificación
El presente trabajo de investigación se desarrolla con la finalidad a la implementación de una aplicación colaborativa que contribuirá a mejorar la coordinación, y cooperación entre los miembros del consejo cantonal de protección de derechos del cantón Tisaleo, innovando la manera de trabajar en equipo; acortando las distancias y con la optimización de recursos, facilitando de esta forma el control de la información generada.
En el ámbito laboral no trabajan frecuentemente en entornos de trabajo colaborativo ya sea por desconocimiento o porque los equipos de trabajo no se acoplan adecuadamente a los procesos de trabajo existentes, ese vacío tratara de ser cubierto con el desarrollo de una aplicación colaborativa que permitirá incrementar la productividad de las personas, con el manejo óptimo de la información como un recurso elemental en un ambiente de trabajo virtual compartido que cuente con amplios recursos y agregue un mejor nivel de organización y cumplimiento .
5
CAPITULO I
1. MARCO TEORICO
1.1. Aplicación Colaborativa
El software colaborativo es una herramienta que permite mejorar la productividad de los grupos de trabajo, siempre y cuando exista una cultura de trabajo en grupo. La principal diferencia entre el software para workflow y el software colaborativo radica en la forma en que se coordina el trabajo en equipo. En el software para workflow, el trabajo es coordinado automáticamente por un programa de computadora, mientras que en el software colaborativo, la semántica de la interacción está a cargo de los usuarios. El software colaborativo que existe en el mercado incluye desde herramientas especiales de desarrollo, hasta aplicaciones diseñadas para grupos de trabajo específicos (Gonzalez Garcia & Priego Azcuaga, 2005).
A partir de la llegada de las computadoras personales al ambiente empresarial se inició una nueva revolución. Uno de los cambios más drásticos fue el incremento en la velocidad de procesamiento de los datos.
Desde los años 60s se tenía la necesidad de compartir recursos de cómputo, como la memoria, las unidades de almacenamiento y principalmente el procesador; pero no se compartía la información, ya que existían diferentes barreras que lo impedían, como las distancias entre oficinas o los diferentes sistemas operativos. Con la llegada de Internet algunas barreras se rompieron, con este avance tecnológico se logró compartir información pero no se podían realizar las actividades que necesitan colaboración, a partir de esta necesidad se comenzó a trabajar en un nuevo tipo de tecnología: el software colaborativo (Geronimo & Canseco, 2002).
6
de acometer los proyectos de diseño e implantación del sistema de información. Sin embargo, durante años, han quedado en un segundo plano la propia organización de la información y el tratamiento y gestión de los documentos. Aunque puede parecer contradictorio, lo cierto es que se ha puesto especial cuidado en los desarrollos tecnológicos y se ha descuidado la materia objeto de tratamiento, la información propiamente dicha (Garcia Moreno, 1998).
En la actualidad, las organizaciones se apresuran no sólo a seleccionar adecuadamente las herramientas de hardware, software y comunicaciones, sino también a preparar los procedimientos para la organización y tratamiento de la información. Hoy se habla de procesos de información y de negocio, porque ambos están estrechamente relacionados, y de su buena armonía depende, en muchos casos, el éxito frente a la competencia y el balance de su cuenta de resultados (Garcia Moreno, 1998).
La Web 2.0 es la siguiente generación Web en donde las aplicaciones son más interactivas. La Web 2.0 provee una plataforma para crear aplicaciones dinámicas, ricas e interactivas. El término Web 2.0 fue acuñado por O’Reilly Media y se refiere a una nueva generación de aplicaciones Web que provee participación, colaboración e interacción en línea a los usuarios. En general, las estas aplicaciones actuales intentan ser más dinámicas y se caracterizan como “comunidades sociales” donde del mayor énfasis se da a la contribución y participación de los usuarios (Ramirez Velarded, 2009).
7
La aplicación colaborativa es un sistema de cómputo que permiten a usuarios trabajar de forma virtual, en el cual comparten información entre sí de manera ordenada y controlada. Así mismo permiten a instituciones, en general que cualquier persona que tenga acceso a estas herramientas, crear entornos de trabajo virtuales, en donde usuarios en diferentes lugares de locales o internacionales, puedan trabajar de manera conjunta a través de Internet.
1.1.1. Tipos de Colaboración
Dentro de este tipo de software colaborativo o aplicación colaborativa se encuentra: el Groupware y el Workflow, ya que estas tecnologías son comúnmente utilizadas dentro del ámbito empresarial, se analizará primero el software colaborativo Groupware y después nos centraremos en el Workflow, sobre el cual enfocaremos nuestra atención (Geronimo & Canseco, 2002).
Groupware
El Groupware es un tipo de software colaborativo que ayuda a grupos de trabajo a realizar sus actividades a través de una red. Formalmente se puede definir al groupware de la siguiente manera:
"Sistemas basados en computadoras que apoyan a grupos de personas que trabajan en una tarea común y que proveen una interfaz para un ambiente compartido. (Geronimo & Canseco, 2002)"
Las características más importantes de los groupware son:
Proveer de un ambiente de colaboración, en el que realmente se perciba que
el trabajo en grupo se lleva a cabo.
Mantener la información en un solo sitio común para todos los miembros.
8
Los groupware se pueden clasificar en base a: tiempo y espacio. En base al
tiempo se clasifican en sincrónicos y asincrónicos; y en base al espacio, pueden estar en el mismo lugar o en forma distribuida.
Las aplicaciones típicas de los groupware sincrónicos (los cuales soportan aplicaciones en tiempo real) son: pizarrones compartidos, teleconferencia, chat y sistemas de toma de decisiones. Algunos ejemplos de aplicaciones típicas de los groupware asincrónicos son: e-mail, newsgroups, calendarios y sistemas de escritura colaboracionales (Geronimo & Canseco, 2002).
Workflow
Los Workflows son sistemas que ayudan a administrar y automatizar procesos de negocios. Un workflow puede ser descrito como el flujo y control en un proceso de negocio. La WfMC (Workflow Management Coalition) definea los workflows Como:
"La automatización de un proceso de negocio, total o parcial, en la cual documentos, información o tareas son pasadas de un participante a otro a los efectos de su procesamiento, de acuerdo a un conjunto de reglas establecidas (Geronimo & Canseco, 2002)."
También definen lo que es un proceso de negocio:
"Es un conjunto de uno o más procedimientos o actividades directamente ligadas, que colectivamente realizan un objetivo del negocio, normalmente dentro del contexto de una estructura organizacional que define roles funcionales y relaciones entre los mismos”
9
Las funciones más comunes que proporcionan los workflows son:
Asignación de tareas al personal. Aviso al personal de tareas pendientes.
Permitir la colaboración en las tareas comunes.
Optimización de recursos humanos y técnicos, alineándolos a la estrategia de
la empresa.
Automatización de las secuencias de los procesos de negocio y optimización
de las mismas.
Agilización de los procesos de negocio y como resultado un mejor servicio al
cliente.
Control y seguimiento de dichos procesos.
1.1.2. Programas informáticos colaborativos
Un entorno colaborativo se puede construir utilizando aplicaciones, herramientas y API Web 2.0 existentes siempre y cuando apoyen algún elemento del aprendizaje colaborativo. La comparación que ahora se muestra se basa en las posibilidades que tienen las herramientas comparadas para apoyar diversos elementos del aprendizaje colaborativo (Ramirez Velarded, 2009).
Actualmente existen literalmente miles de herramientas y aplicaciones Web 2.0 disponibles en la Internet. Estas pueden clasificarse en: Publicidad, Blogging, Bookmarks, Catálogos, Chat, Comunidades, Colaborativas, Educativas, Correo, Eventos, News Feeds, Búsqueda, Compras, Etiquetamiento (Tagging), Video, Widgets y Wiki. Basándose en los elementos del aprendizaje colaborativo y su potencial para la educación, la lista se ha reducido un poco a categorías que son potencialmente útiles para el aprendizaje colaborativo (Ramirez Velarded, 2009).
Tipos de Herramientas Web 2.0 para Aprendizaje Colaborativo:
Blogging
10
Community
Collaborative Education
Management
Project Management
RSS Feeds
Tagging Wiki
Dado que hay literalmente una innumerable cantidad de aplicaciones Web 2.0 disponibles en la Internet, es difícil simplemente alguna de ellas para implantar programas educativos (Ramirez Velarded, 2009).
Por este mismo, es indispensable establecer un criterio de selección:
Soporte para comunicación y colaboración entre los participantes.
Nivel de soporte para evaluar el nivel de participación de grupos e individuos.
Número de actividades Web 2.0 y herramientas que se soportan.
Que sea de código libre con licencia GPL y que sea libre de usar y modificar. Calidad del API Web 2.0, incluyendo soporte.
Buena documentación y guías para usuarios y desarrolladores.
Interfaz de usuario rica con buen diseño Basándose en los criterios anteriormente mencionados se seleccionaron 12 herramientas y aplicaciones como posibles candidatos para usarse en aprendizaje colaborativo y compartición de objetos de aprendizaje.
11
trabajo de configuración. En la siguiente sección se listan las herramientas (Ramirez Velarded, 2009).
1.2. Aplicaciones Web
Inicialmente la web era simplemente una colección de páginas estáticas, documentos, que podían consultarse o descargarse. El siguiente paso en su evolución fue la inclusión de un método para confeccionar páginas dinámicas que permitiesen que lo mostrado fuese dinámico (generado o calculado a partir de los datos de la petición). Dicho método fue conocido como CGI (common Gateway interface) y definía un mecanismo mediante el cual podíamos pasar información entre el servidor HTTP y programas externos (Mateu, 2004).
Los CGI siguen siendo muy utilizados, puesto que la mayoría de los servidores web los soportan debido a su sencillez. Además, nos proporcionan total libertad a la hora de escoger el lenguaje de programación para desarrollarlos.
El esquema de funcionamiento de los CGI tenía un punto débil: cada vez que recibíamos una petición, el servidor web lanzaba un proceso que ejecutaba el programa CGI.
Como, por otro lado, la mayoría de CGI estaba escritos en algún lenguaje interpretado (Perl, Python, etc.) o en algún lenguaje que requería run-time environment (VisualBasic, Java, etc.), esto implicaba una gran carga para la máquina del servidor. Además, si la web tenía muchos accesos al CGI, esto suponía problemas graves (Mateu, 2004).
1.2.1. Apache
12
Group, cientos de personas han contribuido al proyecto con código, ideas y documentación (Mateu, 2004).
Con independencia de si el lector es un administrador de sistemas o un desarrollador de software, es necesario que conozca que nos estamos refiriendo a algo más que un simple servidor web. El proyecto Apache se realiza en un gran esfuerzo de colaboración de desarrollo de software poniendo a nuestra disposición el código fuente de un servidor HTTP. El proyecto se realiza por una serie de voluntarios localizados alrededor del mundo, utilizando Internet como herramienta de comunicación, organización y desarrollo, así como toda la documentación relacionada. A estos voluntarios se les conoce como el Grupo Apache. Además cientos de usuarios siguen contribuyendo con ideas código y documentación al proyecto (Egea, 2000).
1.2.2. El nacimiento de Apache
En febrero de 1995 el servidor web más utilizado era el creado por el NCSA (National Center for Super Computing Applications) en la Universidad de Illinois. Sin embargo, este proyecto cayó pronto en olvido y muchos webmasters habían desarrollado sus propias extensiones encontrándose con muchos problemas que se iban resolviendo poco a poco (Egea, 2000).
Esto originó que un grupo de estos webmasters a través del correo electrónico se reunieran para coordinar los cambios que iban realizando a modo de parches, compartiendo toda la información creando un punto de encuentro como lista de envío en California Bay Area, naciendo así a finales de febrero el Grupo Apache, formado por ocho miembros: Brian Behlendorf, Roy T. Fielding, Rob Hartill, David Robinson, Cliff Skolnick, Randy Terbush, Robert S. Thau, Andrew Wilson.
13
Apache se produjo en abril de 1995. Desde ese momento el producto resultante fue sufriendo continuas modificaciones, adaptándose a la mayor parte de los sistemas operativos. Fueron continuos sus cambios de funcionamiento y de planteamiento. En menos de un año desde su aparición el servidor Apache pasó a ser el servidor número uno en Internet (Egea, 2000).
El servidor más utilizado
Uno de los grandes argumentos que utilizan los usuarios de Apache es que es el servidor más utilizado en la web a nivel mundial. Según un estudio realizado por la consultoría de Internet Netcraft, Apache es usado en un 40% más que su más inmediato competidor actualmente (Internet Information Server de Microsoft).
Figura 1: Cuota de mercado de los servidores web desde Agosto de 1995 hasta Noviembre de 2000 Fuente: (Egea, 2000)
Elaborado por: Francisco Javier Egea
14
1.2.3. Instalación de Apache
Tenemos dos opciones principales para instalar Apache: podemos compilar el código fuente o podemos instalarlo a partir de un paquete binario adecuado a nuestro sistema operativo (Mateu, 2004).
1.2.4. Mysql
MySQL HA CRECIDO. Lo que durante un tiempo se consideró como un sencillo juguete para su uso en sitios Web, se ha convertido en la actualidad en una solución viable y de misión crítica para la administración de datos. Antes, MySQL se consideraba como la opción ideal para sitios Web; sin embargo, ahora incorpora muchas de las funciones necesarias para otros entornos y conserva su gran velocidad. MySQL supera desde hace tiempo a muchas soluciones comerciales en velocidad y dispone de un sistema de permisos elegante y potente, y ahora, además, la versión 4 incluye el motor de almacenamiento InnoDB compatible con ACID (Gilfillan, 2003).
MySQL 4 es rápido, dispone de funciones de volcado online e incorpora una gran cantidad de funciones nuevas. Son pocas las razones para desechar MySQL como solución de base de datos. MySQL AB, la compañía responsable del desarrollo de MySQL, dispone de un sistema de asistencia eficiente y a un precio razonable, y, como ocurre con la mayor parte de las comunidades de código abierto, encontrara una gran cantidad de ayuda en la Web. Las funciones estándar no incluidas todavía en MySQL (corno las vistas y 10s procedimientos almacenados) están en fase de desarrollo y es posible que estén disponibles para cuando lea estas líneas (Gilfillan, 2003).
Son muchas las razones para escoger MySQL como solución de misión crítica para la administración de datos.
15
Asistencia: MySQL AB ofrece contratos de asistencia a precios razonables y
existe una nutrida y activa comunidad MySQL.
Velocidad: MySQL es mucho más rápido que la mayor parte de sus rivales.
Funcionalidad: MySQL dispone de muchas de las funciones que exigen los
desarrolladores profesionales, como compatibilidad completa con ACID, compatibilidad para la mayor parte de SQL ANSI, volcados online, duplicación, funciones SSL e integración con la mayor parte de los entornos de programación. Así mismo, se desarrolla y actualiza de forma mucho más rápida que muchos de sus rivales, por lo que prácticamente todas las funciones estándar de MySQL todavía no están en fase de desarrollo.
Portabilidad: MySQL se ejecuta en la inmensa mayoría de sistemas operativos
y, la mayor parte de los casos, los datos se pueden transferir de un sistema a otro sin dificultad.
Facilidad de uso: MySQL resulta fácil de utilizar y de administrar. Gran parte de
las viejas bases de datos presentan problemas por utilizar sistemas obsoletos, lo que complica innecesariamente las tareas de administración. Las herramientas de MySQL son potentes y flexibles, sin sacrificar su capacidad de uso (Gilfillan, 2003).
Historia de MySQL
16
La derivación del nombre MySQL no está clara. Nuestro directorio base y un gran número de nuestras bibliotecas y herramientas han tenido el prefijo "my" por más de 10 años. Sin embargo, la hija del cofundador Monty Widenius también se llama My. Cuál de los dos dió su nombre a MySQL todavía es un misterio, incluso para nosotros.
El nombre del delfín de MySQL (nuestro logo) es "Sakila", que fue elegido por los fundadores de MySQL AB de una gran lista de nombres sugerida por los usuarios en el concurso "Name the Dolphin" (ponle nombre al delfín). El nombre ganador fue enviado por Ambrose Twebaze, un desarrollador de software Open Source de Swaziland, África. Según Ambrose, el nombre femenino de Sakila tiene sus raíces en SiSwate, el idioma local de Swaziland. Sakila también es el nombre de una ciudad en Arusha, Tanzania, cerca del país de origen de Ambrose, Uganda (Nipotti, 2014).
Estabilidad de MySQL
Esta sección trata las preguntas "¿Qué estabilidad tiene MySQL Server?" y, "¿Puedo fiarme de MySQL Server para este proyecto?" Intentaremos clarificar estas cuestiones y responder algunas preguntas importantes que preocupan a muchos usuarios potenciales. La información en esta sección se basa en datos recopilados de las listas de correo, que son muy activas para identificar problemas así como para reportar tipos de usos (Nipotti, 2014).
17
Cada versión de MySQL Server ha sido usable. Los problemas han ocurrido únicamente cuando los usuarios han probado código de las "zonas grises". Naturalmente, los nuevos usuarios no conocen cuáles son estas zonas; esta sección, por lo tanto, trata de documentar dichas áreas conocidas a día de hoy.
1.2.5. JavaScript
Javascript es un lenguaje de programación interpretado (un lenguaje de tipo script). A pesar de que existen intérpretes no dependientes de ningún navegador, es un lenguaje de script que suele encontrarse vinculado a páginas web. Javascript y Java son dos lenguajes de programación distintos con filosofías muy diferentes. El único punto en común es la sintaxis, ya que cuando Netscape diseñó Javascript, se inspiró en la sintaxis de Java (Mateu, 2004).
Elementos básicos de Javascript
Las sentencias de Javascript terminan en; (igual que en C y Java) y se pueden agrupar por bloques delimitados por { y }.
Otro punto que conviene tener presente es que los símbolos (nombres de variables, funciones, etc.) son sensibles a cambios de mayúsculas/ minúsculas (Mateu, 2004).
Palabras Reservadas
18
1.2.6. Php
PHP, cuyas siglas responden a un acrónimo recursivo (PHP: hypertext preprocessor), es un lenguaje sencillo, de sintaxis cómoda y similar a la de otros lenguajes como Perl, C y C++. Es rápido, interpretado, orientado a objetos y multiplataforma. Para él se encuentra disponible una multitud de librerías. PHP es un lenguaje ideal tanto para aprender a desarrollar aplicaciones web como para desarrollar aplicaciones web complejas. PHP añade a todo eso la ventaja de que el intérprete de PHP, los diversos módulos y gran cantidad de librerías desarrolladas para PHP son de código libre, con lo que el programador de PHP dispone de un impresionante arsenal de herramientas libres para desarrollar aplicaciones (Mateu, 2004).
PHP suele ser utilizado conjuntamente con Perl, Apache, MySQL o PostgreSQL en sistemas Linux, formando una combinación barata (todos los componentes son de código libre), potente y versátil. Tal ha sido la expansión de esta combinación que incluso ha merecido conocerse con un nombre propio LAMP (formado por las iniciales de los diversos productos).
Apache, así como algunos otros servidores web, Roxen entre ellos, puede incorporar PHP como un módulo propio del servidor, lo cual permite que las aplicaciones escritas en PHP resulten mucho más rápidas que las aplicaciones CGI habituales (Mateu, 2004).
Páginas estáticas
19
Páginas dinámicas
Por el contrario, las páginas que incluyen código escrito en lenguaje PHP, nos dan la oportunidad de personalizar su contenido sobre la base de ciertas órdenes escritas (como en el ejemplo anterior de la fecha, la página hoy mostrará una fecha y mañana otra, y así sucesivamente; es decir: siempre generará un contenido distinto, variable).
El contenido de esas páginas, al menos en partes de ellas, cambiará y no será siempre el mismo, ya que dependerá de la información que obtenga el software de PHP y coloque en ellas. Serán páginas dinámicas (Beati, 2010).
Las bases de datos
El concepto de páginas dinámicas que acabamos de esbozar, se complementa a la perfección con las bases de datos, ya que éstas se ocupan de almacenar datos y, las páginas dinámicas, de leerlos y mostrarlos dentro de ellas.
1.2.7. Ajax
El método XMLHttpRequest (XHR) permite a los navegadores comunicarse con el servidor sin la necesidad de recargar la página. Este método, también conocido como Ajax (Asynchronous JavaScript and XML), permite la creación de aplicaciones ricas en interactividad (Murphey, 2013).
Las peticiones Ajax son ejecutadas por el código JavaScript, el cual envía una petición a una URL y cuando recibe una respuesta, una función de devolución puede ser ejecutada la cual recibe como argumento la respuesta del servidor y realiza algo con ella. Debido a que la respuesta es asíncrona, el resto del código de la aplicación continua ejecutándose, por lo cual, es imperativo que una función de devolución sea ejecutada para manejar la respuesta.
20
cuestión son $.get(), $.getScript(), $.getJSON(), $.post() y $().load(). A pesar que la definición de Ajax posee la palabra “XML”, la mayoría de las aplicaciones no utilizan dicho formato para el transporte de datos, sino que en su lugar se utiliza HTML plano o información en formato JSON (JavaScript Object Notation) (Murphey, 2013).
En general, Ajax no trabaja a través de dominios diferentes. Sin embargo, existen excepciones, como los servicios que proveen información en formato JSONP (JSON with Padding), los cuales permiten una funcionalidad limitada a través de diferentes dominios.
Conceptos Clave
La utilización correcta de los métodos Ajax requiere primero la comprensión de algunos conceptos clave (Murphey, 2013).
GET vs. POST
Los dos métodos HTTP más comunes para enviar una petición a un servidor son GET y POST. Es importante entender la utilización de cada uno. El método GET debe ser utilizado para operaciones no-destructivas es decir, operaciones en donde se está “obteniendo” datos del servidor, pero no modificando. Por ejemplo, una consulta a un servicio de búsqueda podría ser una petición GET. Por otro lado, las solicitudes GET pueden ser almacenadas en la cache del navegador, pudiendo conducir a un comportamiento impredecible si no se lo espera (Murphey, 2013).
21
Tipos de Datos
Generalmente, jQuery necesita algunas instrucciones sobre el tipo de información que se espera recibir cuando se realiza una petición Ajax. En algunos casos, el tipo de dato es especificado por el nombre del método, pero en otros casos se lo debe detallar como parte de la configuración del método (Murphey, 2013):
text Para el transporte de cadenas de caracteres simples.
html Para el transporte de bloques de código HTML que serán ubicados en la
página.
script Para añadir un nuevo script con código JavaScript a la página.
json Para transportar información en formato JSON, el cual puede incluir cadenas de caracteres, vectores y objetos.
Es recomendable utilizar los mecanismos que posea el lenguaje del lado de servidor para la generación de información en formato JSON.
jsonp Para transportar información JSON de un dominio a otro.
xml Para transportar información en formato XML.
A pesar de los diferentes tipos de datos de que se puede utilizar, es recomendable utilizar el formato JSON, ya que es muy flexible, permitiendo por ejemplo, enviar al mismo tiempo información plana y HTML (Murphey, 2013).
1.2.8. CSS
CSS es un lenguaje de hojas de estilos creado para controlar el aspecto o presentación de los documentos electrónicos definidos con HTML y XHTML. CSS es la mejor forma de separar los contenidos y su presentación y es imprescindible para crear páginas web complejas. Separar la definición de los contenidos y la definición de su aspecto presenta numerosas ventajas, ya que obliga a crear documentos HTML/XHTML bien definidos y con significado completo (también llamados "documentos semánticos") (Eguíluz Pérez, 2008).
22
dispositivos diferentes. Al crear una página web, se utiliza en primer lugar el lenguaje HTML/XHTML para marcar los contenidos, es decir, para designar la función de cada elemento dentro de la página: párrafo, titular, texto destacado, tabla, lista de elementos.
Una vez creados los contenidos, se utiliza el lenguaje CSS para definir el aspecto de cada elemento: color, tamaño y tipo de letra del texto, separación horizontal y vertical entre elementos, posición de cada elemento dentro de la página (Eguíluz Pérez, 2008).
1.2.9. Breve historia de CSS
Las hojas de estilos aparecieron poco después que el lenguaje de etiquetas SGML, alrededor del año 1970. Desde la creación de SGML, se observó la necesidad de definir un mecanismo que permitiera aplicar de forma consistente diferentes estilos a los documentos electrónicos (Eguíluz Pérez, 2008).
El gran impulso de los lenguajes de hojas de estilos se produjo con el boom de Internet y el crecimiento exponencial del lenguaje HTML para la creación de documentos electrónicos. La guerra de navegadores y la falta de un estándar para la definición de los estilos dificultaban la creación de documentos con la misma apariencia en diferentes navegadores (Eguíluz Pérez, 2008).
El organismo W3C (http://www.w3.org/) (World Wide Web Consortium), encargado de crear todos los estándares relacionados con la web, propuso la creación de un lenguaje de hojas de estilos específico para el lenguaje HTML y se presentaron nueve propuestas. Las dos propuestas que se tuvieron en cuenta fueron la CHSS (Cascading HTML Style Sheets) y la SSP (Stream-based Style Sheet Proposal).
23
En 1995, el W3C decidió apostar por el desarrollo y estandarización de CSS y lo añadió a su grupo de trabajo de HTML. A finales de 1996, el W3C publicó la primera recomendación oficial, conocida como "CSS nivel 1".
1.2.10. Soporte de CSS en los navegadores
El trabajo del diseñador web siempre está limitado por las posibilidades de los navegadores que utilizan los usuarios para acceder a sus páginas. Por este motivo es imprescindible conocer el soporte de CSS en cada uno de los navegadores más utilizados del mercado. Internamente los navegadores están divididos en varios componentes (Eguíluz Pérez, 2008).
La parte del navegador que se encarga de interpretar el código HTML y CSS para mostrar las páginas se denomina motor. Desde el punto de vista del diseñador CSS, la versión de un motor es mucho más importante que la versión del propio navegador. La siguiente tabla muestra el soporte de CSS 1, CSS 2.1 y CSS 3 de los cuatro navegadores más utilizados por los usuarios:
Navegador Motor CSS 1 CSS 2.1 CSS 3
Internet Explorer Trident Completo desde la versión 6.0
Casi completo desde la versión 7.0
Prácticamente Nulo
Firefox Gecko Completo Casi Completo Selectores,
pseudo-clases y algunas
propiedades
Safari Webkit Completo Casi Completo Todos los
selectores, pseudo-clases y muchas
propiedades
Opera Presto Completo Casi Completo Todos los
selectores, pseudo-clases y muchas
propiedades
Google Chrome Webkit Completo Casi Completo Todos los
selectores, pseudo-clases y muchas
propiedades Tabla 1: Soporte de CSS en los navegadores
24
Los navegadores Safari y Opera son los más avanzados en el soporte de CSS, ya que incluyen muchos elementos de la futura versión CSS 3 y un soporte casi perfecto de la actual versión 2.1. El navegador Firefox no tiene un soporte tan avanzado de CSS 3 pero las últimas versiones están alcanzando rápidamente a Safari y Opera (Eguíluz Pérez, 2008).
1.3. Bootstrap
1.3.1. Introducción al diseño "responsive"
El diseño web responsive, adaptable o adaptativo, conocido por las siglas RWD (del inglés, Responsive Web Design) es una filosofía de diseño y desarrollo cuyo objetivo es adaptar la apariencia de las páginas web al dispositivo que se esté utilizando para visualizarla. Hoy día las páginas web se visualizan en multitud de tipos de dispositivos como tabletas, smartphones, libros electrónicos, portátiles, PCs (Gallego Sanchez, 2017).
Esta tecnología pretende que con un solo diseño web tengamos una visualización adecuada en cualquier dispositivo. El diseño responsive se basa en proporcionar a todos los usuarios de una web los mismos contenidos y una experiencia de usuario lo más similar posible, frente a otras aproximaciones al desarrollo web móvil como la creación de apps, el cambio de dominio o webs servidas dinámicamente en función del dispositivo.
Aunque todas tienen pros y contras, la web responsive es considerada por muchos expertos como la mejor práctica posible, al unificar la web, reducir tiempos de desarrollo y ofrecer grandes ventajas para SEO móvil (Gallego Sanchez, 2017).
1.3.2. Variabilidad en las resoluciones de pantalla
25
resoluciones, no solo en pantallas de ordenadores de escritorio sino también para tablets y dispositivos móviles (Gallego Sanchez, 2017).
Figura 2: Variabilidad en las resoluciones de pantalla Fuente: (Gallego Sanchez, 2017)
Elaborado por: Antonio Javier Gallego Sanchez
Es muy importante conocer todas estas estadísticas así como cuales son las dimensiones de pantalla de los usuarios, a qué público vamos dirigidos, etc. y así poder tenerlo en cuenta en la usabilidad de nuestra web. Ya no es posible centrar el desarrollo pensando que los usuarios van a tener (en un alto porcentaje) una única resolución de pantalla.
Desde hace ya unos años en el desarrollo web se ha sustituido en cierta medida el problema de la compatibilidad de navegadores (gracias a que poco a poco todas las compañías se están ciñendo a los estándares con HTML5/CSS3 y otras se basan directamente en web-kit) por el problema de las resoluciones de los dispositivos (Gallego Sanchez, 2017).
26
Resolución % utilización
>1920x1080 34%
1920x1080 13%
1366x768 31%
1280x1024 8%
1280x800 7%
1024x768 6%
800x600 0.5%
<800x600 0.5%
Tabla 2: Resoluciones de pantalla más utilizadas Fuente: (Gallego Sanchez, 2017)
Elaborado por: Alex Silva
En la actualidad ya no es 1024x768 la resolución más utilizada, sino que es 1366×768 y resoluciones superiores a 1920x1080. Es fundamental tener en cuenta que en el diseño responsive, al variar tanto las posibles resoluciones en las que se verá nuestra web deberemos mostrar en primer lugar los contenidos más importantes e imprescindibles (Gallego Sanchez, 2017).
1.3.3. Funcionamiento del diseño adaptable
El diseño responsive se basa en adaptar dinámicamente el diseño web en función de la resolución de la pantalla del visitante. De esta forma adaptamos nuestras webs a dispositivos móviles sin necesidad de tener dos sitios separados y al mismo tiempo también podemos adaptar la web a resoluciones grandes para mejorar la experiencia de usuario (Gallego Sanchez, 2017).
27 Figura 3: Funcionamiento del diseño adaptable
Fuente: (Gallego Sanchez, 2017)
Elaborado por: Antonio Javier Gallego Sanchez
La solución técnica que se le ha dado en el desarrollo web al problema de esta diversidad de resoluciones web se llama Responsive Web Design y nos permite hacer interfaces adaptadas al entorno del usuario mediante estructuras, bloques, columnas e imágenes fluidas gracias a media-queries de CSS (Gallego Sanchez, 2017).
A partir de CSS 2.1 las hojas de estilo han incluido los media types, lo cual nos ha facilitado, por ejemplo, proveer un estilo distinto para el diseño de impresión:
<link rel="stylesheet" type="text/css" href="core.css" media="screen" />
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
A partir de CSS 3 el W3C creó las media queries. Una media query nos permite apuntar no sólo a ciertas clases de dispositivos, sino realmente inspeccionar las características físicas del dispositivo que está rende rizando nuestro trabajo (Gallego Sanchez, 2017).
28 <link rel="stylesheet" type="text/css" href="shetland.css"
media="screen and (max-device-width: 480px)" />
La query contiene dos componentes:
Un media type (screen, print o all). La consulta entre paréntesis, conteniendo una característica a inspeccionar (maxdevice- width o min-device-width) seguida por el valor al que apuntamos (480px). También es posible utilizarlas directamente en el CSS como parte de una regla (Gallego Sanchez, 2017).
@media :
@media screen and (max-device-width: 480px) {
.column {
float: none;
}
}
Por ejemplo, si quisiéramos crear un estilo de bloques fluidos que para pantallas grandes se muestre uno a continuación del otro y para pantallas cambie a mostrarse de forma apilada, uno encima de otro, podríamos hacer algo como:
@media all and (max-width: 800px) {
.bloque{
display: block !important;
/* Cuando el ancho sea inferior a 800px el elemento será un bloque */
width: auto !important;
}
}
.bloque {
display: inline-block; /* Para que se muestren los bloques en línea */
height:300px;
width: 300px;
border:1px solid #333;
background: #999;
margin:20px;
29
Botones
Mediante la clase .btn podemos aplicar estilo a los elementos tipo button. Esta clase la podemos combinar con default , primary , success , .btn-info , .btnwarning , .btn-danger , .btn-link para crear botones para diferentes estados o acciones en nuestros formularios (Gallego Sanchez, 2017):
Figura 4: Botones
Fuente: (Gallego Sanchez, 2017)
Elaborado por: Antonio Javier Gallego Sanchez
El código HTML que tendríamos que escribir para conseguir estos botones es el siguiente:
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-link">Link</button>
1.4. Herramientas de Desarrollo
1.4.1. Dreamweaver
Macromedia Dreamweaver es un editor de código HTML profesional para el diseño visual y la administración de sitios y páginas Web. Tan si prefiere controlar manualmente el código HTML como si prefiere trabajar en un entorno de edición visual, Dreamweaver le permite ponerse manos a la obra rápidamente y le facilita herramientas útiles para mejorar su experiencia en diseño Web (McGinn, 2000).
30
código (la vista de Código y el inspector de código) que permiten editar JavaScript, XML y otros documentos de texto directamente en Dreamweaver. La tecnología Roundtrip HTML de Macromedia importa documentos HTML sin necesidad de cambiar el formato del código y, además, es posible configurar Dreamweaver para limpiar y cambiar el formato HTML cuando lo desee.
Las funciones de edición visual de Dreamweaver también le permiten añadir diseño y funcionalidad rápidamente sin escribir una sola línea de código. Puede ver todos los elementos o activos del sitio y arrastrarlos desde un panel fácil de usar directamente hasta un documento. Agilice su flujo de trabajo de desarrollo mediante la creación y edición de imágenes en Macromedia Fireworks y su importación directa a Dreamweaver, o bien añadiendo objetos Flash que puede crear directamente en Dreamweaver (McGinn, 2000).
Dreamweaver se puede personalizar totalmente. Utilice Dreamweaver para crear sus propios objetos y comandos, modificar métodos abreviados de teclado e incluso escribir código JavaScript para ampliar las posibilidades que ofrece Dreamweaver con nuevos comportamientos, inspectores de propiedades e informes de sitios.
Requisitos del sistema
Para ejecutar Dreamweaver, es preciso disponer del hardware y el software siguientes (McGinn, 2000).
Para Microsoft Windows:
Un procesador Intel Pentium o equivalente a 166 MHz o más rápido que ejecute Windows 95, Windows 98, Windows 2000, Windows Me o Windows NT (con Server Pack 3).
31
Un monitor de 256 colores con capacidad para mostrar una resolución de 800 x 600 píxeles.
Una unidad de CD-ROM.
Para Macintosh:
Un Power Macintosh con Mac OS 8,6 ó 9.x.
32 MB de memoria de acceso aleatorio (RAM), además de 135 MB de espacio libre en el disco duro.
Un monitor de 256 colores con capacidad para mostrar una resolución de 800x 600 píxeles.
Una unidad de CD-ROM.
1.5. Gestión de Procesos
La gestión de procesos con base en la visión sistémica apoya el aumento de la productividad y el control de gestión para mejorar en las variables clave, por ejemplo, tiempo, calidad y costo. Aporta conceptos y técnicas, tales como integralidad, compensadores de complejidad, teoría del caos y mejoramiento continuo, destinados a concebir formas novedosas de cómo hacer los procesos (Carrasco, 2008).
Ayuda a identificar, medir, describir y relacionar los procesos, luego abre un abanico de posibilidades de acción sobre ellos: describir, mejorar, comparar o rediseñar, entre otras. Considera vital la administración del cambio, la responsabilidad social, el análisis de riesgos y un enfoque integrador entre estrategia, personas, procesos, estructura y tecnología (Carrasco, 2008).
32
“flecha del tiempo”. El período de tiempo es hoy el punto crítico de trabajo para incrementar la productividad (Carrasco, 2008).
Un proceso puede ser definido como un conjunto de actividades interrelacionadas entre sí que, a partir de una o varias entradas de materiales o información, dan lugar a una o varias salidas también de materiales o información con valor añadido.
En otras palabras, un proceso es la manera en la que se hacen las cosas en la empresa. Ejemplos de procesos son el de producción y entrega de bienes y/o servicios, el de gestión comercial, el de desarrollo de la visión estrategia, el de desarrollo de producto, Estos procesos deben estar correctamente gestionados empleando distintas herramientas de la gestión de procesos (Maldonado, 2011).
La incorporación de las nuevas tecnologías de la información permite redefinir los procesos alcanzando grados de eficacia y eficiencia inimaginables hace unos años. Las organizaciones que sean capaces de descubrir estas posibilidades e implantarlas correctamente, conseguirán ventajas competitivas debido a la disminución de costes y el aumento de flexibilidad frente a los requerimientos de los clientes.
33
Identificación de procesos
Hacemos aquí una distinción entre tres tipos de procesos: estratégicos, del negocio y de apoyo.
Procesos estratégicos
Los procesos estratégicos son aquellos relacionados con la estrategia de la Organización, considera:
La forma como se establece la visión, misión, valores, directrices funcionales, objetivos corporativos, departamentales y personales y el programa de acción entre otros componentes.
La forma como se monitorea el cumplimiento de los objetivos, la definición de
indicadores y como se mantienen actualizados.
La forma de mantener actualizadas las definiciones estratégicas.
La forma como se comunica la estrategia y la forma de motivar a todos los
integrantes de la organización en lograr sus definiciones, entre otros temas relacionados (Carrasco, 2008).
Procesos del negocio
Los procesos del negocio atienden directamente la misión del negocio y satisfacen necesidades concretas de los clientes. En empresas pequeñas se estima razonable identificar entre 1 y 3 de estos macroprocesos; en empresas grandes este número puede llegar a 8. Estas cantidades también tienen relación con el grado de focalización de la organización, mientras más focalizada se encuentre, menor es el número de procesos del negocio (Carrasco, 2008).
Veamos algunos ejemplos de procesos del negocio en diferentes empresas: En una empresa de confección de vestuario a pedido:
34
Diseño de productos: búsqueda de ideas, preparación de los modelos,
prototipos, matrices para la producción. En una agencia de aduanas:
Importaciones, desde el contacto con el cliente hasta entregarle el embarque. Exportaciones, desde tomar la carga en las oficinas del cliente hasta la Entrega en el punto de destino, pasando por facturación, cobranza e interacción con otras instituciones.
En una empresa constructora:
Construcción de obras, desde la captación del cliente hasta el servicio pos entrega.
Servicios de corte y perforación de estructuras. Desde el diagnóstico hasta la verificación de calidad del servicio, pasando por todas las actividades de realización del mismo. En general, los procesos del negocio están asociados a los productos o servicios que presta una organización (Carrasco, 2008).
Procesos de apoyo
Los procesos de apoyo son servicios internos necesarios para realizar los procesos del negocio. También se les llama procesos secundarios. En empresas pequeñas es fácil identificar hasta unos 20 procesos de apoyo, los que pueden llegar hasta 400 en grandes organizaciones, sin considerar las diferentes versiones de cada uno (Carrasco, 2008).
Por ejemplo:
Compra de artículos de oficina Pago de anticipos
Pago de remuneraciones
Declaración y pago de impuestos
Servicios de alimentación Impresión de formularios
35
Requisitos básicos de un proceso clave o relevante
Todos los procesos deben tener un responsable designado que asegure su
cumplimiento y eficacia continuados.
Todos los procesos claves y relevantes tienen que ser capaces de satisfacer
los ciclos PDCA del siguiente gráfico.
Todos los procesos tienen que tener indicadores que permitan visualizar de forma gráfica la evolución de los mismos. Tienen que ser planificados en la fase P, tienen que asegurarse su cumplimiento en la fase D, tienen que servir para realizar el seguimiento en la fase C y tiene que utilizarse en la fase A para ajustar y/o establecer objetivos (Maldonado, 2011).
Todos los procesos tienen que ser auditados para verificar el grado de cumplimiento y eficacia de los mismos. Para esto es necesario documentarlos mediante procedimientos.
Es recomendable planificar y realizar periódicamente (aproximadamente tres años) una reingeniería de los procesos de gestión, claves y relevantes para alcanzar mejoras espectaculares en determinados parámetros como costes, calidad, servicio y rapidez de respuesta (Maldonado, 2011).
Puntos de intervención sobre los procesos
36
Describir los procesos
Un objetivo deseable es tener procesos documentados, actualizados y consistentes que capitalicen el conocimiento de la organización (Carrasco, 2008).
Algunas características de la descripción de procesos son:
Un proceso bien descrito puede ser comunicado y enseñado, reforzando las
posibilidades de la capacitación y de la inducción.
En la misma línea, cuando los procesos están descritos se puede
confeccionar un plan de capacitación más rico y consistente.
Se tiene la visión de conjunto de las actividades, en lugar de “compartimentos
estancos”, o visión en “feudos”.
Se puede llevar un mejor control de costos.
Es una oportunidad de reforzar la comunicación y la participación, ya que la
descripción de procesos requiere del aporte de todos.
Se logra mejor control con el conocimiento de cómo se hacen las cosas, se
refuerza el trabajo de la auditoría de procedimientos.
Se incrementa la posibilidad de estandarización y normalización, con la descripción es posible comparar con otros procesos.
37
Se obtiene “de regalo” dejar en evidencia el cambio obvio, porque un proceso
descrito se hace visible, deja de estar operado en forma subconsciente, con “piloto automático”.
También queda en evidencia cuáles son los procesos más rentables, aquellos
donde hay que poner énfasis.
El trabajo se orienta a describir lo que se hace y a garantizar que así se hace.
Junto con conocer los procesos se pueden aplicar algunas fórmulas de costeo.
Permite dejar bien establecidas las fronteras y responsabilidades.
Es el mínimo exigido en las normas de calidad y auditorías de procedimientos.
Se puede acceder a la certificación en normas de calidad: ISO 9000, CMM y
otras (Carrasco, 2008).
Mejorar los procesos
La idea es perfeccionar lo que se está haciendo. En muchas organizaciones esta es una opción relativamente fácil de implementar cuando existe una cultura de participación (Carrasco, 2008).
Mejorar los procesos incluye practicar benchmarking, es decir, comparar nuestros procesos con las mejores prácticas del medio y así aprender y mejorar.
Aunque, en estricto rigor, el benchmarking está a medio camino entre mejorar y rediseñar, porque los cambios que se proponen a veces son tan grandes que pueden transformar totalmente un proceso.
38
Algunas características de la mejora de procesos:
Normalmente el cambio es pequeño.
Se busca perfeccionar los detalles del proceso existente, para mejorar en aspectos bien estudiados de costo, eficiencia, resultados, tiempo, calidad de atención.
Se habla del cliente interno y su satisfacción.
El cliente interno es quien realiza el siguiente paso de una serie que concluye en el cliente externo.
Comienza algún nivel de cuestionamiento de por qué se hace de esa manera
y mejor aún, para qué se hace
Desde el comienzo del proyecto se discuten nuevas actividades, tareas y procedimientos relacionados con el proceso.
Se aprecia una orientación más al interior del proceso, a mejorar sus detalles.
Se tiende a crear equipos de trabajo con las mismas personas que realizan o
dirigen un proceso.
A veces se forman grupos más bien permanentes que vigilan los procesos y
hacen mejora continua, son círculos o comités (Carrasco, 2008).
Factores clave para conseguir la satisfacción del cliente
De forma genérica, en la gestión por procesos se tienen que dar tres factores clave para conseguir la satisfacción del cliente, objetivo último de esta herramienta (Maldonado, 2011).
Definición de un método de trabajo.
Consiste en definir un método de trabajo estándar, que esté acorde con los recursos y necesidades de la organización.
39
Ejecución del método de trabajo.
Una vez definido el método de trabajo en los procedimientos, lo que se trata es que todo el personal comience a trabajar conforme a las pautas que se definen en ellos.
Implantación.
El tercer factor consiste en ir introduciendo en nuestros procedimientos o métodos de trabajo las especificaciones del servicio que nos van definiendo nuestros clientes.
La implantación y ejecución de los tres factores nos permitirá alcanzar los niveles de satisfacción deseados para nuestros clientes, ya sean estos internos y externos.
En definitiva lo que se trata es de conseguir que en nuestros procesos de trabajo las "necesidades de nuestros clientes" sean iguales a las "especificaciones del servicio" que ofrece la empresa (Maldonado, 2011).
1.6. Conclusiones parciales del capitulo
Las herramientas colaborativas y de procesos de trabajo representan
recursos significativos para trabajar en equipo facilitando la comunicación entre los participantes.
El groupware apoya la generación de ideas permitiendo compartirlas hasta
conseguir la solución de problemas y generar información valiosa para la toma de decisiones.
40
Bootstrap permite crear webs adaptables a diferentes tamaños de pantalla,
41
CAPITULO II
2. MARCO METODOLÓGICO
2.1. Caracterización del Sector
2.1.1. Consejo cantonal de protección de derechos del cantón Tisaleo
El Consejo cantonal de protección de derechos del cantón Tisaleo (CCPDT) es la entidad responsable de asegurar el pleno ejercicio de derechos, igualdad y no discriminación de niñas, niños, adolescentes, jóvenes, adultos y adultas mayores.
El CCPDT está conformado por un organismo colegiado compuesto por 10 miembros: 5 representan a las distintas funciones del Estado y 5 a los sujetos de derechos (niños, niñas, adolescentes, jóvenes, adultos y adultas mayores). Además, cuenta con una Secretaría Técnica encargada de operar las funciones del Consejo y ejecutar sus resoluciones.
En el CCPDT estamos convencidos que el enfoque del buen vivir de niños, niñas, adolescentes, jóvenes, adultos y adultas mayores es producto de la corresponsabilidad entre Estado, comunidad y familia; por ello promovemos la solidaridad intergeneracional como un mecanismo para lograr relaciones emancipadoras a lo largo del ciclo de vida.
Además del Consejo cantonal de protección de derechos del cantón Tisaleo, la Constitución encarga la garantía de derechos a los consejos nacionales para la igualdad de Género, de Discapacidades, de Movilidad Humana, y de Pueblos y Nacionalidades.
Misión
