FACULTAD DE INGENIERIAS

CARRERA DE INGENIERIA DE SISTEMAS

Tesis previa a la obtención del Título

De Ingeniera en Sistemas

“ANALISIS, DISEÑO E IMPLEMENTACION DEL

PORTAL WEB DEL COLEGIO CESAR ANDRADE
Y CORDERO”

Autora:

Marithza del Rocío Siguencia Siguencia

Directora:

Ing. Paola Ingavelez

Cuenca-Ecuador

2011

1
CERTIFICACIÓN

Certifico que la Tesis “DISEÑO E IMPLEMENTACION DEL PORTAL WEB DEL

COLEGIO CESAR ANDRADE Y CORDERO”, realizado por la estudiante Sra. Marithza
del Rocío Siguencia Siguencia, se ha cumplido en su totalidad bajo mi supervisión.

Cuenca, 22 de Agosto del 2011

______________________
Ing. Paola Ingavelez
Directora de Tesis

2
DEDICATORIA

Mi tesis la dedico con mucho amor y cariño:

A Dios por darme la oportunidad de vivir y de regalarme una gran familia. Por darme
las ganas y voluntad de luchar día a día.
A mis queridos padres que me dieron el don de la vida y estar en todo momento y por
darme una carrera para mi futuro.
A mí querida hija Danna y mi esposo Juan Francisco por estar siempre conmigo
brindándome su amor, confianza y apoyo.
A mis hermanas y hermano por su apoyo constante y sus consejos

Marithza Siguencia S.

3
AGRADECIMIENTOS
En primer lugar agradezco a Dios por darme la fortaleza para enfrentar todo
obstáculo ante mi presentado, la sabiduría para tomar la mejor decisión, el coraje para
no desmayar jamás, la inteligencia y la salud necesaria para la elaboración del
proyecto

Agradezco a mis queridos padres, quienes siempre me apoyaron en lo moral y

económicamente durante mi carrera universitaria, y en todos mis estudios, y siempre
estuvieron pendientes de lo que yo necesitaba, además de siempre brindarme su amor y
confianza.

A Juan Francisco, mí amado esposo por formar parte de mi vida y estar conmigo
siempre en los buenos y malos momentos, por su apoyo y paciencia que ha tenido
conmigo durante el tiempo que he empleado para desarrollar este proyecto,

A Danna mi querida hija, el regalo más bello que Dios me ha dado, por ser mi
fortaleza, mis ganas de seguir adelante, y por llenar mi corazón de alegría con su
dulzura.

A mis hermanas y hermano por brindarme siempre su apoyo y cariño. A mi hermana

Ninfa, por confiar en mí y brindarme su apoyo incondicional sin importar la distancia
ni el tiempo, siempre estuvo allí cuando la necesitaba y siendo un pilar fundamental
para la realización de este proyecto. Y a toda mi familia por su constante apoyo

A mi directora de tesis Ing. Paola Ingavelez, quien, con su ayuda, su tiempo,

dedicación y orientación contribuyo al desarrollo de la presente. Gracias por
compartir su conocimiento.

Agradezco a mis profesores quienes con responsabilidad supieron guiar e impartir sus
valiosos conocimientos

A todos aquellos compañeros y profesores que me ayudaron durante la carrera. Y a todos

quienes hicieron posible la elaboración y culminación de este proyecto.

Marithza Siguencia S.

4
 ÍNDICE
CAPITULO I ................................................................................................................ 13
1. INTRODUCCION DEL COLEGIO................................................................... 13
1.1 JUSTIFICACION ............................................................................................ 13
1.2 DEFINICION DE OBJETIVOS ...................................................................... 15
1.2.1 Objetivo General....................................................................................... 15
1.2.2 Objetivos Específicos ............................................................................... 15
1.3 ESTRUCTURA ORGANIZACIONAL .......................................................... 15
1.4 DESCRIPCION DE LA SITUACIÓN ACTUAL DEL COLEGIO................ 17
CAPÍTULO II ............................................................................................................... 22
2. INTRODUCCION TEORICA ............................................................................ 22
2.1 PORTALES WEB ........................................................................................... 22
2.1.1 Definiciones Generales ............................................................................. 22
2.1.2 Características ........................................................................................... 23
2.1.3 Servicios ................................................................................................... 23
2.1.4 Tipos De Portales Web ............................................................................. 24
2.1.5 Ventajas .................................................................................................... 25
2.1.6 Desventajas ............................................................................................... 25
2.2 SISTEMA GESTOR DE CONTENIDOS (CMS) ........................................... 26
2.2.1 Definición ................................................................................................. 26
2.2.2 Funcionamiento ........................................................................................ 27
2.2.3 Tipos De Gestores De Contenidos ........................................................... 27
2.3 SISTEMA GESTOR DE CONTENIDOS JOOMLA ...................................... 29
2.3.1 Definición ................................................................................................. 29
2.3.2 Características ........................................................................................... 29
2.3.3 Ventajas .................................................................................................... 30
2.3.4 Extensiones ............................................................................................... 30
2.4 PATRON MVC ............................................................................................... 33
2.4.1 Elementos ................................................................................................. 33
2.5 SOFTWARE DE LIBRE DISTRIBUCIÓN .................................................... 34
2.5.1 Definición De Software Libre .................................................................. 34
2.5.2 Tipos De Licencia De Software................................................................ 34
2.5.3 Copyright .................................................................................................. 37
2.5.4 Ventajas De Software Libre ..................................................................... 37
2.5.5 Desventajas De Software Libre ................................................................ 38
2.5.6 Licencia De Software Libre A Utilizar En El Portal Web ....................... 39
CAPÍTULO III ............................................................................................................. 40

5
3. ANALISIS DE REQUERIMIENTOS ............................................................... 40
3.1 DEFINICIÓN DE REQUERIMIENTO .......................................................... 40
3.2 TIPOS DE REQUERIMIENTOS .................................................................... 41
3.3 ANÁLISIS DE REQUERIMIENTOS PARA EL PORTAL WEB A
DESARROLLAR ....................................................................................................... 41
3.4 DIAGRAMAS DE ANALISIS ........................................................................ 45
3.4.1 Diagramas De Casos De Uso.................................................................... 46
3.4.2 Diagramas De Secuencia .......................................................................... 60
3.4.3 Diagrama De Estados ............................................................................... 65
3.5 DISEÑO DE LA BASE DE DATOS .............................................................. 68
3.5.1 Diagrama De Entidad-Relación ................................................................ 69
CAPÍTULO IV.............................................................................................................. 72
4. ESTUDIO Y ELECCION DEL SOFTWARE DE DESARROLLO ............... 72
4.1 SERVIDOR WEB............................................................................................ 72
4.1.1 Definición ................................................................................................. 72
4.2 SERVIDOR WEB APACHE........................................................................... 72
4.2.1 Arquitectura .............................................................................................. 73
4.2.2 Características ........................................................................................... 73
4.3 LENGUAJE DE PROGRAMACIÓN ............................................................. 74
4.3.1 PHP ........................................................................................................... 74
4.3.2 ASP ........................................................................................................... 75
4.3.3 JSP ............................................................................................................ 76
4.3.4 Elección y Justificación Del Lenguaje De Programación ........................ 77
CAPÍTULO V ............................................................................................................... 79
5. COMPARACION Y ELECCION DE BASE DE DATOS ............................... 79
5.1 DEFINICIÓN DE BASE DATOS ................................................................... 79
5.2 TIPOS DE BASE DE DATOS ........................................................................ 79
5.3 BASE DE DATOS........................................................................................... 81
5.3.1 ORACLE .................................................................................................. 81
5.3.2 MYSQL .................................................................................................... 82
5.3.3 SQL SERVER .......................................................................................... 83
5.4 ELECCIÓN Y JUSTIFICACIÓN DE LA BASE DE DATOS ....................... 84
CAPITULO VI.............................................................................................................. 86
6. INSTALACIÓN DE LAS HERRAMIENTAS ................................................. 86
6.1 PAQUETE WAMP SERVER ......................................................................... 86
6.1.1 Funcionalidades ........................................................................................ 86
6.1.2 Programas que Contiene Wamp Server .................................................... 87
6.1.3 Requerimientos Para La Instalación ......................................................... 88
6
 6.1.4 Manual De Instalación De WampServer .................................................. 88
6.2 GESTOR DE CONTENIDOS JOOMLA. ....................................................... 88
6.2.1 Requisitos Para Instalar Joomla................................................................ 88
6.2.2 Manual De Instalación De Joomla Sobre Wampserver ............................ 88
6.2.3 Frontend y Backend de Joomla. ............................................................... 89
6.2.4 Componentes, Módulos Y Plugins De Joomla ..................................... 92
CAPÍTULO VII ............................................................................................................ 96
7. INTERFAZ GRAFICA DEL PORTAL ............................................................. 96
7.1 DISEÑO DE LA INTERFAZ GRAFICA DEL PORTAL WEB .................... 96
7.1.1 Estándares de Colores ............................................................................ 100
7.1.2 Secciones ................................................................................................ 100
7.2 DESARROLLO DEL FRONTEND DEL PORTAL.................................... 105
7.3 DESARROLLO DEL COMPONENTE NOTAS .......................................... 106
7.4 DESARROLLO DEL COMPONENTE EVALUACIONES ........................ 111
CAPÍTULO VIII ........................................................................................................ 114
8. INSTALACION, INTEGRACION, SEGURIDAD Y PRUEBAS ................. 114
8.1 INSTALACIÓNES ........................................................................................ 114
8.1.1 Instalación y Configuración De La Base De Datos ................................ 114
8.1.2 Configuración Del Servidor.................................................................... 117
8.2 INTEGRACION ............................................................................................ 117
8.2.1 Integración del Componente Consultar Notas ........................................ 117
8.2.2 Integración del Componente Evaluaciones ............................................ 120
8.3 SEGURIDAD EN EL PORTAL.................................................................... 122
8.4 PRUEBAS ..................................................................................................... 124
8.4.1 Pruebas del Portal con todos los servicios que ofrece ............................ 124
8.4.2 Pruebas de Rendimiento ......................................................................... 129
CONCLUSIONES Y RECOMENDACIONES ..................................................... 134
CONCLUSIONES .................................................................................................... 134
RECOMENDACIONES .......................................................................................... 135
GLOSARIO................................................................................................................. 136
BIBLIOGRAFÍA ........................................................................................................ 138
9. ANEXOS ............................................................................................................. 140
A. INSTALACION DE WAMPSERVER ................................................................ 140
B. INSTALACION DE JOOMLA ............................................................................ 145
C. MANUAL DE JOOMLA ..................................................................................... 151
D. MANUAL DE USUARIO ................................................................................... 166

7
 INDICE DE FIGURAS

Figura 1-1 Estadísticas acceso a Internet Ecuador ......................................................... 14

Figura 1-2 Estructura Organizacional del Colegio ......................................................... 16
Figura 1-3 Distribución de Equipos en Diferentes Aéreas del Colegio ....................... 18
Figura 1-4. Diagrama del Sistema del Colegio .............................................................. 21
Figura 2-1. Funcionamiento de un CMS ........................................................................ 27
Figura 2-2. Logo de Joomla............................................................................................ 29
Figura 2-3. Funcionamiento del patrón MVC ................................................................ 34
Figura 6-1. Backend del Portal Web. ............................................................................. 89
Figura 6-2. Panel de Control del Backend ...................................................................... 90
Figura 6-3. Icono de Añadir un Nuevo Artículo ............................................................ 90
Figura 6-4. Icono del Gestor de artículos ...................................................................... 90
Figura 6-5. Icono del Gestor de la Página Principal ....................................................... 90
Figura 6-6. Icono del Gestor de Secciones ..................................................................... 90
Figura 6-7. Icono del Gestor de Categorías .................................................................... 91
Figura 6-8. Icono del Gestor Multimedia ...................................................................... 91
Figura 6-9. Icono del Gestor de Idiomas ........................................................................ 91
Figura 6-10. Icono del Gestor de Usuarios .................................................................... 91
Figura 6-11. Icono Configuración Global ...................................................................... 91
Figura 6-12. Menú Principal de Joomla ......................................................................... 92
Figura 7-1 Estructura de la Página Principal .................................................................. 97
Figura 7-2 Estructura de la Pagina del Usuario Estudiante ............................................ 98
Figura 7-3 Estructura de la Pagina del Usuario Secretaria ............................................. 99
Figura 7-4. Sección del Menú Principal ...................................................................... 101
Figura 7-5. Sección Left del Portal............................................................................... 101
Figura 7-6. Sección central del Portal ......................................................................... 102
Figura 7-7. Sección Rigth del Portal ............................................................................ 103
Figura 7-8. Página Principal del Portal........................................................................ 103
Figura 7-9. Página del Estudiante del Portal ................................................................ 104
Figura 7-10. Página del Usuario Secretaria .................................................................. 105
Figura 7-11. Página Principal del Portal ...................................................................... 106
Figura 7-12. Componente Notas ................................................................................... 107
Figura 7-13. Código de notas.php ................................................................................ 110

8
Figura 7-14. Código de controller.php ......................................................................... 110
Figura 7-15. Código de view.htm.php .......................................................................... 111
Figura 7-16. Código de default.php .............................................................................. 111
Figura 7-17. Componente Evaluaciones ....................................................................... 112
Figura 8-1. Herramienta DBF To SQL Converter Software ........................................ 115
Figura 8-2. Convertir Archivo dbf ................................................................................ 116
Figura 8-3. Mensaje de archivo convertido .................................................................. 116
Figura 8-4. Ubicación de archivos convertidos (SQL) ................................................. 117
Figura 8-5. Gestor de Extensiones ................................................................................ 118
Figura 8-6. Subir Paquete ............................................................................................. 118
Figura 8-7. Archivo seleccionado ................................................................................. 118
Figura 8-8. Selección de ítem Reporte de Notas .......................................................... 119
Figura 8-9. Configuración del ítem Consultar Notas ................................................... 119
Figura 8-10. Propiedades del Componente Evaluación................................................ 120
Figura 8-11. Selección del Ítem Evaluación Profesores ............................................... 121
Figura 8-12. Configuración del ítem Evaluar Docente ............................................... 121
Figura 8-13. Propiedades del componente Reporte ...................................................... 122
Figura 8-14. Ventana de Akeeba Backup ..................................................................... 123
Figura 8-15. Página principal del usuario Estudiante ................................................... 125
Figura 8-16. Página principal del usuario Secretaria .................................................... 125
Figura 8-17. Capacitación y presentación del Portal a la Secretaria ............................ 126
Figura 8-18. Presentación y capacitación al docente .................................................... 127
Figura 8-19. Presentación y Capacitación a los Estudiantes ....................................... 127
Figura 8-20. Componente Perfil ................................................................................... 129
Figura 8-21. Estadísticas de Uso generado por Webalizer ........................................... 130
Figura 8-22. Banda Ancha ............................................................................................ 131
Figura 8-23. Transferencia de Banda Ancha en el mes de Junio ................................. 131
Figura 8-24 Banda Ancha Diaria del Mes de Junio ..................................................... 132
Figura 8-25. Trafico del Servidor. ................................................................................ 132
Figura 8-26. Estadísticas de consultas .......................................................................... 133
Figura A-1 Ventana de Bienvenida .............................................................................. 140
Figura A-2. Ventana de Licencia .................................................................................. 140
Figura A-3. Ventana de Selección de Ruta................................................................... 141
Figura A-4. Ventana de Selección de Herramientas..................................................... 141

9
Figura A-5. Ventana de Instalar ................................................................................... 141
Figura A-6. Ventana del Proceso de Instalación .......................................................... 142
Figura A-7. Ventana de selección del navegador ......................................................... 142
Figura A-8. Ventana de Parámetros de SMPT y E-mail .............................................. 142
Figura A-9. Ventana de Finalización de la Instalación ................................................ 143
Figura A-10. Icono de WampServer en la barra de herramientas ................................ 143
Figura A-11. Servicios de WampServer ....................................................................... 143
Figura A-12. Ventana de WampServer ........................................................................ 144
Figura A-13. Ventana de PhpMyAdmin....................................................................... 145
Figura B-1. Creación de la Carpeta .............................................................................. 145
Figura B-2. Descarga del archivo ................................................................................. 146
Figura B-3. Selección del Idioma ................................................................................. 146
Figura B-4. Comprobación Previa ................................................................................ 147
Figura B-5. Condiciones de la Licencia ....................................................................... 147
Figura B-6. Configuración de la Base de Datos ........................................................... 148
Figura B-7. Configuración de FTP ............................................................................... 149
Figura B-8. Instalar el ejemplo .................................................................................... 149
Figura B-9. Finalización de la Instalación ................................................................... 149
Figura B-10. Borrar la carpeta Installation ................................................................... 149
Figura B-11. Iconos de Portada y Administración ....................................................... 150
Figura B-12. Bienvenida de Joomla ............................................................................. 150
Figura C-1. Backend del portal web ............................................................................ 151
Figura C-2. Gestor de Menús ....................................................................................... 151
Figura C-3. Crear Menú ............................................................................................... 152
Figura C-4. Gestor de Items del menú.......................................................................... 152
Figura C-5. Seleccionar tipo de Ítem. ........................................................................... 153
Figura C-6. Tipo de Ítem Artículos .............................................................................. 153
Figura C-7. Ítem: Presentación del Articulo ................................................................. 154
Figura C-8. Selección del artículo ................................................................................ 154
Figura C-9. Artículo seleccionado ................................................................................ 155
Figura C-10. Gestor de Artículos ................................................................................. 155
Figura C-11. Crear Nuevo Artículo .............................................................................. 155
Figura C-12. Articulo Creado ...................................................................................... 156
Figura C-13. Pestañas para configurar los Artículos .................................................... 156

10
Figura C-14. Escoger Artículo a Modificar .................................................................. 157
Figura C-15. Ventana para Modificar Artículo ............................................................ 157
Figura C-16. Ventana para seleccionar el artículo a eliminar ...................................... 158
Figura C-17. Panel de Control de JEvents.................................................................... 158
Figura C-18. Ventana de las Categorías creadas .......................................................... 159
Figura C-19. Crear Categoría ....................................................................................... 159
Figura C-20. Eventos creados ....................................................................................... 160
Figura C-21. Crear Evento .......................................................................................... 160
Figura C-22. Configurar Calendario del Evento ......................................................... 161
Figura C-23. Panel de Control de Phoca Gallery ......................................................... 161
Figura C-24. Categorías creadas .................................................................................. 162
Figura C-25. Ventana de imágenes cargadas................................................................ 162
Figura C-26. Carpeta de Imágenes de Phoca Gallery ................................................... 163
Figura C-27. Imágenes de la Carpeta Galería............................................................... 164
Figura C-28. Eliminar Imágenes .................................................................................. 165
Figura D-1. Menú Principal del Portal ......................................................................... 166
Figura D-2. Pestaña de la Galería de Imágenes ............................................................ 166
Figura D-3. Galería de Imágenes .................................................................................. 166
Figura D-4. Imágenes de una Categoría ....................................................................... 167
Figura D-5. Presentación de Imágenes ......................................................................... 168
Figura D-6. Pestaña de Contáctenos ............................................................................ 168
Figura D-7. Formulario para enviar Mensaje ............................................................... 169
Figura D-8. Ubicación del Colegio en el Mapa de Cuenca .......................................... 170
Figura D-9. Menú Secundario ...................................................................................... 171
Figura D-10. Acceso OnLine........................................................................................ 171
Figura D-11. Inicio de Sesión ....................................................................................... 171
Figura D-12. Cerrar Sesión........................................................................................... 172
Figura D-13. Confirmar cierre de Sesión ..................................................................... 172
Figura D-14. Contador de Visitas ................................................................................. 172
Figura D-15. Calendario de Eventos ............................................................................ 173
Figura D-16. Eventos por Mes ..................................................................................... 173
Figura D-17. Información detallada del Evento .......................................................... 174
Figura D-18. Opciones del Estudiante .......................................................................... 175
Figura D-19. Ítems del Menú Estudiante...................................................................... 175

11
Figura D-20. Ítem Tu Perfil .......................................................................................... 176
Figura D-21. ítem Consultar Notas .............................................................................. 177
Figura D-22. Notas por Trimestres ............................................................................... 178
Figura D-23. Notas en formato PDF ............................................................................ 178
Figura D-24. Ítem Evaluar Docente ............................................................................. 179
Figura D-25. Cuestionario para Evaluar ....................................................................... 180
Figura D-26. Ítem Períodos lectivos ............................................................................. 181
Figura D-27. Notas por Períodos Lectivos ................................................................... 182
Figura D-28. Ítem Cerrar Sesión .................................................................................. 182
Figura D-29. Menú Principal del estudiante ................................................................. 183
Figura D-30. Ítem Inicio del Menú Principal ............................................................... 183
Figura D-31. Ítem Pagina Personal............................................................................... 184
Figura D-32. Opciones del Usuario Secretaria ............................................................. 185
Figura D-33. Ítem Evaluaciones ................................................................................... 185
Figura D-34. Ítem cerrar Sesión ................................................................................... 186

Índice de Tablas
Tabla 4-1. Tabla Comparativa de Lenguajes de Programación................................... 78
Tabla 5-1. Tabla Comparativa de las Bases de Datos .................................................... 85

12
 CAPITULO I

1. INTRODUCCION DEL COLEGIO

1.1 JUSTIFICACION
Con la presentación de este trabajo se pretende conseguir que todos los lectores,
creadores de páginas Web, encuentren aquí una guía fácil a seguir, con procedimientos
sencillos y claros para el diseño e implementación de portales Web

En el proceso de desarrollo de Pagina Web son imprescindibles las etapas de Análisis,

Diseño e Implementación y Pruebas, El punto de vista desde el cual se analiza el
proceso de diseño es desde la interrelación humana, mediatizada por la tecnología, esto
es lo que se llama la Ingeniería De Usabilidad

La Ingeniería de Usabilidad se emplea para diseñar páginas web. Un sitio Web no solo
debe ser amigable con el usuario, sino ser útiles y que respondan a las necesidades del
usuario. La ingeniería de usabilidad es una metodología que asegura el uso del sitio web
para lo que fue diseñado y para lo que el usuario pensaba que podría usarlo, es decir,
por medio de la usabilidad se asegura un diseño útil y se prueba que el usuario detecta
de modo apropiado el uso del sistema y no de manera equívoca. (ITESO)

Las páginas web dinámicas, facilitan la interacción entre la web y el visitante,

mediante herramientas como buscadores, chat, foros, sistemas de encuestas, etc.
Además poseen un Sistema de administración de contenidos que permite crear,
actualizar y administrar cantidades de contenido en la misma.

13
Un sitio Web de calidad permite mejorar la imagen profesional, como demostrar el
conocimiento y aceptación de las nuevas tecnologías, Hoy en día son más los usuarios
que acceden a internet en busca de información, producto o servicio, por eso, al no
tener un sitio web se crea una gran desventaja competitiva con respecto a otras
instituciones que si la tienen, el diseño de páginas web se ha desarrollado a medida que
ha evolucionado Internet.

En el Ecuador y según datos de la Secretaría Nacional de Telecomunicaciones

(SENATEL), desde 2007 hasta la fecha, el número de usuarios de Internet de banda
ancha se sextuplicó. Así, de acuerdo con las estadísticas, de 329 mil usuarios que había
en 2007 ahora sobrepasan los 1,8 millones de usuarios en todo el país, con una densidad
de cobertura del 11,2% a escala nacional.1

Figura 1-1 Estadísticas acceso a Internet Ecuador

En los siguientes capítulos se ofrecerá una visión general e introductoria de algunos

conceptos básicos, elementos teóricos, así como las diferentes alternativas de software

1
Fuente: http://www.conatel.gov.ec
14
existentes en el mercado y escoger la más apropiada que conlleve a un mayor beneficio
dentro de la Institución

1.2 DEFINICION DE OBJETIVOS

1.2.1 Objetivo General

Analizar, Diseñar e Implementar un Portal Web para El Colegio “Cesar Andrade

y Cordero”

1.2.2 Objetivos Específicos

 Recopilar y analizar información necesaria acerca del Establecimiento para la

construcción del Portal Web
 Analizar los diferentes requerimientos a utilizarse para el desarrollo del Portal
Web.
 Crear aplicaciones en el Portal Web, con enfoque a evaluación interna de
maestros, e información de notas a padres y alumnos
 Analizar las diferentes alternativas de software existentes, para elegir el software
a utilizarse para el desarrollo
 Instalar y configurar los diferentes software a utilizar
 Diseñar la interfaz gráfica para el Portal Web
 Analizar, Instalar y configurar el Sistema de Gestor de Contenidos que agiliza
y facilita el proceso de modificación de contenidos.
 Buscar, analizar e instalar una herramienta para la migración de datos de FoxPro
a MySQL.
 Desarrollar el componente de Consulta de notas
 Desarrollar el componente de evaluaciones al docente
 Realizar pruebas del sistema para verificar su funcionamiento
 Capacitar a los usuarios sobre los servicios implementados.

1.3 ESTRUCTURA ORGANIZACIONAL

El Colegio Nacional Técnico “Cesar Andrade y Cordero” fue fundado el 24 de
Septiembre de 1986 con Acuerdo Ministerial No. 2263 con el Nombre Nacional Mixto
“Dr. Camilo Gallegos Domínguez” fundado en el local de la Escuela “Iván Salgado E.”

15
de la ciudadela Tomebamba en horario vespertino.

En el transcurso del año 1989 se da el cambio de nombre de la institución por asuntos

político; asignándole el de un ilustre cuencano, poeta, escritor, ensayista, periodista,
músico, y sobre todo formador de juventudes como es el “Dr. César Andrade y
Cordero”; resolución mediante acuerdo No. 006 del 18 de Enero de 1989, emitido por la
Dirección de Educación. El Colegio en la actualidad está conformado de la siguiente
manera:

1ra. Vocal Principal: 2da. Vocal Principal: 3ra. Vocal Principal:

Lcda. Miriam Palacios Lcda. Doris Gualpa. Prof. Miriam Sánchez

Rector Lcdo. Rubén Vicerrectora: Lcda.

Darío Flores Flores María Teresa Delgado

Miembros Del
Consejo Directivo

Docentes COLEGIO INFORMATICO Alumnos

“CESAR ANDRADE Y
CORDERO”

Colectora: Lcda. Personal Bibliotecaria: Lcda.

Rebeca Ledesma Administrativo Rebeca Ledesma

Secretaria: Sra. Laboratorista: Tec. Inspector General (e): Lcdo.

Isabel Chica Segarra Xavier Delgado Cesar Castro Calle

Inspectores

Figura 1-2 Estructura Organizacional del Colegio

16
1.4 DESCRIPCION DE LA SITUACIÓN ACTUAL DEL
COLEGIO
En la Actualidad el Colegio cuenta con 451 alumnos matriculados en el periodo
lectivo 2009-2010, con 287 hombres y 164 mujeres. Dispone de 12 aulas de
aprendizaje, con 15 profesores de planta y 11 profesores contratados, cada curso tiene
dos paralelos.

EL Colegio cuenta con el Bachillerato Técnico en Comercio y Administración

especialización Informática, siendo la única especialidad que tiene este colegio.

Al inicio del año Lectivo para las inscripciones del 8vo año del ciclo básico existe gran
demanda de estudiantes que aspiran estudiar en este Colegio pero debido a que no se
cuenta con el espacio físico suficiente para educarlos, se matriculan solo a 80 alumnos,
de acuerdo al aprovechamiento obtenido en la Escuela, siendo este superior a 16 puntos
en adelante.

Pero año tras año se vienen realizando ampliaciones de su estructura física, por lo que
siempre va en continuo crecimiento el número de alumnos.

El horario de clases del ciclo básico es de 7:00 a 13:30, para el ciclo diversificado es
de 7:00 a 14:20 y el personal administrativo labora hasta las 15:00 ya que tienen
cumplir con las 8 horas de labor.

INFRAESTRUCTURA TECNOLOGICA

En cuanto a la infraestructura tecnológica, la institución cuenta con 2 laboratorios de

computación: uno para el ciclo básico con 10 computadoras y otra para el ciclo
diversificado con 20 computadoras, cada laboratorio cuenta con el servicio de internet,
y un número más de computadoras en las áreas de Rectorado, Vicerrectorado,
Colecturía y Secretaria, dichos equipos les permite llevar cada una de las tareas
correspondientes, estos equipos trabajan de forma individual( no están interconectadas),
siendo así que la información se encuentra distribuida y replicada en cada uno de ellos.

En el área de Colecturía disponen de un equipo que lo utilizan como servidor de

Internet y tiene las siguientes características:

17
 Memoria RAM de 2 GB.
 Procesador: Intel(R) Pentium(R) 4 CPU 2160@ 1.80Ghz
 Espacio en Disco: 240GB con tres particiones, cada partición tiene 80Gb de espacio

En el área de secretaria disponen de un equipo que trabaja con el sistema del Colegio, y
tiene las siguientes características:

 Memoria RAM de 2Gb

 Procesador: Intel(R) Core™; 3 CPU 540@ 3.07Ghz
 Espacio en Disco: 300GB con dos particiones,

ESQUEMA DE LA DISTRIBUCION DE EQUIPOS EN LAS DIFERENTES

AREAS

Colecturia INTERNET

Router
Servidor

Rectorado
Laboratorio 1
Laboratorio 2
Switch
Switch

Vicerrectorado

Secretaria

Figura 1-3 Distribución de Equipos en Diferentes Aéreas del Colegio

Para el manejo de matriculas, calificaciones, alumnos, etc., el Colegio cuenta con un

sistema, el mismo que está desarrollado en FOX Pro 2.5. Este es un lenguaje de
programación orientado a objetos, que a la vez es un Sistema Gestor de Bases de datos o
Database Management System (DBMS), utilizada para los sistemas operativos MS-
DOS, MS Windows, Mac OS y UNIX. En este caso para el sistema operativo Windows.

18
El Colegio cuenta con este sistema desde el año 1999. Este sistema no tiene interfaz
amigable y está estructurado de la siguiente manera:

MATRICULA: Para ingresar y consultar las matriculas

 Ingreso:
o Datos Generales
o Datos Académicos
o Padres y Representante
o Observaciones
 Mantenimiento: Permite modificar, ver, imprimir la matricula de un
alumno
 Certificado de Matricula: Reporte del alumno matriculado
 Asistencia: Comprueba asistencia del alumno matriculado

CALIFICACIONES: para ingreso y consulta de calificaciones

 Certificación de Calificaciones: Para ver e imprimir las calificaciones

o Calificaciones por Curso: Calificaciones de una sola Materia
o Calificaciones por Alumno: Calificaciones de todas las materias
o Faltas por Alumno:
 Ingreso/modificación
o Por Curso
o Por Nombre
 Certificados de Calificaciones: Calificaciones de un alumno de todas las
materias de un trimestre
 Archivo Actas de Grado: Registro de las actas de grado de todos los
estudiantes
 Impresión Cuadro de Notas: Notas para el final del año lectivo
 Archivo Nomina Oficial: Nomina de estudiantes graduados.
 Archivo Refrendación de Títulos: Para la Dirección de Educación
 Cuadro de Promedio Finales: Nomina por curso de los promedios
 Cuadro de perdidos de Año: Nomina de alumnos que han perdido el año.

19
 REPORTES: Para realizar distintos listados

 Listas: Nomina de alumnos matriculados por curso con su código

 Lista Datos: Lista de alumnos por curso con datos de representante
 Lista Nacimiento: Lista de alumnos con su fecha de nacimiento
 Matricula para Carpeta: Para archivar en carpeta
 Certificados de Promoción: Para alumnos
 Calificaciones (Dirección) Consolidados para juntas: Reporte trimestral
del promedio por materia de todos los alumnos
 Cuadros para Calificaciones: Para los maestros, al inicio del año lectivo
para anotar calificaciones mensualmente y promedios
 Cuadros para Disciplina: Para notas de conducta para guías de curso
 Cuadros de 1 a 5: Todas las notas de los estudiantes de 1ero a 5 to curso,
para obtener la acta de grado
 Cuadros para notas de Grado: Para notas de los exámenes de grado
 Cuadro para Supletorios: Reporte de los alumnos en supletorio(nota que
tienen y nota que deben sacar para pasar)

MANTENIMIENTOS: Para guardar y consultar información de los Cursos,

Materias y Maestros que tiene el Colegio

 Cursos: Para crear nuevos cursos y guardar información de un curso.

 Materias: Reporte de todas las materias
 Materias por Cursos: Reporte de todas las materias por curso y su
respectivo docente
 Ficha del Maestro: Información del maestro

UTILES

 Reordenar
 Respaldar
 Restaurar
 Cierre de Matricula
 Generar Base de calificaciones
 Alumnos Retirados
20
  Calificaciones de 1 a 5

Lo Anterior se resume en el siguiente cuadro sinóptico.

Sistema de Matricula y
Calificaciones

Reportes
Utiles
Matricula
Mantenimiento
Calificaciones

Cuadros de
Calificaciones Reordenar
Cursos
Certificación de Por Alumno
Ingreso Calificaciones
Listas Datos del
Respaldar Alumnos
Por Curso
Materias
Mantenimiento Archivo de Actas
Matricula para
de Grado
Carpeta Restaurar

Materias por
Certificado de Ingreso/
Curso
Certificados de Cierre de Matricula Modificación
Promoción Matricula
Impresión de
Asistencia Ficha del Maestro
Cuadro de Notas
Calificaciones(Dir Generar Base de
eccion) Calificaciones
Archivo Nomina
Oficial
Cuadros para Alumnos
Calificaciones Retirados
Archivo
Refrendación de
Cuadros para Calificaciones de Títulos
Disciplina 1a5

Cuadro de
Cuadros para Promedios
notas de Grado Finales

Cuadros para Cuadros de

supletorios Promedios
Finales

Figura 1-4. Diagrama del Sistema del Colegio

21
 CAPÍTULO II

2. INTRODUCCION TEORICA

2.1 PORTALES WEB

2.1.1 Definiciones Generales

Un portal es un sitio web, su objetivo es la de servir de Puerta de entrada única para

ofrecer al usuario, de manera fácil el acceso a múltiples servicios, recursos, aplicaciones
desde un mismo lugar.

La palabra PORTAL tiene como significado PUERTA GRANDE, refiriéndose a que

es el punto de partida de un usuario que desea entrar y realizar búsquedas en la web. Un
portal ofrece diferentes servicios en el internet, logrando incrementar la intensidad de
tráfico en el mismo.

En general los portales ofrecen servicios como: directorios, correo electrónico,

encuestas, noticias generales, chats, compras, ventas, entretenimiento, etc.

A los portales web también les llaman CMS o gestores de contenidos, permitiendo así
que el contenido del sitio sea modificado de forma rápida y segura desde cualquier
lugar mediante una computadora conectada al Internet.

Los portales web tienen el propósito de agrupar un conjunto de servicios, recursos, de

manera integrada para el usuario para informarse, participar, opinar, o acceda a
múltiples aplicaciones.

Todo portal debe ser de fácil acceso a toda la información referida al mismo tema, el
portal se encarga de centralizar enlaces de manera fácil y organizada facilitando así la
navegación sobre un tema específico en la red.

Algunos Portales son accesibles para cualquier visitante, otros necesitan autenticación,
por lo que los usuarios deben estar registrados para acceder.

22
2.1.2 Características

Las características que un portal web debe brindar a los usuarios, en cuanto a la
usabilidad del Portal, son las siguientes:

 Utilidad: Botones, menús, imágenes, todos los elementos deben tener una utilidad,
en base a los objetivos planteados en el portal
 Facilidad de uso: Un sitio web debe ser de fácil uso para el usuario
 Rapidez: Las imágenes, animaciones, etc. que se vayan a cargar en el portal no
deben entorpecer la rapidez del portal.
 Intuitivo: Todos los elementos del portal (botones, enlaces, imágenes, iconos etc., )
deben estar relacionados con la percepción del usuario, de manera que el usuario
sepa lo que tiene que hacer con tan solo ver el sitio
 Eficiente: Es la utilización correcta de los elementos que dispone el portal web, es
decir cada elemento del portal debe hacer a lo que hace referencia.

2.1.3 Servicios

El Portal Web del Colegio constara de los siguientes componentes para el acceso en
línea:

1. Componente de Consulta de Notas

2. Componente de Evaluación al Docente

Estos componentes desarrollados serán de gran utilidad para el colegio que siempre
busco mejorar su infraestructura informática y de esta manera mejorar el servicio para
todos los usuarios: personal administrativo, profesores y alumnos.

El colegio puede optar por mostrar información a través de Internet a los padres de
familia, a los alumnos, e incluso a los profesores. El colegio decide qué tipo de
información quiere disponer en el portal

Los servicios a ofrecer el Portal web para el Colegio tenemos a continuación:

23
  Información referente al Colegio como:
o Historia
o Docentes
o Autoridades
o Servicios
o Himno al Colegio
o Horarios de Clases, etc.
 Calendario de Eventos
 Galería de Imágenes
 Noticias.
 Información general que el colegio quiera ofrecer, como actividades
culturales, deportivas, académicas, etc.
 Consulta de Notas
 Evaluaciones al docente

2.1.4 Tipos De Portales Web

1. Portales Horizontales: También llamados portales masivos o de propósito general,

estos portales tiene un propósito general, su objetivo es llegar a toda la gente con
diferentes temas, Ganan dinero mediante los anuncios. Incluye servicios como
comunidades virtuales, chat, e-mail, espacio web gratuito, foros, noticias,
información, buscadores, Ejemplo de estos portales tenemos: Yahoo, MSN, etc.

2. Portales Verticales: Este tipo de portales buscan público interesados en un tema

específico como puede ser un portal de juegos, un portal de deporte. Estos portales
proporcionan información y servicios a un sector en particular, con contenidos
concretos y centrados en un tema.

3. Portales Diagonales: Estos portales surgen de la combinación entre portal

horizontal y portal vertical. En general se tratan de redes sociales o aplicaciones
generalistas, ejemplo de estos portales tenemos, Facebook, Hi5, YouTube

24
 El portal web que se desarrollara será de tipo Vertical ya que brindara servicio a un
sector en particular en este caso a estudiantes, docentes y personal administrativo
del Colegio “Cesar Andrade y Cordero”

2.1.5 Ventajas

Las ventajas a obtener con la implementación del Portal Web en el Colegio “Cesar
Andrade y Cordero” tenemos:

 Disponibilidad del Portal Web: Con el Portal web los servicios e información del
Colegio estarán disponibles los 365 días del año, y las 24 horas del día para que
pueda ser visitada por cualquier usuario.
 Un Portal le da más personalidad, seriedad y profesionalismo a la Institución,
brindándole una imagen moderna y tecnológica.
 La información puede ser modificada y actualizada en cualquier momento.
 Herramientas Gratis: Disponen de una variedad de Herramientas gratuitas tales
como los servicios de chat, foros, correo electrónico, encuestas, galería, calendario,
etc. Hoy en día estos servicios son muy utilizados por todos los usuarios que tienen
acceso a internet
 Información Organizada: La diversa información y servicios que dispone el sitio,
es posible clasificarla por secciones y categorías, para que de esta manera sea fácil
de encontrar lo que busca el usuario.
 Fácil Navegación: Con el sitio bien organizado es fácil para el usuario su
navegación
 Motor de Búsqueda: Contiene un motor de búsqueda incorporada dentro del sitio.
 Hoy en día es el medio más económico de publicidad

2.1.6 Desventajas

Las desventajas a obtener con la implementación del Portal Web en el Colegio “Cesar
Cordero y Andrade”

 Dificultad de que el Portal se dé a conocer: El internet hoy en día se ha convertido

25
 en una gran red mundial, Con millones de portales web, ofreciendo a usuarios
millones de servicios de todo tipo, Por esta situación se crea la desventaja de que el
portal no se dé a conocer, ya que existirán en la red miles de portales ofreciendo
servicio similares.
 Capacidades en Programación Web: Dependencia de algún individuo con
conocimientos en programación web para realizar el mantenimiento.
 Conexión a internet: Es necesario estar conectado a Internet para acceder al Portal y a
todos sus servicios.
 Costo de Diseño e Implementación: Existen servicios de alojamiento gratuito, pero
existen grandes desventajas como: el espacio para las páginas web es limitado, los
motores de búsqueda ignoran estos portales, los visitantes dudan de la credibilidad,
brinda poca seriedad, no existe garantía de disponibilidad y permanencia del sitio.
Esta situación afecta mucho a las instituciones que ofrecen servicios a los usuarios,
Por todo esto para que el Colegio demuestre seriedad, confiabilidad,
profesionalismo a todos sus usuarios, resulta conveniente invertir en la
implementación del Portal, comprando dominio y contratando servicio de hosting.

2.2 SISTEMA GESTOR DE CONTENIDOS (CMS)

Para gestionar los contenidos del portal web de manera fácil, rápida y eficiente, es preciso
utilizar un CMS. A continuación se detallara más sobre este tema.

2.2.1 Definición

CMS es una herramienta que permite crear y administrar cualquier tipo de información
en una página web.
Consiste en una interfaz que controla una o varias bases de datos donde se aloja el
contenido del sitio. El sistema permite manejar de manera independiente el contenido y
el diseño. Así, es posible manejar el contenido y darle en cualquier momento un diseño
distinto al sitio sin tener que darle formato al contenido de nuevo, además de permitir la
fácil y controlada publicación en el sitio a varios editores. (Taringa, 2008)

26
2.2.2 Funcionamiento

Figura 2-1. Funcionamiento de un CMS2

En esta imagen, podemos ver la cantidad de personas que participan en la creación de

diferentes contenidos sea este para diseño, generadores de contenido, editores,
colaboradores, etc., que son aprobados y posteriormente publicados.

Un CMS a menudo funciona en el servidor del sitio web. Muchos sistemas

proporcionan diferentes niveles de acceso dependiendo del usuario, variando si es el
administrador, editor, o creador de contenido. El acceso al CMS es generalmente vía el
navegador, y a veces se requiere el uso de FTP para subir contenido, generalmente
fotografías o audio.

Los creadores de contenido crean sus documentos en el sistema. Los editores comentan,
aceptan o rechazan los documentos. El editor en jefe es responsable por publicar el
trabajo en el sitio. El CMS controla y ayuda a manejar cada paso de este proceso,
incluyendo las labores técnicas de publicar los documentos a uno o más sitios. En
muchos sitios con CMS una sola persona hace el papel de creador y editor. (Taringa,
2008)

2.2.3 Tipos De Gestores De Contenidos

“Los gestores de contenido se pueden clasificar según diferentes criterios:

Por sus características

2
Figura disponible en : http://www.unpocogeek.com/2009/07/13/funcionamiento-de-un-cms-y-claves-
para-elegir-el-nuestro
27
  Según el lenguaje de programación empleado, como por ejemplo Active Server
Pages, Java, PHP, ASP.NET, Ruby On Rails, Python
 Según la licencia: Código abierto o Software privativo
Por su uso y funcionalidad
 Blogs; pensados para páginas personales.
 Foros; pensados para compartir opiniones.
 Wikis; pensados para el desarrollo colaborativo.
 Enseñanza; plataforma para contenidos de enseñanza on-line.
 Comercio electrónico; plataforma de gestión de usuarios, catálogo, compras y
pagos.
 Publicaciones digitales.
 Difusión de contenido multimedia.
 Propósito general.” (Wikipedia, 2010)

Algunos Gestores de Contenidos

 MOODLE

Moodle es una aplicación de código abierto, orientada a la creación de sitios de

aprendizaje en línea

 DRUPAL

Drupal es un gestor modular multipropósito y muy configurable que permite crear y

gestionar comunidades en internet, por la gran cantidad de módulos disponibles
permite crear gran cantidad de sitios web diferentes
Uno de los CMS más populares, gratuito y open source. Creado en PHP y con
posibilidad de utilizar varias bases de datos distintas, por defecto MySQL.

 WORDPRESS
El CMS para la creación de blogs por excelencia. El más utilizado y el mejor valorado,
también creados en PHP y gratuito.

 TYPO3
Es una herramienta de gestión de contenido muy completa de software libre. Facilita
diseñar un sitio web con todo lo que implica: estructura multinivel, motor de búsquedas,

28
gestión de autoría y publicación de contenidos, mecanismo de uso de plantillas para la
maquetación de páginas, etc.

 OSCOMMERCE:
El sistema gestor de contenidos de código libre, para la creación de una tienda online
Desarrollado en php y requiere de una base de datos MySql y un servidor Apache

2.3 SISTEMA GESTOR DE CONTENIDOS JOOMLA

Figura 2-2. Logo de Joomla

2.3.1 Definición

Joomla es la herramienta líder en la creación de webs, de código abierto, programado

en PHP, bajo una licencia GPL, este gestor de contenidos puede trabajar en Internet o
intranets y utiliza base de datos MYSQL y servidor HTTP Apache. Tiene a
disposición más de 4.500 componentes para ampliar funcionalidades de un sitio web

Joomla permite hacer sitios más personalizables mediante la creación e instalación de

aplicaciones, para ello utiliza las llamadas Extensiones

2.3.2 Características

 La información se organiza en secciones y categorías lo que facilita la

navegabilidad para los usuarios y para los administradores es posible crear,
editar, borrar las categorías y secciones, según convenga de manera ordenada y
sencilla.
 Es fácil crear páginas ilimitadas y editarlas.
 Joomla permite instalar, desinstalar y administrar componentes y módulos que
ofrecerán servicios a los usuarios
 Crear módulos y componentes adicionales según las necesidades del portal o
del usuario

29
  Permite cambiar todo el aspecto del sitio de manera sencilla mediante un
sistema de Templates
 Joomla posee una utilidad para subir imágenes al servidor y usarlas en todo el
sitio.
 Posee un sistema de votaciones y encuestas dinámicas con resultados en barras
porcentuales.
 Posee un sistema de estadísticas de visitas al portal
 Trae un sistema de administración de usuarios
 Sistema de sindicación de noticias para poder publicar los artículos de forma
automática
 Es posible hacer publicidad en el sitio usando el Administrador de Banners
 Las páginas y documentos pueden programarse con fecha de publicación y
fecha de caducidad.

2.3.3 Ventajas

 Fácil instalación
 Fácil manejo
 Permite, de forma sencilla, hacer una implementación rápida y elegante de un
portal web.
 Dispone de gran cantidad de módulos y componentes para utilizarlos en todo el
sitio Web.
 Brinda seguridad
 Idioma en Español
 Continuamente se va renovando

2.3.4 Extensiones

“Una extensión se usa para agregar una capacitación a Joomla que, por defecto y en su
código base, no están disponibles. Aquí hay unos ejemplos de las cientos de extensiones
que hay disponibles” (Joomla Spanish Group, 2011)
 Constructores dinámicos de formularios
 Negocios u organizaciones

30
  Gestión de documentos
 Galerías de imágenes y multimedia
 Comercio electrónico y carritos de compra
 Foros y chat
 Calendarios
 Correo
 Datos y herramientas de informe
 Sistemas de anuncios
 Sistemas de suscripción a servicios

2.3.4.1 Tipos De Extensión

Hay cinco tipos de extensiones:

 Componentes
 Módulos
 Plantillas
 Plugins
 Idiomas

1. Componentes

Un componente es el más largo y complejo de los tipos de extensión que hay. Los
componentes, son como mini-aplicaciones independientes entre sí que gestionan la
información dentro de Joomla. Los componentes añaden distintas funcionalidades a
Joomla convirtiéndolo en un gran un portal web.
Un componente puede manejar datos, mostrar configuraciones, proveer funciones, y en
general puede llevar a cabo cualquier operación no contemplada por las funciones
generales del código del núcleo
A continuación se mencionan algunos componentes:
 Contactos
 Página de inicio
 Servidor de noticias
 Correo masivo
 Calendario
 Encuestas

31
 2. Módulos

Los módulos se usan para pequeñas partes de la página y generalmente son menos
complejos y capaces de verse a través de los distintos componentes. Los módulos son
como mini-utilidades que pueden ubicarse en cualquier lugar de tu sitio. Los módulos a
veces funcionan en conjunción con algún componente y otras veces son independientes.
Los módulos se pueden asignar a una posición de módulo la cual haya sido definida en
la plantilla y también dentro de la administración, usando el gestor de módulos y de
posiciones en disponibles.
A continuación se mencionan algunos módulos de Joomla:
 Ruta
 Anuncios
 Pie de Página
 Wrapper
 Encuestas

3. Plantillas
Una plantilla es una serie de archivos que controlan la presentación el mismo en el
CMS. La plantilla es el diseño básico y fundamental para visualizar un sitio web, las
plantillas trabajan de la mano con el contenido almacenado en la base de datos. La
plantilla determina el estilo CSS de los contenidos, además determina el estilo de los
enlaces, ruta de navegación, el tamaño, color de texto, etc.

4. Plugins
Una de las extensiones más avanzadas para Joomla es el Plugin. En las versiones
anteriores a Joomla! se los conocía como Mambots. Un plugin es una sección de código
que corre cuando ocurre algún evento predefinido dentro de Joomla. Usar un plugin
permite al desarrollador decidir la manera en que su código se comporta dependiendo de
los plugins que haya instalados para reaccionar a los eventos.

5. Idiomas
Los archivos del idioma habilitan todas las interfaces de usuario tanto para el frontend
como para el backend de manera predeterminada en nuestro idioma local preferido.
Nota que estos paquetes no tienen ningún impacto sobre el contenido actual como
puedan ser los artículos.

32
2.4 PATRON MVC
El patrón de diseño MVC son las siglas de Model View Controller, es decir, Modelo
Vista Controlador, es un patrón de arquitectura de software que separa los datos de una
aplicación, la interfaz de usuario, y la lógica de control en tres componentes distintos.
De esta manera facilitará el mantenimiento del componente, y lo hará más fácil, de
extender al mismo tiempo que resultará más fácil de leer por otras personas

2.4.1 Elementos

Una aplicación web basada en este patrón separa su código en tres partes diferenciadas:

 El controlador: el controlador es el punto de entrada de la aplicación, se mantiene a

la escucha de todas las peticiones, ejecuta la lógica de la aplicación, y muestra la vista
apropiada para cada caso.

 El modelo: el modelo contiene todo el código relacionado con el acceso a datos. Es

importante que sea un código lo más genérico posible y se pueda reutilizar en otras
situaciones y proyectos. Nunca incluiremos lógica en el modelo, solamente consultas a
la base de datos y validaciones de entrada de datos.

 La vista: la vista contiene el código que representará lo que nosotros veremos por
pantalla, en este caso se trata de código HTML. (NOSOLOCODIGO, 2008)

La siguiente figura muestra el funcionamiento del patrón MVC con los tres elementos

33
 Figura 2-3. Funcionamiento del patrón MVC3

2.5 SOFTWARE DE LIBRE DISTRIBUCIÓN

2.5.1 Definición De Software Libre

Software libre es aquel software que una vez que se lo adquiere, el usuario tiene la
completa libertad de usarlo, modificarlo, estudiarlo, distribuirlo. Se lo confunde muchas
veces con software gratis. El Software libre se lo encuentra disponible gratuitamente o
al precio de costo de la distribución a través de otros medios, además puede ser vendido
comercialmente.

“El software es "libre" si garantiza las siguientes libertades:

 Libertad 0: La libertad de ejecutar el programa, para cualquier propósito

 Libertad 1: La libertad de estudiar cómo funciona el programa y
modificarlo, adaptándolo a las necesidades del usuario.
 Libertad 2: La libertad de copiar el programa y de redistribuir
 Libertad 3: La libertad de mejorar el programa y hacerlas públicas” (GNU,
2009)

El Código fuente del software libre se encuentra disponible para el usuario para su
utilización

2.5.2 Tipos De Licencia De Software

Una licencia de software es una autorización formal, o permisos que un autor de

3
Figura disponible en : http://www.proactiva-calidad.com/java/patrones/mvc.html
34
software da a quienes lo vayan a utilizar para la distribución, modificación, uso.
Principalmente en este contrato se acuerdan: la instalación, alcances de uso,
reproducción, copias, etc.

Cuando una persona decide, descargar, instalar un software, acepta las condiciones de
licencia para hacer uso de dicho software

 Licencia GNU GPL (General Public License)

La Licencia Publica Genaral es la licencia que acompaña los paquetes distribuidos por
el Proyecto GNU y fue creada por Free Software Foundation en el año de 1989, brinda
al usuario el derecho a usar un programa licenciado bajo GPL, modificarlo y distribuir
las versiones modificadas de éste.

GPL fue creada para mantener la libertad del software y evitar que alguien quisiera
apropiarse del programa. Esta licencia indica que el software debe ser gratuito y que el
paquete final, también debe ser gratuito, asegurándose siempre de mantener los nombres
y créditos de los autores originales.

 Licencia con Copyleft.

El Software protegido con Copyleft autoriza al usuario la libertad de la ejecución,

copia, modificación, y la distribución de las versiones modificadas, pero sin que se
añada ninguna restricción para su utilización.

 Software con Dominio Público.

El Software con dominio público no está protegido por las leyes del derecho de autor, y
pueden ser copiados sin costo, es un caso especial de software libre no protegido con
copyleft, que significa que algunas copias o versiones modificadas no pueden ser libres
completamente Algunos tipos de copia o versiones modificadas pueden no ser libres si
el autor impone restricciones adicionales en la redistribución del original o de trabajos
derivados.

 Freeware.

35
Es una licencia donde se autoriza el uso del software de manera gratuita y libre por
tiempo ilimitado, es utilizada para programas que permiten la redistribución pero con
algunas restricciones como no la modificación, no venderla, y dar cuenta de su autor, a
veces se incluye el código fuente. Estos programas no son software libre.

 Shareware.

Es una licencia que autoriza el uso del software de manera completa pero su utilización
implica pago, el código fuente no se encuentra disponible, por lo que resulta imposible
realizar modificaciones.

El usuario puede probar el producto durante un tiempo antes de comprarlo, evitando el

riesgo de un desembolso por algo que no está seguro si le será útil.

 Open Source

El código fuente del software de código abierto está disponible públicamente. Un

programa de código abierto puede ser software libre, pero también puede serlo un
programa por el que hay que pagar

El Código Abierto permite que varios programadores puedan leer, modificar y

redistribuir el código fuente de un programa, por lo que ese programa evoluciona
constantemente

“Las licencias deben cumplir diez condiciones para ser consideradas licencias de
software abierto:

1. Libre redistribución: el software debe poder ser regalado o vendido libremente.

2. Código fuente: el código fuente debe estar incluido u obtenerse libremente.
3. Trabajos derivados: la redistribución de modificaciones debe estar permitida.
4. Integridad del código fuente del autor: las licencias pueden requerir que las
modificaciones sean redistribuidas solo como parches.
5. Sin discriminación de personas o grupos: nadie puede dejarse fuera.
6. Sin discriminación de áreas de iniciativa: los usuarios comerciales no pueden ser
excluidos.
7. Distribución de la licencia: deben aplicarse los mismos derechos a todo el que
reciba el programa.
36
8. La licencia no debe ser específica de un producto: el programa no puede
licenciarse solo como parte de una distribución mayor.
9. La licencia no debe restringir otro software: la licencia no puede obligar a que
algún otro software que sea distribuido con el software abierto deba también ser de
código abierto.
10. La licencia debe ser tecnológicamente neutral: no debe requerirse la aceptación
de la licencia por medio de un acceso por clic de ratón o de otra forma específica del
medio de soporte del software. “ (Source, 2008)

2.5.3 Copyright

Son derechos del autor para utilizar un programa, derechos para ejecutar, copiar,
modificar o distribuir el programa, Ninguna persona, más que su autor, puede utilizar
el programa, salvo el caso, con el permiso del propietario de los derechos.

El programa de nueva creación podrá licenciarse de la forma que su autor quiera,

siempre que no utilice ningún código ajeno.

El copyright protege la propiedad y la identidad del trabajo de su creador.

2.5.4 Ventajas De Software Libre

Las ventajas de utilizar software libre para el desarrollo del Portal Web son las
siguientes:

 Libre Uso, cualquier persona puede usarlo.

 Gratuito, no tiene un costo asociado.
 Libre distribución y redistribución, cualquier persona puede regalarlo, venderlo
o prestarlo.
 Libertad de Conocimiento, fomenta el trabajo colaborativo en el desarrollo de la
informática.
 Rápida corrección de errores, facilitado su libre acceso al código fuente.
 Libertad de modificar y mejorar los programas tantas veces se quiera o las
necesidades del usuario
37
  Traducir, Posibilidad de traducir a cualquier idioma.
 Fácil acceso por parte del sector educativo público y privado.
 Ayuda al aprendizaje, cuando los alumnos quieren empezar a aprender cómo
funcionan los programas, es más factible que aprendan a leer y escribir códigos.
 Asegura la durabilidad de la información y su migración, gracias al acceso al
código fuente.
 Disminuye los riesgos de "puertas traseras" que introduzcan códigos maliciosos
o de espionaje.
 Elimina el derecho exclusivo de la innovación.

2.5.5 Desventajas De Software Libre

Las desventajas que presenta la utilización de software libre en el desarrollo del

Portal Web son:

 Garantía, No tiene garantía del usuario

 Dificultad en la instalación y migración de datos para el usuario común.
 Poco conocimiento, Pocos profesionales en el mercado con conocimientos
sólidos en software libre.
 Soporte, No existe soporte técnico propio
 Recursos, Se necesita dedicar recursos a la reparación de errores
 Configuración, Para su configuración se requieren conocimientos previos de
funcionamiento del sistema operativo.
 Implementación, Para su implementación se necesitan conocimiento previo de
programación.
 Monitoreo, Se debe monitorear en forma constante la corrección de errores por
Internet.
 Control de Calidad, No existe un control de calidad previo.
 Aplicaciones, Hay aplicaciones específicas que no se encuentran en el software
libre.
 Uso, Baja expansión de su uso en centros educativos.
 Difusión Baja difusión en publicaciones.
 Desempeño, En ambientes de red todavía hay software propietario con mejores
38
 desempeños.

2.5.6 Licencia De Software Libre A Utilizar En El Portal Web

Luego de haber realizado un estudio de los distintos tipos de licencia de software libre
que existen en la actualidad, elegiremos el tipo de licencia a utilizar para el diseño del
portal WEB.

El Portal web necesitara los siguientes requerimientos de software para su diseño e

implementación:

 Base de Datos
 Servidor Web
 Lenguaje de Programación
 CMS (Sistema de Gestor de Contenidos) Joomla

En los siguientes capítulos se elegirá y analizará cada uno de estos programas a utilizar

Para la adquisición de los diferentes programas se elegirán las licencias: la Licencia

Pública General de GNU y la licencia Open Source

Joomla es un gestor de contenidos de código abierto y bajo licencia GPL.

39
 CAPÍTULO III

3. ANALISIS DE REQUERIMIENTOS

3.1 DEFINICIÓN DE REQUERIMIENTO

Un requerimiento es la descripción de las características necesarias, que debe cumplir
un sistema a desarrollarse para que tenga valor y utilidad al usuario

Los requerimientos muestran las necesidades, servicios y restricciones que debe cumplir
un sistema para su desarrollo.

Algunos requerimientos podemos mencionar como: Panorama general, Metas,

Funciones del sistema, Atributos del sistema, etc.

Las características que debe cumplir un requerimiento son los siguientes:

 Consistente: Un requerimiento debe ser seguro y no se debe contradecir con

otro requerimiento
 Completo: Un requerimiento debe ser bien detallado, teniendo en cuenta todas
las condiciones que puedan ocurrir.
 Obligatorio: Un requerimiento no debe faltar o ser reemplazado, si presenta
características definida por los desarrolladores del sistema.
 Cohesión: Un requerimiento debe referirse sola a una cosa.
 Necesario: El requerimiento es necesario si cumple con la necesidad declarada
por los interesados en el sistema.
 Verificable: Es verificable si su implementación debe poder ser comprobada.
 Conciso: Un requerimiento debe tener su redacción simple, ser fácil de leer y
entender.
 No Ambiguo: Un requerimiento debe tener una sola interpretación
 Viable: El requerimiento debe poder ser implementado según las restricciones
actuales de tiempo, dinero y recursos disponibles. (Alegsa)

40
3.2 TIPOS DE REQUERIMIENTOS
 Requerimientos funcionales: Son descripciones de los servicios o funciones que
ofrecerá el sistema sus entradas y salidas, excepciones, etc. Es decir todo lo que
debe hacer el sistema, en algunos casos, describe lo que el sistema no debe hacer.
Los requerimientos funcionales dependen del tipo de software y del sistema que se
desarrolle y de los posibles usuarios del software.

 Requerimientos no funcionales: Son declaraciones sobre las restricciones (tiempo,

estándares, proceso de desarrollo, etc.) de los servicios o funciones ofrecidos por el
sistema. Es decir describe como debe funcionar el sistema, las propiedades del
sistema que tiene que ver con las características funcionales son: rendimiento
calidad, facilidad de uso, fiabilidad, velocidad, uso de memoria, plataforma,
seguridad, etc.)

Los requerimientos no funcionales son adicionales a los requerimientos funcionales

que debe cumplir el sistema

Los requerimientos no funcionales surgen de la necesidad del usuario, debido a las

restricciones en el presupuesto, políticas de la organización, necesidad de
interoperabilidad con otros sistemas de software o hardware o a factores externos
como los reglamentos de seguridad, políticas de privacidad, etcétera.

3.3 ANÁLISIS DE REQUERIMIENTOS PARA EL

PORTAL WEB A DESARROLLAR

1. Requerimientos Funcionales para el Portal Web

Interfaz Grafica

 El portal web brindara una interfaz grafica amigable con el usuario y fácil de
utilizar

Funcionalidades del Portal:

41
 El portal, deberá contar con las siguientes secciones:
 Sección de Información del Colegio: El Portal deberá permitirme el acceso
y la actualización de información referente a la institución, sea esta: sobre su
historia, horarios de clases, sus docentes, Himno Nacional.
 Sección de Manejo de Eventos: El portal debe permitirme administrar los
eventos que ocurren en la institución, estos permitirán a los estudiantes y
padres de familia mantenerse informados sobre las actividades del colegio.
 Sección de Noticias: El Portal deberá permitirme el ingreso de las noticias
actuales que sucedan en la institución, se usara como herramienta de
información y publicidad.
 Sección de Galería de Imágenes: El portal debe permitirme administrar la
galería de imágenes.

 El portal deberá permitir la Gestión de Usuarios.

 Perfil del usuario:
o Estudiante: Cada estudiante registrado tiene acceso especial a través
de un usuario y contraseña y al ingresar al portal con su cuenta,
podrá visualizar las notas, visualizar y actualizar su perfil, evaluar al
docente.
o Secretaria: La secretaria deberá poseer una cuenta restringida y con
privilegios especiales de acceso a la información, ya que ella podrá
ver los resultados de las evaluaciones, crear nuevas noticias, subir
los eventos de la institución, gestionar la galería de imágenes.
o Anónimo: Usuario visitante del portal, el cual no posee ningún
privilegio de acceso, sino solo Visualiza las secciones públicas del
portal.
o Es posible registrar a estudiantes nuevos en el portal.

 Servicio de consulta de Notas.

 El portal web dispondrá de un servicio de consulta de notas para los
alumnos del Colegio.
 Las notas serán consultadas al final de cada trimestre, o sea tres veces en el
periodo lectivo.
 Las notas serán ingresadas al portal por su Administrador, ya que será el la

42
 persona responsable de migrar los datos mediante una herramienta.
 Cada alumno podrá acceder al sistema para consultar sus notas con
autenticación.
 Los alumnos también pueden consultar las notas de los años lectivos
anteriores.

 Servicio de Evaluación
 El portal web dispondrá de un sistema de evaluación al docente
 Los alumnos deberán evaluar obligatoriamente a sus docentes, mediante un
banco de preguntas y calificarlo.
 Este servicio se activara a partir de una fecha y durara cierto tiempo
 Estas evaluaciones se realizaran una vez en el periodo lectivo
 Para el servicio de evaluación cada alumno tendrá que acceder con
autenticación.

 Migración de Foxpro a Mysql

La base de datos local de FoxPro deberá migrarse a la base de datos de MySQL del
Portal mediante una herramienta. Este proceso se realizara cada trimestre, cuando se
actualiza la base de datos del sistema del Colegio

2. Requerimientos No Funcionales para el Portal Web

Amigabilidad

 El sistema tendrá una interfaz amigable con el usuario, de manera que el usuario
entienda todo lo ve en portal, y saber lo que debe hacer. Para ello se debe tomar en
cuenta lo siguiente:

El idioma será en español

El formato de cada página será el apropiado.

 Colores adecuados que no afecten la vista del contenido del sitio.

 Tamaño y tipo de letra: Tipo de letra legible y no pequeña.
 Título de las páginas: las páginas del portal deben estar correctamente

43
 tituladas. esto ayudara demás en la indexación de los buscadores

Disponibilidad.

 El portal web estará disponible los 365 días del año, las 24 horas del día y los 7 días
de la semana.
 Con la utilización de cualquier navegador de Internet

Rendimiento.

Los tiempos de respuesta esperados para la ejecución en línea de los servicios (consulta
de notas, evaluación al docente) deben ser óptimos y adecuados para el usuario, para
ello se debe tomar en cuenta lo siguiente:

 Las páginas que componen el portal deben tener el menor tamaño posible,
así como los textos, las imágenes deben tener un buen formato y un peso
adecuado para mejor rapidez.
 El sistema contara con interfaces desarrollados en PHP y con
almacenamiento de los datos en la Base de Datos de MySQL
 Deberá soportar los navegadores más conocidos como: Mozilla Firefox e
Internet Explorer
 El sistema tendrá la posibilidad de evolucionar en base a las necesidades del
Colegio y de los estudiantes

Desempeño.

 El sistema brindara confiabilidad, seguridad a los diferentes usuarios, así toda la

información disponible podrá ser consultada y actualizada en todo momento, sin
tener contratiempos de respuesta.

Escalabilidad.

 El Portal Web debe permitir en un futuro las acciones de eliminar, modificar,

actualizar funcionalidades una vez que el portal Web este funcionando sin afectar el
desempeño y funcionalidad actual.

44
3.4 DIAGRAMAS DE ANALISIS
Para el diseño del portal web deberemos basarnos en un estándar de Ingeniería de
Software que tenga unos sólidos cimientos y una fuerte estabilidad, para este proyecto
se utilizarán los siguientes diagramas:

 Diagramas de Caso de Uso: Estos diagramas proporcionan uno o más escenarios

que indican cómo deberían interactuar el sistema con los usuarios o con otros
sistemas para conseguir un objetivo específico.
 Diagramas de Secuencia: El diagrama de secuencia es uno de los diagramas más
efectivos para modelar interacción entre objetos en un sistema. Un diagrama de
secuencia muestra la interacción de un conjunto de objetos en una aplicación a
través del tiempo
 Diagramas de Estados: Los diagramas de estado muestran el conjunto de estados
por los cuales pasa un objeto durante su vida en una aplicación en respuesta a
eventos (por ejemplo, mensajes recibidos, tiempo rebasado o errores), junto con sus
respuestas y acciones.

45
3.4.1 Diagramas De Casos De Uso

Universidad Politecnica Salesiana

PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Migracion de datos
Fecha: 11 de Enero del 2011

MIGRACION DE DATOS

Selecciona tablas

<<include>
<<include> >
> >
>
Abre herramienta
<<include>
para
> migrar
SECRETARIA <<include>
> >
<<include>
> >
>
Selecciona SIST. COLEGIO
tablas a migrar

<<include>
>
>
Convierte dbf
<<include>
a sql > Autentificación
de usuario <<include>
>
>
<<include> >
Abre archivos
sql >
>
Ejecuta Panel del Administrador
sentencias sql
<<include>
> <<include>
> >
Copia >
codigo

Realizado por: Marithza Siguencia Siguencia

46
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Migracion de Datos
Fecha: 11 de Enero del 2011
Caso de Uso: Migración de Datos

Objetivos: Permitir a la Secretaria migrar datos de la base de datos local a

la base de datos del portal (FoxPro a MySql)

Precondiciones: 1. La secretaria debe tener acceso al Panel de Control del

Portal Web
2. Ingresa al panel del Control con previa autentificación
Poscondiciones: PhpMyAdmin

Actor Principal: La Secretaria

Actores Secundarios: Panel de Control, Sistema del Colegio, Herramienta de

Migración

Descripción 1. La secretaria elige las tablas a migrar del sistema del

Colegio
2. Con la Herramienta “DBF to SQL converter software”
realiza los siguientes pasos
a. Abre la Herramienta
b. Selecciona el archivo a transformar
c. Seleccionar “ Use `` ”
d. Seleccionar SQL type: “ MySql”
e. Luego seleccionar “Start Converting”
f. Se creara un nuevo archivo en la misma ubicación
3. Se abre el Archivo, se selecciona todo, y se “copia”
4. En el Cpanel seguimos los siguientes pasos
a. Selecciona la opcion phpMy Admin
b. Seleccionar SQL
c. Aquí se “pega”
d. Seleccionar Continuar
5. Si no ha ocurrido error, se ha realizado la migración
satisfactoriamente.

Extensión

Realizado por: Marithza Siguencia

47
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Consulta de Notas
Fecha: 11 de Enero del 2011

CONSULTA DE NOTAS

Ingresa al Portal

<<include>
>
>
Autentificación
ESTUDIANTE de usuario

<<include>
>
>
<<include>
>
Selecciona >
Consultar Notas
PORTAL WEB

Selecciona
Periodos Lectivos

Realizado por: Marithza Siguencia

48
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Consultar Notas
Fecha: 11 de Enero del 2011

Caso de Uso: Consulta de Notas

Objetivos: Permitir al estudiante consultar las notas obtenidas en cada

trimestre

Precondiciones: 1. El estudiante debe estar autentificado por el portal

2. Se debe iniciar la sesión de estudiante
Poscondiciones: Visualiza Calificaciones

Actor Principal: El estudiante

Actores Secundarios: EL portal Web(componente de consulta de Notas)

Descripción 1. El estudiante selecciona la opción Consultar Notas

2. El sistema muestra todas las materias con sus respectivas
notas pertenecientes a cada trimestre
3. El estudiante selecciona “Imprimir”, aparecerá una pantalla
con las calificaciones en formato pdf.

Extensión El estudiante sale del Sistema.

Se cierra la sesión del Estudiante.

Realizado por: Marithza Siguencia

49
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Autentificación de Usuario
Fecha: 11 de Enero del 2011

Caso de Uso: Autentificación de Usuario

Objetivos: Permitir al usuario, que está intentando iniciar sesión validar

que sea quien dice ser y esté registrado en el portal.

Precondiciones: La conexión a la base de datos debe estar disponible

Poscondiciones: El acceso a menús correspondientes

Actor Principal: Secretaria, Estudiante

Actores Secundarios: EL portal Web

Descripción 1. El Usuario debe ingresar su Nombre de Usuario en la caja de

texto con el nombre "Usuario".
2. El Usuario debe ingresar su Contraseña en la caja de texto
con el nombre "Contraseña".
3. El Usuario debe Presionar el botón llamado Ingresar.

Extensión 1. Se habilita las opciones que un estudiante puede tener

acceso.
2. Le permite observar los ítems de Perfil, Consultar Notas,
Evaluar Docente, Periodos Lectivos, Página Personal

Realizado por: Marithza Siguencia

50
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Periodos Lectivos
Fecha: 11 de Enero del 2011

Caso de Uso: Periodos Lectivos

Objetivos: Permitir al estudiante consultar las notas obtenidas en los

periodos Lectivos anteriores

Precondiciones: 1. El estudiante debe estar autentificado por el portal

2. Se debe iniciar la sesión de estudiante
Poscondiciones: Seleccionar el Periodo Lectivo

Actor Principal: El estudiante

Actores Secundarios: EL portal Web(componente de Periodos Lectivos)

Descripción 1. El estudiante selecciona la opción Periodos Lectivos

2. Se Visualiza los periodos Lectivos
3. El estudiante selecciona el Periodo Lectivo que desee ver
las notas

Extensión 3’ Usted no presenta notas en este periodo Lectivo o no estuvo

matriculado
Se muestra al estudiante un mensaje notificándole que en
ese periodo lectivo no estuvo matriculado
1.3’ El estudiante sale del Sistema.
Se cierra la sesión del Estudiante.
Realizado por: Marithza Siguencia

51
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Evaluar Docente
Fecha: 11 de Enero del 2011

EVALUAR DOCENTE

Ingresa al Portal

<<include>
>
>
Autentificación
ESTUDIANTE <<include> de usuario
>
>

Si esta activado
Selecciona Evaluar
Docente

PORTAL WEB
<<include>
>
>
Selecciona
Profesor

<<include>
>
>Contesta
Cuestionario

<<include>
>
> Guarda

Realizado por: Marithza Siguencia

52
 UNIVERSIDAD POLITECNICA SALESIANA
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
DOCUMENTO DE ANALISIS

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Evaluar Docente
Fecha: 11 de Enero del 2011

Caso de Uso: Evaluar Docente

Objetivos: Permitir al estudiante evaluar al Docente, si esta opción se

encuentra activada

Precondiciones: 1. El estudiante debe estar autentificado por el portal

2. Se debe iniciar la sesión de estudiante
Poscondiciones: El acceso a menús correspondientes

Actor Principal: El estudiante

Actores Secundarios: EL portal Web(Modulo de Evaluación al Docente)

Descripción 1. El estudiante selecciona la opción Evaluar Docente

2. El sistema muestra todos los Docentes con las materias que
imparte, pertenecientes al estudiante
3. El estudiante selecciona el docente
4. El sistema muestra un banco de pregunta en donde el
estudiante evalúa, utilizando esta escala de valoración:
Siempre (5), Casi Siempre(4), Algunas Veces(3), Rara vez(2),
Nunca(1).
5. El estudiante Guarda
6. Continua evaluando y vuelve al paso 3

Extensión 3’ Usted no ha seleccionado al profesor que desea calificar,

por favor inténtelo de nuevo.
El sistema envía un mensaje y debe volver a seleccionar
4’ No ha terminado la evaluación
Se visualiza un mensaje notificando que se debe terminar de
evaluar
6’ Continuar evaluando
El sistema envía un mensaje y el estudiante debe continuar
evaluando.
1.6’ El estudiante sale del Sistema.
Se cierra la sesión del Estudiante.

Realizado por: Marithza Siguencia

53
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Consultar Evaluaciones
Fecha: 11 de Enero del 2011

CONSULTAR EVALUACIONES

Ingresa al Portal

<<include>
>
>
Autentificación
SECRETARIA <<include> de usuario
>
>
Selecciona
Evaluaciones

PORTAL WEB

Cierra
Sesión

Realizado por: Marithza Siguencia

54
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Consultar Evaluaciones
Fecha: 11 de Enero del 2011

Caso de Uso: Consultar Evaluaciones

Objetivos: Permitir a la secretaria ver el resultado de las evaluación a los

docentes

Precondiciones: 1. La secretaria debe estar autentificado por el portal

2. Se debe iniciar la sesión de la secretaria
Poscondiciones: El acceso a menús correspondientes

Actor Principal: La secretaria

Actores Secundarios: EL portal Web

Descripción 1. La secretaria selecciona la opción Evaluaciones

2. El sistema muestra los resultados de las Evaluaciones por curso
por materia y por profesor.
3. La calificación para cada docente es sobre 100
4. Los resultados se presentan en formato pdf.

Extensión La secretaria sale del Sistema.

Se cierra la sesión.

Realizado por: Marithza Siguencia

55
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Ultimas Noticias
Fecha: 11 de Enero del 2011

ADMINISTRACIÓN DE NOTICIAS

Definir categorías
para noticias

<<include>
>
>
Autentificación
<<include>
de usuario
Secretaria >
> titulo de
Crea
noticia

<<include>
>
Selecciona
> una
categoría Administración Joomla

<<include>
>
<<include>
> Noticia
Redactar >
>
<<include>
<<include> >
> >
>Verificar
formato

<<include>
>
Guardar
>
Noticia

Publicar
Noticia

Modificar
Noticia
Usuario Anónimo

Navegar por la
publicación

Realizado por: Marithza Siguencia

Universidad Politecnica Salesiana

56
 PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Ultimas Noticias
Fecha: 11 de Enero del 2011

Caso de Uso: Administración de Noticias

Objetivos: Permitir a la Secretaria crear y publicar diferentes temas de noticias.

Permitir a la comunidad en general informarse de los distintos eventos

proyectos que el Colegio este llevando a cabo

Precondiciones: Tener creados roles de publicador para crear una noticia.

Autentificar usuario y contraseña
Poscondiciones: Visualizar las diferentes noticias a través de una fácil navegación

Actor Principal: La Secretaria, Usuario Anónimo

Actores Secundarios: El portal Web, Administrador de Joomla

Descripción 1. Se presenta Administrador de Joomla donde se pide que ingrese el usuario y

contraseña
2. Validar si es un usuario que tiene privilegios de acceso al sistema.
3. La secretaria previa autenticación podrá realizar las siguientes acciones:
3.1 Escoger la opción creación de noticias
3.2 Crear categorías para clasificar noticias.
4. Para crear las noticias se tendrá que seguir la siguiente secuencia.
4.1 Ingresar un titulo.
4.2 Escoger la categoría
4.3 Redactar la introducción, este texto junto con el titulo se presentará
en el portal para su fácil navegación a manera de link.
4.4 Redactar el cuerpo de la noticia, en donde se podrá incluir
imágenes, links, etc.
4.5 Dar formato al texto de la noticias (justificar, centrar negrita, etc.).
4.6 Guardar la noticia.
4.7 Publicar la noticia.
4.8 Modificar o reeditar la noticia.
5. Se llevara un Registro del Historial de Noticias.
6. El usuario que desee visualizar la noticia tendrá que ingresar al portal,
seleccionar Ultimas Noticias, se le presentar el titulo y podrá visualizarla por
completo haciendo clic en la noticia
Extensión Cerrar Sesión

Realizado por: Marithza Siguencia

57
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Galeria de Imágenes
Fecha: 11 de Enero del 2011

ADMINISTRACIÓN DE GALERÍA DE IMAGENES

Definir categorías
para las galerías

<<include>
>
>
Autentificación
<<include>
de usuario
Secretaria >
>
Selecciona una
categoría

<<include>
>
Sube>imagen
Administración Joomla

<<include>
>
>
Describir imagen

<<include>
<<include> >
> >
>Publicar
imagen

<<include>
>
>

Eliminar
imagen

Navegar por
galería de
Usuario Anónimo imágenes

Realizado por: Marithza Siguencia

Universidad Politecnica Salesiana

58
 PORTAL WEB DEL COLEGIO CESAR ANDRADE Y CORDERO
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Galería de Imáges
Fecha: 11 de Enero del 2011

Caso de Uso: Administración Galería de Imágenes

Objetivos: Permitir a la Secretaria crear y publicar imágenes en las galerías.

Permitir a la comunidad en general visualizar imágenes referentes a las

actividades que se desarrollan en el Colegio.

Precondiciones: Tener roles de creador y publicador de galerías de imágenes

Autentificar usuario y contraseña
Pos condiciones: Visualizar las diferentes galerías a través de una fácil navegación

Actor Principal: La Secretaria, Usuario Anónimo

Actores Secundarios: El portal Web, Administrador de Joomla

Descripción 1. Se presenta Administrador de Joomla donde se pide que ingrese el usuario y

contraseña
2. Validar si es un usuario que tiene privilegios de acceso al sistema.
3. La secretaria previa autenticación podrá realizar las siguientes acciones:
3.1. Escoger la opción galería de Imágenes
3.2. Crear categorías para clasificar las imágenes.
4. Para subir publicar las imágenes se tendrá que seguir la siguiente
secuencia.
4.1 Escoger la categoría
4.2 Subir Imagen
4.3 Redactar la descripción de la imágen
4.4 Dar formato al texto de la noticias (justificar, centrar negrita, etc.). .
4.5Publicar la imagen.
4.6 Eliminar la imagen
5. Se llevara un Registro del Historial de Noticias.
6. El usuario que desee visualizar las imágenes tendrá que ingresar al
portal y seleccionar la galería correspondiente en donde se le
presentaran las respectivas imágenes.
Extensión Cerrar Sesión

Realizado por: Marithza Siguencia

59
 3.4.2 Diagramas De Secuencia

Universidad Politecnica Salesiana

PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Consultar Notas
Fecha: 11 de Enero del 2011

Consulta de Notas

Estudiante Portal Web Base de Datos Componente Consultar Notas

Ingresa

Pide autenticación

Ingresa usuario/contraseña

Verifica Datos

incorrecto
Retorna Error Correcto
Confirma Datos

Ingresa Consultar Notas

Consulta Notas

Notas Seleccinadas

Cierra Sesión

Salir

Realizado por: Marithza Siguencia

60
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Evaluacion al Docente
Fecha: 11 de Enero del 2011

Evaluación al Docente

Estudiante Portal Web Base de Datos Componente Evaluar Docente Docente

Ingresa

Pide autenticación

Ingresa usuario/contraseña

Verifica Datos

Retorna Error incorrecto

Correcto
Confirma Datos

Ingresa Evaluación al Docente

Selecciona Docente

Evalúa Docente

Guardar

Salir

Cierra Sesión

Salir

Realizado por: Marithza Siguencia Siguencia

61
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Evaluacion al Docente
Fecha: 11 de Enero del 2011

Consulta de Evaluaciones al Docente

Base de Datos Resultados de

Secretaria Portal Web Evaluaciones

Ingresa

Pide autenticación

Usuario/contraseña

Verifica Datos

Retorna Error Incorrecto

Correcto
Confirma Datos

Ingresa Consultar Resultados

retorna consulta

Salir

Cierra Sesión

Salir

Realizado por: Marithza Siguencia Siguencia

62
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Administracion de Noticias
Fecha: 11 de Enero del 2011

Administración de Noticias

Base de Datos Modulo Administración de

Secretaria Administración de joomla Noticias

Ingresa

Pide autenticación

Usuario/contraseña

Verifica Datos

Retorna Error Incorrecto

Correcto
Confirma Datos

Selecciona Ultimas Noticias

. .Define Grupo de Categorías de Noticias

Selecciona Categoría

Crear Título

Redactar Noticia

Guardar

Publicar

Cierra Sesión

Salir

Realizado por: Marithza Siguencia Siguencia

63
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Galeria de Imagenes
Fecha: 11 de Enero del 2011

Galería de Imágenes

Secretaria Administración de joomla Base de Datos Modulo Galería de Imágenes

Ingresa

Pide autenticación

Usuario/contraseña

Verifica Datos

Retorna Error Incorrecto

Correcto
Confirma Datos

Selecciona Galería de Imágenes

. . Define categorías para las imágenes

Selecciona Categoría

Devuelve Categoría

Subir imagen
Foto cargada

Agregar Descripción

Publicar

Cierra Sesión Salir Guardar

Salir Guardado correctamente

Realizado por: Marithza Siguencia Siguencia

64
 3.4.3 Diagrama De Estados

Universidad Politecnica Salesiana

PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Consultar Notas
Fecha: 11 de Enero del 2011

Consultar Notas
Ingresar al Portal Autentificar usuario [No es estudiante]
Teclear dirección Introducir
Web usuario/contraseña

[Es Estudiante]

Ingresar sistema de
Consulta de Notas

Ver notas

Realizado por: Marithza Siguencia Siguencia

65
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Consultar periodos Lectivos
Fecha: 11 de Enero del 2011

Consultar Periodos Lectivos

Ingresar al Portal Autentificar usuario [No es estudiante]
Teclear dirección Introducir
Web usuario/contraseña

[Es Estudiante]

Consultar Periodos
Lectivos

[Tiene registrado notas]

[No tiene registrado notas]

Visualizar notas

Realizado por: Marithza Siguencia Siguencia

66
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Componente: Evaluar Docente
Fecha: 11 de Enero del 2011

Evaluar Docente
Ingresar al Portal Autentificar usuario [No es estudiante]
Teclear dirección Introducir
Web usuario/contraseña

[Es Estudiante]
Seleccionar opción
Evaluar Docente

[Esta Activado]

[No está activado] Seleccionar

Docente

Evaluar

Guardar

[Hay docentes para evaluar]

[No hay docentes para evaluar]

Realizado por: Marithza Siguencia Siguencia

67
 Universidad Politecnica Salesiana
PORTAL WEB DEL COLEGIO “CESAR ANDRADE Y CORDERO”
Documento De Analisis

Portal Web del Colegio Cesar Andrade y Cordero

Modulo: Noticias
Fecha: 11 de Enero del 2011

Crear, Modificar y Publicar Noticias

Usuario inicia
sesión

Ingresa al espacio de
Noticias

[Usuario Denegado]

[Usuario Aceptado]

Definir Grupo de
Categoría de Noticias

Crear Titulo
de la Noticia

Escoger
categoría

. [Crear noticia] [Modificar Noticia]

Redactar Noticia Modificar Noticia

Publicar

Realizado por: Marithza Siguencia Siguencia

3.5 DISEÑO DE LA BASE DE DATOS

68
3.5.1 Diagrama De Entidad-Relación

Diagrama de Entidad-Relación del sistema del colegio

Macursos

codcur
descri
especi
1 guicur

madatalu

1 1
Mamatcur
nummat
apenom
tipmat 1 codmat
tipsex codcur
fecnac codpro
pronac numhor
cannac tipcal
parnac tipmat
edaalu 1 matgra
nacalu
1
anrepe
proced
Macipro
nompad Macalnum 1 1
ocupad
nommad codpro
ocupmad apenom
nummat dompro
nomrep
codcur telpro
ocuprep
codmat cedula
dirrep
T11 fecnac
telrep
T12 1 fecmag
relrep
T13 1 feccol
codcur
T14 titulo
fecmat
T21 especi
numord
T22 numcar
cedula
T23
Observ
T24
numder
T31
status
T32
T33 1 1
T34
adidep
Mamater
sup
gra
fj1 codmat
fj2 descri
fj3
fi1
fi2
fi3

69
 Diagrama Entidad-Relación del Componente Consultar Notas

Macursos

codcur
descri
especi
1 guicur

madatalu

1 1
Mamatcur
nummat
apenom
tipmat 1 codmat
tipsex codcur
fecnac codpro
pronac numhor
cannac tipcal
parnac tipmat
edaalu 1 matgra
nacalu
1
anrepe
proced
nompad Macalnum 1
ocupad
nommad
ocupmad
nummat
nomrep
codcur
ocuprep
codmat
dirrep
T11
telrep
T12
relrep
T13 1
codcur
T14
fecmat
T21
numord
T22
cedula
T23
Observ
T24
numder
T31
status
T32 1 1
T33
T34
adidep
Mamater
sup
gra
fj1 codmat
fj2 descri
fj3
fi1
fi2
fi3

70
Diagrama Entidad-Relación del Componente Evaluar Docente

Macursos

codcur
descri
especi
1 guicur

madatalu

1
Mamatcur
nummat
apenom
tipmat 1 codmat
tipsex codcur
fecnac codpro
pronac numhor
cannac tipcal
parnac tipmat
edaalu 1 matgra
nacalu
anrepe
proced
Macipro
nompad 1 1
ocupad
nommad codpro
ocupmad apenom
nomrep dompro
ocuprep telpro
dirrep cedula
telrep fecnac
relrep 1 fecmag
codcur feccol
fecmat titulo
numord especi
cedula numcar
Observ
numder
status

Mamater

codmat
descri

71
 CAPÍTULO IV

4. ESTUDIO Y ELECCION DEL SOFTWARE DE

DESARROLLO

4.1 SERVIDOR WEB

4.1.1 Definición

Un servidor web es un software que constantemente se ejecuta en un ordenador

(servidor) y esta a la espera de peticiones de un cliente (navegador de internet), y se
encarga de contestar a estas peticiones, entregando como resultado la transferencia de
una página web, mostrada en el navegador de acuerdo a los recursos solicitados o
visualizando el mensaje correspondiente en caso de detectarse algún error utilizando la
misma conexión por la que recibió la petición. (Wikipedia, 2011)

La comunicación entre el ordenador del servidor y el ordenador del cliente se realiza

mediante el protocolo HTTP (HyperText Transfer Protocol) Protocolo de transferencia
de Hipertexto, o el protocolo HTTPS (la versión cifrada y autenticada) perteneciente a
la capa de aplicación del modelo OSI

El instalar un servidor web para este proyecto de tesis permitirá entre otras cosas, poder
montar la pagina web sin necesidad de contratar servicio de hosting, probar el
desarrollo en servidor local, acceder a los archivos de la pc desde un pc remoto.

4.2 SERVIDOR WEB APACHE

El servidor HTTP Apache es un servidor web HTTP más utilizado en el mundo.
Apache es utilizado para enviar páginas web estáticas y dinámicas en la World Wide
Web.

Muchas de las vulnerabilidades de seguridades descubiertas y resueltas son

aprovechadas solo por usuarios locales más no por usuarios remotos, aunque, algunas
veces se pueden manejar remotamente o explotar por usuarios locales malintencionados.

72
Apache utiliza la licencia Apache (Apache License o Apache Software License para
versiones anteriores a 2.0) es una licencia de software libre creada por la Apache
Software Foundation (ASF). Esta licencia es de Código Abierto y compatible con la
licencia GPL.

4.2.1 Arquitectura

El servidor Apache es un software que está constituido en módulos. La configuración de

cada módulo se hace mediante la configuración de las directivas que están contenidas
dentro del módulo. Los módulos del Apache se pueden clasificar en tres categorías:

 Módulos Base: Módulo con las funciones básicas del servidor Apache
 Módulos Multiproceso: son los responsables de la unión con los puertos de la
máquina, acepando las peticiones y enviando a los hijos a atender a las
peticiones
 Módulos Adicionales: Cualquier otro módulo que le añada una funcionalidad al
servidor.

4.2.2 Características

 Apache es un servidor web flexible, rápido y eficiente, continuamente

actualizado
 Trabaja sobre múltiples plataformas lo que lo hace prácticamente universal.
 Es posible adaptar a diferentes entornos y necesidades con los diferentes
módulos de apoyo.
 Permite la configuración de servidores virtuales o sea permite alojar más de una
web.
 Apache es una tecnología gratuita de código fuente abierto.
 Soporta los lenguajes de programación: CGI, Perl, PHP
 Permite la restricción a determinados sitios web.
 Es un servidor de web conforme al protocolo HTTP/1.1
 Incentiva la realimentación de los usuarios, obteniendo nuevas ideas, informes
de fallos y parches para la solución de los mismos.
 Soporte para Bases de datos
 Permite una configuración personalizada.
73
  Soporte SSL y TSL para transacciones seguras
 Permite la autentificación de base de datos basada en SGBD

4.3 LENGUAJE DE PROGRAMACIÓN

Lenguaje de programación son herramientas que nos permiten crear programas que
controlen el comportamiento físico y lógico de una máquina

Los lenguajes de programación facilitan la tarea de programación, ya que disponen de

formas adecuadas que permiten ser leídas y escritas por personas, a su vez resultan
independientes del modelo de computador a utilizar.

Los lenguajes de programación representan en forma simbólica y en manera de un texto

los códigos que podrán ser leídos por una persona.

Existen estrategias que permiten ejecutar en una computadora un programa realizado en

un lenguaje de programación simbólico. Los procesadores del lenguaje son los
programas que permiten el tratamiento de la información en forma de texto,
representada en los lenguajes de programación simbólicos.

Un lenguaje del lado del servidor es aquel que se ejecuta en el servidor web, justo antes
de que se envíe la página a través de Internet al cliente. Las páginas que se ejecutan en
el servidor pueden realizar accesos a bases de datos, conexiones en red, y otras tareas
para crear la página final que verá el cliente. (Lenguajes de Programacion, 2009)

4.3.1 PHP

PHP (acrónimo de PHP: Hypertext Pre-processor) es un lenguaje de programación de

alto nivel y se encuentra alojado en paginas HTML, está diseñado para elaborar páginas
web dinámicas y es interpretado en el lado del servidor. Es el lenguaje para la Web
más utilizado del mundo, y su interacción con Windows, Apache y MySql es
insuperable, por lo que en las comunidades de desarrollo, se utiliza el término “WAMP”
(Windows Apache MySql PHP) cuando se habla de desarrollo de aplicaciones para la
web.

74
PHP es de multiplataforma, puede ser ejecutado en la mayoría de servidores Web y en
casi todos los sistemas operativos y plataformas sin costo alguno. Este lenguaje de
programación está preparado para realizar muchos tipos de aplicaciones web gracias a la
extensa librería de funciones. Esta librería cubre desde cálculos matemáticos complejos
hasta tratamiento de conexiones de red, etc. Incluye funciones para el envío de correo
electrónico, subir archivos, crear dinámicamente en el servidor imágenes en formato
GIF, incluso animadas y una lista interminable de utilidades adicionales. (Maestros del
Web, 2008)

Este lenguaje está orientado al desarrollo de aplicaciones web dinámicas que permite la
técnica de programación orientada a objetos con acceso a información almacenada en
una Base de Datos, por lo que una de sus características más potente y destacable es el
soporte para gran cantidad de bases de datos. Las siguientes bases de datos más
comunes están soportadas actualmente: InterBase, mSQL, MySQL, Oracle (OCI7,
OCI8), Informix, PosgreSQL, Adabas D, FilePro, Sybase, ODBC, etc.

PHP es un lenguaje robusto, muy veloz, de código abierto, permitiendo así la ayuda de
programadores (comunidades de desarrollo) para encontrar y reparar rápidamente
ciertos fallos de funcionamiento. Continuamente hay mejoras de código para ampliar las
capacidades de PHP

Utiliza el protocolo Secure Sockets Layer (SSL) mediante el cual se permite a los
usuarios intercambiar información cifrada mediante el protocolo HTTPS (seguro)

PHP utiliza la licencia PHP, es una licencia de software libre de código abierto

4.3.2 ASP

ASP (Active Server Pages) es tecnología desarrollada por Microsoft para crear
páginas web dinámicas, utiliza: como servidor Web IIS (Internet Information Server) y
Windows como plataforma para un correcto funcionamiento. Utiliza el lenguaje Visual
Basic Script o Jscript (Javascript de Microsoft). (Scribd, 2011)

75
Puede ser el lenguaje más sencillo de aprender y de comenzar a utilizar para cualquier
principiante en el mundo del desarrollo web, esto se debe a que su entorno de desarrollo
es muy amigable y provee de facilidades graficas para crear aplicaciones y páginas
Web.

Actualmente se ha presentado ya la segunda versión de ASP, el ASP.NET, que

comprende algunas mejoras en cuanto a posibilidades del lenguaje y rapidez con la que
funciona. ASP.NET tiene algunas diferencias en cuanto a sintaxis con el ASP, de modo
que se ha de tratar de distinta manera uno de otro

El ASP es una tecnología dinámica funcionando del lado del servidor y está
estrechamente relacionada con el modelo tecnológico y de negocio de su fabricante,
programar en ASP es como programar en Visual Basic y C#", pero con muchas
limitaciones y algunas ventajas específicas en entornos web. Lo interesante de este
modelo tecnológico es poder utilizar diversos componentes ya desarrollados como
algunos controles ActiveX así como componentes del lado del servidor, tales como
CDONTS

Para desarrollar paginas en este lenguaje, es necesario pagar una licencia por su entorno
de desarrollo Microsoft Visual Studio, sin embargo es muy utilizado en muchas
empresas por las facilidades que otorga, y el ahorro de tiempo que conlleva crear
paginas en este lenguaje.

Su principal desventaja está en que no es compatible 100% con navegadores como

Nestcape y Mozilla, ya que genera código que es entendido solo por Internet Explorer

ASP queda descartado ya que es de licencia comercial y no funciona con los

navegadores más comunes.

4.3.3 JSP

La empresa Sun Microsystems es el creador de JSP cuyas siglas significan Java Server
Pages (Páginas del servidor Java) Es una tecnología web, del lado del servidor orientada
a crear páginas web dinámicas con programación en Java, genera documentos XHTML
y XML (Maestros del Web, 2008)
76
El lenguaje Java es un lenguaje de propósito general que excede el mundo web y que es
apto para crear clases que manejen lógica de negocio y acceso a datos de una manera
detallada. Esto permite separar en niveles las aplicaciones web, dejando la parte
encargada de generar el documento HTML en el archivo JSP. Con java nos permite
una programación totalmente orientada a objetos y conectividad con cualquier base de
datos que disponga de un driver JDBC

JSP es una tecnología similar a PHP, ASP, en la construcción de páginas web potentes
además permite incrustar código JSP dentro del HTML a esto se le llama scriptled.
Con JSP podemos crear aplicaciones web que se ejecuten en variados servidores web,
de múltiples plataformas, ya que Java es en esencia un lenguaje multiplataforma.

Este lenguaje de programación funciona con el servidor Apache Tomcat, es posible

configurar también servidores como el IIS para que ejecuten servlets. Tomcat posee un
contenedor Web que cumple con las especificaciones de JSP y de Servlet.

Su principal desventaja está, en que depende de la máquina virtual de java, lo que ha

dado lugar que no existan muchas comunidades de desarrollo.

Este lenguaje de programación JSP queda descartado debido a que utiliza una máquina
virtual Java, siendo ese su principal inconveniente.

4.3.4 Elección y Justificación Del Lenguaje De Programación

La siguiente tabla es una tabla comparativa entre los lenguajes de programación PHP,
JSP y ASP.

DESCRIPCIÓN PHP JSP ASP

ULTIMA VERSIÓN 5.3.6 2.1 3.0

ESTABLE
LICENCIA Libre Libre No libre

SOPORTA MÚLTIPLES SI Poco NO

SERVIDORES WEB
LENGUAJE Sintaxis coincide con el Misma sintaxis de Similar a Visual Basic
lenguaje C, Sencillo de Java para crear Scripts.
aprender Orientado a Objetos No Orientado a objeto
Orientado a Objetos
SISTEMA OPERATIVO Multiplataforma Multiplataforma Windows

77
VELOCIDAD DE SI SI NO
ACCESO
BASE DE DATOS Conectividad con Conectividad con La BD utilizada
diversas bases de Datos diversas bases de habitualmente es
pero la más utilizada es Datos pero resulta Access
MySQL sencillo de
implementar con
MySQL
SERVIDORES WEB Apache, Netscape, Apache Tomcat, Servidores IIS y
Microsoft IIS Netscape o Microsoft Personal Web Server,
IIS que son los dos
servidores Web para
sistemas Microsoft, el
primero con tecnología
NT y el segundo para
sistemas Windows 98
y similares.
Aplicaciones Gran comunidad de Existe una gran Óptimo para crear
programadores, comunidad de Java
aplicaciones web
multitud de Scripts e pero más orientada a
información, librerías, aplicaciones que a relativamente sencillas
etc.. Al estar Web
únicamente enfocado a
programación web.
desarrollo Programas de edición Hay diversos Al ser un lenguaje de
web como programas muy Scripts se suele
Dreamweaver, potentes, como trabajar sobre
Ultraedit, etc. netBeans, Eclipse, Dreamweaver o
• Para PHP5 se pueden etc. Ultraedit directamente.
utilizar entornos de • Existen programas
desarrollo más más especializados
orientados a PHP como dentro del paquete de
Prado Visual Studio, como
UltraDev
Tabla 4-1. Tabla Comparativa de Lenguajes de Programación4

Tomando en cuenta la Tabla 4-1, se elegirá PHP como el lenguaje de programación a

utilizar para el desarrollo de las aplicaciones del Portal Web del Colegio. Por ser PHP el
lenguaje más económico y asequible, es uno de los lenguajes más potentes y más
utilizados para el desarrollo de páginas web dinámicas. Logra gran rendimiento con
Windows, apache, Mysql, para brindarnos un mejor resultado. Además PHP permite un
desarrollo en principio más sencillo y rápido, por el mismo hecho que su estructura es
fácil lo que nos permite obtener resultados inmediatos.

4
Comparaciones tomadas y modificadas de : http://codigoprogramacion.com/programacionweb/49-comparacion-php-jsp-asp.html,
http://www.factorsim.info/2008/01/30/tecnologias-web-jsp-php-asp-y-aspnet/,
http://petra.euitio.uniovi.es/~i6950404/wiki/pmwiki.php?n=Tema8.LenguajeJSP.
78
 CAPÍTULO V

5. COMPARACION Y ELECCION DE BASE

DE DATOS

5.1 DEFINICIÓN DE BASE DATOS

Una base de datos o banco de datos (BD) es una colección de información organizada
de forma que un programa de ordenador pueda seleccionar rápidamente los fragmentos
de datos que necesite. Una base de datos es un sistema de archivos electrónico.5

Una base de datos es una serie de datos organizados y relacionados entre sí, los cuales
son recolectados y explotados por los sistemas de información de una empresa o
negocio en particular.

Una base de datos se organiza por tablas, campos, registros y archivos.

 Una Tabla es la unidad del conjunto de datos de una base de datos. Estos datos
estarán ordenados en columnas verticales. Aquí se definen los campos y sus
características.
 Un campo es una pieza única de información o unidad básica de una base de
datos;
 Un registro es un sistema completo de campos, o el conjunto de información
referida a una misma persona u objeto;
 Un archivo es una colección de registros.

5.2 TIPOS DE BASE DE DATOS

Aquí se analizará dos tipos de bases de bases datos

 Bases de datos relacionales.

Es una base de datos que cumple con el modelo relacional, Permiten interconexiones
entre los datos que están guardados en tablas, y a través de dichas conexiones relacionar
los datos de ambas tablas, es decir da la posibilidad de relacionar varias tablas de datos

5
Tomada de la dirección: http://www.masadelante.com/faqs/base-de-datos
79
entre sí, compartiendo información y evitando la duplicidad y los problemas que ello
conlleva (espacio de almacenamiento y redundancia).

Existen numerosas bases de datos relacionales para distintas plataformas como: Access,
Paradox, Oracle, Sybase y son muy utilizadas. Sin embargo, la mayoría de ellas no
admite la asociación de objetos multimedia tales como sonidos, imágenes o
animaciones.

Las bases de datos relacionales están constituidas por una o más tablas que contienen la
información ordenada de una forma organizada. Cumplen las siguientes reglas básicas:

 Generalmente, contendrán muchas tablas o relaciones.

 Una tabla sólo contiene un número fijo de campos.
 El nombre de los campos de una tabla es distinto.
 Cada registro de la tabla es único.
 El orden de los registros y de los campos no está determinados.
 Para cada campo existe un conjunto de valores posible.

 Bases de datos orientadas a objetos.

En una base de datos orientada a objetos, la información se representa mediante objetos

como los presentes en la programación orientada a objetos. Cuando se integra las
características de una base de datos con las de un lenguaje de programación orientado a
objetos, el resultado es un sistema gestor de base de datos orientada a objetos (ODBMS,
object database management system). Un ODBMS hace que los objetos de la base de
datos aparezcan como objetos de un lenguaje de programación en uno o más lenguajes
de programación a los que dé soporte. (Edinunez)

El modelo orientado a objetos se basa en encapsular código y datos en una única

unidad, llamada objeto. El interfaz entre un objeto y el resto del sistema se define
mediante un conjunto de mensajes.

Los usuarios pueden definir operaciones sobre los datos como parte de la definición de
la base de datos. Además está constituida por objetos, que pueden ser de muy diversos
tipos y sobre los cuales se encuentran definidas unas operaciones. También pueden
manejar información binaria (como objetos multimedia) de manera eficiente.

80
Las bases de datos orientadas a objetos se diseñan para trabajar bien en unión con
lenguajes de programación orientados a objetos como Java, C#, Visual Basic.NET y
C++.

Un objeto tiene asociado:

 un conjunto de variables que contienen los datos del objeto. El valor de cada
variable es un objeto.
 Un conjunto de mensajes a los que el objeto responde.
 Un método, que es un trozo de código para implementar cada mensaje. Un
método devuelve un valor como respuesta al mensaje.

5.3 BASE DE DATOS

5.3.1 ORACLE

Oracle es una potente herramienta cliente/servidor para la gestión de base de datos

relacional. Es vendido a nivel mundial y lo adquieren empresas grandes y
multinacionales debido a su gran potencia y costo elevado.

Es un manejador de base de datos relacional que hace uso de los recursos del sistema
informático en todas las arquitecturas de hardware, para garantizar su aprovechamiento
al máximo en ambientes cargados de información.

Oracle es considerado como uno de los sistemas de bases de datos más completos,
debido a su gran soporte de transacciones, brinda estabilidad y escalabilidad de los
datos y compatible con cualquier aplicación.

Oracle ayuda a las organizaciones a controlar y gestionar grandes volúmenes de

contenidos no estructurados en un único repositorio con el objetivo de reducir los costes
y los riesgos asociados a la pérdida de información. (Essanvicente)

Oracle corre en computadoras personales, microcomputadoras, mainframes y

computadoras con procesamiento paralelo masivo. Soporta 17 idiomas, funciona en
más de 80 arquitecturas de hardware y software distinto sin tener la necesidad de
cambiar una sola línea de código, debido a que el 80% de los códigos internos de Oracle
son iguales a los establecidos en todas las plataformas de sistemas operativos
81
5.3.2 MYSQL

MySQL es un sistema para la administración de base de datos relacionales, el cual es

una poderosa herramienta multihilo y multi-usuario, es decir que soporta el acceso de
varios usuarios simultáneamente y además, la estructura es compatible con cualquier
base de datos SQL (Lenguaje de consulta estructurada).

MySQL fue creada por la empresa MySQL AB, esta distribuye licencia comercial para
aquellas empresas que quieran incorporarlo en aplicaciones o productos privativos, estas
licencias ofrecen soporte técnico y servicios como la posibilidad de integrar este gestor
en un software propietario, para sus operaciones contratan trabajadores alrededor del
mundo que colaboran vía Internet

El lenguaje de programación que utiliza MySQL es Structured Query Language (SQL)

que fue desarrollado por IBM en 1981 y desde entonces es utilizado de forma
generalizada en las bases de datos relacionales.

MySQL es uno de los motores de base de datos más usados en Internet, debido
principalmente a que es gratis para aplicaciones no comerciales e incluso se pueda
modificar con total libertad, pudiendo descargar su código fuente. Esto ha favorecido
muy positivamente en su desarrollo y continuas actualizaciones. Su diseño multihilo le
permite soportar una gran carga de forma muy eficiente, es muy utilizado en
aplicaciones web en plataformas (Linux/Windows-Apache-MySQL-PHP/Perl/Python) y
de las plataformas LAMP, MAMP, WAMP. Está muy ligada con el lenguaje PHP.

Características

 Velocidad a la hora de realizar las operaciones, lo que le hace uno de los

gestores que ofrecen mayor rendimiento
 Gran portabilidad entre sistemas, soporta distintas plataformas y sistemas
operativos.
 Cada base de datos cuenta con 3 archivos: para estructura, datos y de índice ,
además soporta hasta 32 índices por tabla.
82
 Bajo costo en requerimientos para la elaboración de bases de datos, ya que
debido a su bajo consumo puede ser ejecutado en una máquina con escasos
recursos sin ningún problema.
 Facilidad de configuración e instalación.
 Baja probabilidad de corromper datos, incluso si los errores no se producen en el
propio gestor, sino en el sistema en el que está.
 Conectividad y seguridad y de los datos
 Emplea el lenguaje SQL para consultas a la base de datos.

5.3.3 SQL SERVER

SQL Server es un sistema para la gestión de bases de datos producido por Microsoft y
basado en el modelo relacional. Sus lenguajes para consultas son T-SQL y ANSI SQL.
Es un software que permite manipular/administrar bases de datos.

SQL Server es un conjunto de objetos eficientemente almacenados. Los objetos donde

se almacena la información se denominan tablas, y éstas a su vez están compuestas de
filas y columnas. En el centro de SQL Server está el motor de SQL Server, el cual
procesa los comandos de la base de datos. Los procesos se ejecutan dentro del sistema
operativo y entienden únicamente de conexiones y de sentencias SQL.

SQL Server incluye herramientas para la administración de los recursos que el

ordenador nos proporciona y los gestiona para un mejor rendimiento de la base de datos.
Una buena instalación y configuración de SQL Server, y sobre todo una buena

Características

 Soporte de transacciones.
 Escalabilidad, estabilidad y seguridad.
 Soporta procedimientos almacenados.
 Incluye también un potente entorno gráfico de administración, que permite el
uso de comandos DDL y DML gráficamente.
 Permite trabajar en modo cliente-servidor, donde la información y datos se

83
 alojan en el servidor y los terminales o clientes de la red sólo acceden a la
información.
 Además permite administrar información de otros servidores de datos
 Buen nivel de seguridad en los datos en cuanto a la gestión de usuarios y
contraseñas.
 Soporta gran cantidad de tipos de datos para las columnas, como por ejemplo:
FLOAT, DOUBLE, CHAR, VARCHAR, TEXT, BLOB, DATE, TIME,
DATETIME, TIMESTAMP, YEAR, SET, ENUM, y tipos espaciales OpenGIS.

 Registros de longitud fija y longitud variable.

5.4 ELECCIÓN Y JUSTIFICACIÓN DE LA BASE DE

DATOS
Se ha elegido como base de Datos de nuestro portal a MySQL debido a su velocidad a la
hora de realizar las operaciones, poco consumo de recursos, tanto de CPU como de
memoria. Es muy utilizado en conjunto con el servidor apache y el lenguaje de
programación PHP. Que son las herramientas que se utilizara para el desarrollo de nuestro
Portal.
Para su elección se tomo en cuenta la siguiente tabla comparativa:

84
CARACTERÍSTICAS MYSQL ORACLE SQL SERVER

CREADOR MySQL AB Oracle Corporation Microsoft

GENERO RDBMS ORDBMS RDBMS
SISTEMA Multiplataforma Multiplataforma Microsoft Windows
OPERATIVO
REQUERIMIENTOS No necesita •Mínimo Gigabit Ethernet Microsoft .NET Framework
DE SOFTWARE •Usar un switch de alta 2.0
velocidad Microsoft SQL Server
•Incrementar el buffer UDP Native Client
al máximo permitido por el Archivos auxiliares de
sistema operativo instalación de Microsoft
•Encender UDP SQL Server
checksuming
REQUERIMIENTOS *Mínimo un AMD a *Al menos 1 Gigabyte de *Mínimo de 256 Mb de
DE HARDWARE6 400 Mhz, y memoria espacio de swap o dos veces RAM para la edición
RAM de 512 Mb el tamaño de la memoria Standard y 512 Mb para la
* Disco duro, con un física. edición Enterprise.
IDE rápido (7.500 * Al menos 400 MB de *Procesador: mínimo un
rpm y 2 Mb de espacio en disco en el Intel Pentium III Xeon a 733
caché) directorio /tmp, para MHz, ó un AMD Athlon a
verificar. 1000 Mhz.
* 4 GB de espacio en disco *Múltiples procesadores
es requerido para la (SMP): Permite que SQL
instalación del software Server pueda realizar
operaciones en subprocesos
independientes.
*Disco: Depende de la
cantidad de información
LICENCIAMIENTO GPL o Propietario Propietario Propietario
ULTIMA VERSIÓN 5.0 11g 10.5
ESTABLE
INTERFACES(API´S) Aplicación Aplicación desarrollada con: T-SQL Transact-SQL:
desarrollada con: C, PL/SQL, C, Delphi, Perl, Lenguaje de programación
C÷÷, TCL, Delphi, PHP, Java, de SQL Sever, se puede
Perl, Python, PHP, utilizar desde: Visual Basic,
Java, Ruby Visual C÷÷, ASP
VBA(Visual Basic para
Aplicaciones)
CONECTORES NET, ODBC, JDBC Ofrece los conectores: NET, Conectores:
SOPORTADOS ODBC, JDBC ODBC y JDBC
ORIENTADA A MySQL está Oracle está más orientado a SQL Server está más
EMPRESAS destinado a pequeñas las grandes empresas orientado a las grandes
y medianas empresas empresas
OBJETOS Y ACCESO Indices, Diccionario Indices, Diccionario de DDL, Lenguaje de
A LOS DATOS de Datos, Vistas, Datos, Vistas, Vistas definición de datos, Vistas,
Vistas Actualizables Actualizables, Cursores Indices, Cursores
Cursores, Triggers7, Triggers, Funciones, Triggers, Procedimientos
Funciones, Dominio, Cursor, Trigger Rutina Externa
Procedimientos, Procedimientos
Rutina Externa Rutina Externa
RENDIMIENTO Y Alto Muy Alto Alto
CAPACIDAD Rápido Lento
Tabla 5-1. Tabla Comparativa de las Bases de Datos8

7
Nota: Estos objetos de base de datos son disponibles a partir de MySQL 5.0 disponible desde 24/12/2005. Tomada de:
http://es.wikipedia.org/wiki/Anexo:Comparaci%C3%B3n_de_sistemas_administradores_de_bases_de_datos_relacionales#Tablas_y
_vistas

85
 CAPITULO VI

6. INSTALACIÓN DE LAS HERRAMIENTAS

6.1 PAQUETE WAMP SERVER

WAMP Server es un paquete completo para instalar y configurar un servidor local, para
crear aplicaciones web.

El nombre de la herramienta WAMP, viene formado por las siglas de los siguientes
componentes

 Windows, como sistema operativo;

 Apache, como servidor web;
 MySQL, como gestor de bases de datos;
 PHP (generalmente), Perl, o Python, como lenguajes de programación.

Una de las ventajas de usar Wamp Server es que la instalación modificará los archivos
de configuración (*.conf) con la ruta donde finalmente se ubicará el programa. También
crea un directorio denominado ’www’ que será la raíz para los documentos.

6.1.1 Funcionalidades

WAMP nos ayuda a simplificar la tarea de instalar Apache + PHP + MySQL en

Windows para crear aplicaciones web, los paquetes WAMP que instalan y configuran
automáticamente.

WAMP SERVER es posible realizar lo siguiente

 Pre visualizar sitios web localmente

 Instalar un servidor web en Windows
 Administrar configuraciones de servidores Apache

86
  Crear aplicaciones web
 Gestionar bases de datos MySQL
 Utilizar lenguaje PHP
 Ejecutar archivos .php localmente
 Realizar pruebas con sitios PHP antes de subirlos a Internet

WampServer tiene funcionalidades que lo hacen muy completo y fácil de usar.

Con un click izquierdo sobre el icono de WampServer, es posible:

 Gestionar sus servicios de Apache y MySQL,

 Cambiar de línea / fuera de línea (dar acceso a todos o sólo local)
 Instalar y cambiar de Apache, MySQL y PHP emisiones
 Gestión de la configuración de sus servidores
 Acceder a sus registros
 Acceder a sus archivos de configuración
 Crear alias

Con un clic derecho:

 WampServer cambiar el idioma del menú

 Acceder a la página principal

6.1.2 Programas que Contiene Wamp Server

El paquete WAMP Server contiene los siguientes servidores y programas:

 Apache 2.2.11. El servidor de páginas web más extendido del mercado. Existe
un “Get more” que permite obtener otras versiones más actuales o cambiar.
 PHP 5.2.11. El motor renovado del lenguaje. También es posible cambiar de
version
 MySQL 5.1.36. La base de datos más extendida para utilizar con PHP. Es
posible cambiar de versión
 PHPmyadmin. Un software que permite administrar una base de datos a través
de una interfaz web.
 SQLitemanager. Un sistema para administrar una base de datos a partir de
sentencias SQL.

87
6.1.3 Requerimientos Para La Instalación

Para utilizar WAMP SERVER se necesita de:

 Sistema operativo Windows NT/98/Me/2000/2003/XP/Vista/ Windows7
 256 MB en RAM (mínimo) 512 MB (recomendado).
 160 MB de espacio libre en disco (mínimo), depende de la cantidad de archivos que
va a subir.

6.1.4 Manual De Instalación De WampServer

La instalación se realizó en una máquina que fue utilizada en el proceso de desarrollo. Esto
se detallará más a continuación en el Anexo A.1 que contiene el Manual de Instalación de
WAMPSERVER.

6.2 GESTOR DE CONTENIDOS JOOMLA.

Es un gestor de contenidos completo muy utilizado para crear, modificar, publicar

fácilmente artículos o noticias, gestionar páginas de personal, listado de trabajos, imágenes
de producto y crear una cantidad ilimitada de secciones o páginas.

6.2.1 Requisitos Para Instalar Joomla

Los requisitos mínimos para que Joomla 1.5.X funcione tenemos:

 Servidor local (WAMP SERVER), con las siguientes versiones de los
programas:
o PHP 4.3.x y superior
o MySQL 3.23.x y superior
o Apache 1.x, 2.x y superior

6.2.2 Manual De Instalación De Joomla Sobre Wampserver

El proceso de instalación Joomla sobre WampServer se detalla de mejor manera en el

Anexo A.2.

88
6.2.3 Frontend y Backend de Joomla.

En el momento de la instalación de Joomla se crean dos espacios diferentes accesibles

vía Web llamados Frontend y Backend que son dos puertas de acceso al sitio

FRONTEND: Es la puerta de acceso público a un sitio Web, es la parte a la que

acceden los usuarios y visitantes. Aparece cuando abrimos la ventana del navegador y
escribimos la dirección URL del sitio.

BACKEND: Es la puerta de acceso privado a un sitio Web, es la interfaz del

administrador, que es la que utilizamos para manipular los contenidos del sitio Web.
Proporciona un panel de control y otras herramientas esenciales para mantener el sitio
Web. Desde aquí se gestionan los contenidos, los usuarios que pueden acceder al
sistema, la estética global del sitio y, en general, el funcionamiento del sitio Joomla.

En manera conjunta el front-end y el back-end interactúan en un sistema web para

resolver las necesidades de los usuarios. (ISSUU, 2010)

6.2.3.1 Backend De Joomla

La siguiente figura muestra el Backend de nuestro portal Web

Figura 6-1. Backend del Portal Web.

A continuación analizaremos el Panel de Control y el menú principal del Backend de

Joomla
89
6.2.3.1.1 Panel De Control De Joomla

Figura 6-2. Panel de Control del Backend

A continuación se describirá cada icono del Panel de Control:

Figura 6-3. Icono de Añadir un Nuevo Artículo

Añadir un Artículo Nuevo: Al seleccionar, nos permite crear nuevos artículos

Figura 6-4. Icono del Gestor de artículos

Gestor de Artículos: Nos permite crear, editar, borrar, mover, publicar, despublicar
artículos.

Figura 6-5. Icono del Gestor de la Página Principal

Gestor de la Página Principal: Nos permite archivar, publicar, despublicar, borrar un

artículo de la página principal

Figura 6-6. Icono del Gestor de Secciones

Gestor de Secciones: Podemos publicar, despublicar, crear, copiar, editar, borrar una
sección.

90
 Figura 6-7. Icono del Gestor de Categorías

Gestor de Categorías: Nos permite publicar, despublicar, mover, copiar, borrar, editar,
crear una categoría

Figura 6-8. Icono del Gestor Multimedia

Gestor Multimedia: Permite Subir y borrar archivos a la Web.

Figura 6-9. Icono del Gestor de Idiomas

Gestor de Idiomas: En esta sección podemos elegir el idioma para el administrador y

el sitio.

Figura 6-10. Icono del Gestor de Usuarios

Gestor de usuarios: Permite crear, borrar y editar usuarios y también asigna

privilegios a los usuarios:

Publico Fron-end
-Registrado
-Autor
-Editor
- Publicador
Público Back-end
-Gestor
- Administrador
-Súper Administrador

Figura 6-11. Icono Configuración Global

Configuración Global: Al seleccionar podemos editar la configuración del sitio, del

sistema, del servidor, de la base de datos y del Correo
91
6.2.3.1.2 Menu Principal De Joomla

Figura 6-12. Menú Principal de Joomla

.
A continuación se describirá cada opción del Menú Principal de Joomla:

 Sitio.- En este menú desplegable se encuentra las funciones de panel de control,

configuración global, gestión de usuarios, gestión multimedia y cerrar sesión
 Menús.- Se encuentra los menús y submenús y el gestor de menús
 Contenido.- Para la administración de artículos, secciones y categorías. Se
encuentra también el gestor de la Página de Inicio
 Componentes.- Permite la administración de todos los componentes existentes e
instalados posteriormente.
 Extensiones.- Para la administración y la instalación/desinstalación de módulos,
plugins, plantillas y lenguajes.
 Herramientas: Para la administración de Correos
 Ayuda.- Visualiza información de ayuda acerca de Joomla como también del
sistema, tanto instalada como online.

6.2.4 Componentes, Módulos Y Plugins De Joomla

Al instalar nuevos componentes y módulos se agregan nuevas funcionalidades al Portal

COMPONENTES
Los componentes a utilizar para el desarrollo del Portal Web se menciona a
continuación

1.- PHOCA GALLERY

Poca Gallery es un componente de Joomla para administrar galerías de imágenes,

dispone de distintos módulos y plugins que es necesario instalar para visualizar
92
imágenes y videos de distinta manera con diferentes estilos. Para la visualización de
imágenes, se puede usar solo el componente

2.- PHOCA MAPS

Phoca Maps es un componente utilizado para crear varios mapas de Google en un sitio
web, y la inserción en artículos de Joomla para ello tendremos que emplear el plugin
“Phoca Maps Plugin”

3.- CALENDARIO JEVENTS

Es un componente para Joomla que usa un sistema completo de agenda con navegación, o
un simple calendario con algunos eventos importantes.

4.- CONTACTOS
Este componente permite administrar los mensajes de los contactos; quienes pueden
enviar mensajes por medio de un formulario que se les presenta dentro del sitio

5.- AKEEBA BACKUP

Genera Respaldos de todo el Portal

MÓDULOS

Algunos de los módulos usados dentro del sitio son los que se mencionan a
continuación:
a. mod_latestnews: Presenta los artículos de una sección y categoría específica que son
publicados recientemente y que además están en vigencia.

b. mod_breadcrumbs: Muestra la ruta donde se encuentra el usuario dentro del sitio y

permite redireccionar la página fácilmente.

c. mod_mainmenu: Permite crear menús ya sea tipo principal o secundario.

d. mod_wrapper: Permite presentar de manera fácil páginas web externas, scripts o

aplicaciones dentro del propio sitio usando un IFrame.
93
e. mod_cd_login: Es un módulo de acceso a un área restringida o de inicio de sesión
basado en Highslide JS. Este módulo permite ingresar un nombre de usuario y una
contraseña. Además se tiene links que ayudan en el caso de haber olvidado la
contraseña o para poder registrar uno nuevo.

f. mod_jevents_cal: es un módulo de JEvents Calendar que permite configurar eventos

en un calendario.

g. mod_nivoslider: Nivo slider es un módulo que muestra imágenes aleatorias en modo

de transiciones (slideshow) automáticamente y desde una carpeta seleccionada.

h. mod_vvisit_counter: Es un modulo que permite visualizar las estadísticas de

visitas realizadas al Portal web. Este contador dispone de un contador de visitas global
y diversos contadores para mostrar el tráfico mensual, semanal, el del día actual y el día
anterior.

i. mod_search: El modulo Buscador muestra una caja que permite realizar búsquedas
de texto en el contenido del Portal web

j. mod_hxdmoomenu: HxD MooMenu es un modulo utilizado para el diseño de menús

desplegables

k. mod_fuofb: Este módulo permite visitar a la cuenta del Colegio creada en la red
social Facebook.

PLUGINS

Algunos Plugins a utilizar en el portal se mencionan a continuación:

a. Phoca Maps Plugin: Este plugin permite insertar en un artículo mapas del
componente Phoca Maps

b. Search – Jevents: Es un plugin para permitir la búsqueda de los eventos del

Componente de JEventos.

c. System - Vinaora Visitors Counter: Este plugin almacena a los visitantes del Portal
Web.
94
d. Sistema – Legacy: Permite emular a Joomla 1.0. Algunas extensiones que fueron
creadas para versiones anteriores como la 1.0 y permitiendo de esta manera trabajar con
extensiones que fueron creadas para esta versión de la extensión 1.0 en la 1.5

e. System - Core Design Scriptegrator plugin: Este plugin permite cargar algunas de
las librerías de JavaScript, como por ejemplo: jQuery, Highslide.

95
 CAPÍTULO VII

7. INTERFAZ GRAFICA DEL PORTAL

7.1 DISEÑO DE LA INTERFAZ GRAFICA DEL PORTAL

WEB
Realizado el proceso de análisis de los diferentes requerimientos y necesidades de los
usuarios, es momento de definir la estructura que mantendrá el portal web durante su
desarrollo.

La definición del diseño de la estructura de las páginas web que conforman el sitio Web,
permitirá tener una idea clara del sitio en su fase final, la ventaja de diseñar la estructura
del sitio permitirá contar con un diagrama que presente todas las paginas que tendrá el
sitio Web.

A continuación se presenta un modelo del diseño de la estructura de página principal

del Portal y de las páginas principales de los Usuarios: Estudiante y Secretaria

96
Página Principal del Portal web

ESCUDO LOGOTIPO

ITEM MENU MENU MENU ITEM ITEM BUSCAR

Home Home

ACCESO ONLINE
MENU

ITEM 1
ITEM 2
ITEM 3
ITEM 4
CALENDARIO
GALERIA DE IMAGENES

NOTICIAS

VISITANOS
BIENVENIDOS

CONTADOR DE
VISITAS FACEBOOK

Mapa del Sitio

Administrador

Figura 7-1 Estructura de la Página Principal

97
Página Principal del Usuario Estudiante

ESCUDO LOGOTIPO

ITEM ITEM ITEM BUSCAR

MENU BIENVENIDA
DATOS PERSONALES

ITEM 1
ITEM 2
ITEM 3 CALENDARIO
ITEM 4

LENDARIO
NOTICIAS

VISITANOS

FACEBOOK

Mapa del Sitio

Administrador

Figura 7-2 Estructura de la Pagina del Usuario Estudiante

98
Página Principal del Usuario Secretaria

ESCUDO LOGOTIPO

ITEM ITEM ITEM BUSCAR

BIENVENIDA
MENU RESULTADOS

ITEM 1 CALENDARIO
ITEM 2
ITEM 3

189
NOTICIAS

VISITANOS

FACEBOOK

Mapa del Sitio

Administrador

Figura 7-3 Estructura de la Pagina del Usuario Secretaria

Como se puede observar en la figuras, estas no posee ningún elemento grafico, sino
incluye líneas y bloques que representan a los objetos de contenido, de esta manera
facilita el diseño de la información de forma organizada y funcional.

99
7.1.1 Estándares de Colores

Las páginas que componen el Portal están diseñadas para ser mostradas utilizando
cualquier navegador de internet

Los colores a utilizar para el diseño del portal son el color rojo (C90000) y el color
plomo (D8D8D8) que son los colores que identifican al Colegio, por tal motivo se
utilizaran estos colores como estándar

Fuentes

Las fuentes a utilizar en la plantilla del Portal Web se mencionan a continuación:

Menú Principal

 Fuente: trebuchet MS, sans-serif;

 Color: negro (000000)
 Tamaño: 2 em

Títulos de los modulos:

 Fuente: trebuchet MS,sans-serif

 Color: rojo (C90000)
 Tamaño: 1.3em

Items del Menu

 Fuente: trebuchet MS, sans-serif;

 Color: negro (000000)
 Tamaño: 1.3 em

7.1.2 Secciones

El Portal del Colegio “César Andrade y Cordero” se encuentra divido en cuatro secciones
las que se detallan a continuación:

1. Menú Principal (user3): En esta sección se encuentra un menú que tiene enlaces a
contenido informativo acerca del Colegio. También se encuentra el modulo “Buscar”,

100
 para buscar por palabra clave dentro del portal.

Figura 7-4. Sección del Menú Principal

2. Sección Izquierda del Portal (left): En esta sección del portal se cuenta con los
siguientes módulos:
a. Menú: con los ítems más accesibles
b. Ultimas Noticias: Este modulo publica los títulos de las noticias acerca del
colegio
c. Contador de visitas: Muestra estadísticas de las visitas de hoy, ayer, semana
pasada, etc.

Figura 7-5. Sección Left del Portal

3. Sección Central (nivoslider): Se presentan imágenes a manera de diapositivas y un

mensaje de bienvenida.

101
 Figura 7-6. Sección central del Portal

4. Sección Derecha del Portal (right): En esta sección del portal se cuenta con los
siguientes módulos:
a. Acceso Online: Es el módulo de Inicio de Sesión de usuarios. Al dar clic en
“Ingreso” se mostrará otra ventana en donde se debe ingresar el nombre de
usuario y su contraseña.
b. Calendario: Informa sobre los eventos que organiza el Colegio, fechas cívicas,
etc.
c. Facebook: Es un modulo de la pagina social Facebook, que dirige a la cuenta
del Facebook del colegio.

102
 Figura 7-7. Sección Rigth del Portal

A continuación presentamos las páginas que componen el Portal Web, veremos qué es
igual al diseño de la estructura mostrada anteriormente, En las páginas están aplicados
los estándares de colores y el Portal se encuentra dividido en secciones

Figura 7-8. Página Principal del Portal

103
Página Principal del Usuario Estudiante

Figura 7-9. Página del Estudiante del Portal

104
Página Principal del Usuario Secretaria

Figura 7-10. Página del Usuario Secretaria

7.2 DESARROLLO DEL FRONTEND DEL PORTAL

El desarrollo del Frontend del Portal Web, hace referencia al desarrollo y configuración de
los distintos módulos y componentes que conforman el portal y que ofrecen distintas
funcionalidades al mismo

FUNCIONALIDADES DEL PORTAL.

105
Como se dijo anteriormente los componentes y módulos brindan funcionalidades distintas al
Portal Web. En el Anexo 3. Manual de Joomla se explicara sobre el funcionamiento y
administración de estos componentes y módulos.

Una vez desarrollados los distintos módulos y componentes del front end del Portal. A
continuación se muestra la Página principal del Portal ya con las funcionalidades
integradas

Figura 7-11. Página Principal del Portal

7.3 DESARROLLO DEL COMPONENTE NOTAS

106
Con el Componente Notas el usuario estudiante puede consultar las notas pertenecientes
a cada trimestre, como indica la siguiente figura:

Figura 7-12. Componente Notas

A continuación se detalla las notas correspondientes a cada trimestre

I Trimestre
Nota1: Nota del mes de Septiembre
Nota2: Nota del mes de Octubre
Nota3: Nota del mes de Noviembre
Examen: Examen correspondiente al primer trimestre

107
Faltas: Número de faltas injustificadas durante el trimestre
Promedio: Resulta de sumar (Nota1+Nota2+Nota3+Examen) y dividir para 4.

II Trimestre
Nota1: Nota del mes de Enero
Nota2: Nota del mes de Febrero
Nota3: Nota del mes de Marzo
Examen: Examen correspondiente al segundo trimestre
Faltas: Número de faltas injustificadas durante el trimestre
Promedio: Resulta de sumar (Nota1+Nota2+Nota3+Examen) y dividir para 4.

III Trimestre
Nota1: Nota del mes de Abril
Nota2: Nota del mes de Mayo
Nota3: Nota del mes de Junio
Examen: Examen correspondiente al tercer trimestre
Faltas: Número de faltas injustificadas durante el trimestre
Promedio: Resulta de sumar (Nota1+Nota2+Nota3+Examen) y dividir para cuatro

Promedio Final
Extras: Son puntos extras (1, 2 o 3 puntos) que se da al estudiante en esa materia y
que van sumados directamente al promedio final
Supletorio: Es nota del supletorio y va promediado al promedio final
Promedio Final: Suma de los tres trimestres y divido para tres

Para desarrollar el componente Consultar Notas del Portal Web se va a seguir el

patrón MVC, este patrón utiliza Joomla para el desarrollo de sus componentes, A
continuación se menciona los pasos a seguir para la creación de la estructura del
componente:

 Hay que ubicarse en la carpeta principal de Joomla en nuestro servidor web.

Dentro de esta carpeta hay que localizar el directorio components.
 En el directorio components crear el directorio para el componente que se va a
108
 crear y de la siguiente manera:
com_nombredelcomponente, para este caso seria com_notas
 En el directorio com_notas se crea el archivo notas.php, que tiene el nombre
del componente que se creó con anterioridad. Este archivo, Joomla busca para
ejecutarlo cuando se llama al componente.
 Dentro del directorio com_notas se crean los directorios y el archivo siguientes:
o models
o views
o controller.php
 En el directorio views hay que crear un directorio por cada vista y el directorio
tiene que tener el nombre de la vista; se crea el directorio notas dentro del
directorio views.
 Dentro del directorio views/notas se crea el directorio tmpl, aquí es donde se
guardarán los layouts de la vista. El layout es el fichero final que se mostrará por
el navegador.
 Crear el fichero views/notas/view.html.php, este fichero también es necesario.
 Ahora se crea el fichero notas.php dentro de models.
Cuando se carga el componente, se ejecuta el punto de entrada a este, notas.php, y en el
punto de entrada será donde se creará una instancia de este componente.
A continuación se crea el código para cada archivo
Código para el punto de entrada de componente notas.php

109
 Figura 7-13. Código de notas.php

Código de controller.php

Figura 7-14. Código de controller.php

Código de view.html.php

110
 Figura 7-15. Código de view.htm.php

En el archivo default.php es el fichero final que se mostrará por el navegador

Figura 7-16. Código de default.php

7.4 DESARROLLO DEL COMPONENTE

EVALUACIONES
Con el componente evaluaciones desarrollado en el portal Web, el usuario estudiante
selecciona y evalúa a los docentes que imparte clases durante ese periodo lectivo. Como
indica la siguiente figura:

111
Figura 7-17. Componente Evaluaciones

112
El desarrollo del componente evaluaciones siguió el mismo procedimiento indicado
anteriormente, lo que cambia es la lógica de negocio.

113
 CAPÍTULO VIII

8. INSTALACION, INTEGRACION, SEGURIDAD

Y PRUEBAS

8.1 INSTALACIÓNES
A continuación se detalla el proceso de instalación del software utilizado para el
desarrollo e implementación del Portal del Colegio “César Andrade y Cordero”

8.1.1 Instalación y Configuración De La Base De Datos

La instalación básica para el desarrollo del sistema se explica de manera detallada en el

Anexo A.1. Y A.2.
Para la configuración de la base de datos, se realizo los siguientes puntos:
Nombre del usuario de la Base de Datos “cesarand_admin” con su respectiva
contraseña.
Nombre de la base de datos del Portal “cesarand_bd_sitio”.
Nombre de la base de datos del Sistema “cesarand_bd_matriculas”
Las dos bases de datos manejan la configuración de Idioma: utf8_spanish_ci.

8.1.1.1 Migración De Datos De Foxpro A Mysql

Como se indicó en el Capitulo 1, el Colegio “Cesar Andrade y Cordero” maneja su

sistema de matrículas y calificaciones en una herramienta desarrollada en Fox Pro, por
lo que es necesario realizar un proceso de migración de datos del sistema local del
Colegio a la base de datos del Servidor del Portal (MYSQL).
Para realizar este proceso de migración de datos se dispone de la herramienta DBF To
SQL Converter Software.
DBF To SQL Converter Software: Esta herramienta convierte datos de tipo dbf a
sentencias SQL. El proceso de migración se explica a continuación:

Elegir las tablas de la base de datos del sistema local que se van a migrar
 macalnum.dbf
114
  macursos.dbf
 mafipro.dbf
 mamateri.dbf
 madatalu.dbf
 mamatcu.dbf

 Abrir el programa DBF To SQL Converter Software, como muestra la siguiente

figura:

Figura 8-1. Herramienta DBF To SQL Converter Software

 En DBF File(Archivos DBF), seleccionar la opción

Multiple Files: Es para seleccionar múltiples archivos
Single Files: Es para seleccionar un archivo.
 Señalar la opción

 En SQL Type: Escoger la opción

 El resto de configuraciones se deja como esta.
 A continuación hay que seleccionar el archivo a convertir, haciendo clic en (…)

 y para finalizar convertimos el archivo haciendo clic en Start Converting, como

muestra la siguiente figura:

115
 Figura 8-2. Convertir Archivo dbf

 Cuando la herramienta termine de convertir al archivo aparecerá el siguiente

mensaje:

Figura 8-3. Mensaje de archivo convertido

 En la dirección, donde se seleccionaron los archivos dbf a convertir, allí se

crearán los archivos SQL convertidos, que son archivos de texto, formato txt, como
indica la siguiente figura

116
 Figura 8-4. Ubicación de archivos convertidos (SQL)

 Abrir el archivo SQL, veremos que son sentencias SQL, seleccionar y copiamos

en el PHPMyAdmin del servidor, seleccionando y ejecutar las

sentencias.
De esta manera se han migrado datos dbf a base de datos MYSQL. Este proceso se
realiza cada vez que se actualice la base de datos del Colegio.

8.1.2 Configuración Del Servidor

Para la configuración del servidor se contrató el servicio de Hosting y la compra del

Dominio en Autrohosting.net.

El servicio de Hosting contratado tiene las siguientes características:

Almacenamiento HD de Espacio: 3.000 MB
Transferencia mensual: 30.000 MB
Velocidad de Servidores (mínimo): 6100 mhz
Sever - Memoria (mínimo): 8GB

8.2 INTEGRACION
8.2.1 Integración del Componente Consultar Notas

Una vez desarrollado el componente para consultar las notas, ahora es el momento para
integrar el componente al portal, mediante la instalación.
117
A continuación se describirán los pasos a seguir para instalar el componente:

En el administrador de Joomla, seleccionar Extensiones, luego Instalar/Desinstalar,

y mostrara una ventana similar a la siguiente figura:

Figura 8-5. Gestor de Extensiones

Para instalar el componente, se debe hacer desde Subir Paquete.

Figura 8-6. Subir Paquete

En donde se debe seleccionar el archivo a instalar haciendo clic en Examinar.

Figura 8-7. Archivo seleccionado

A continuación hacer clic en Subir Archivo & Instalar, para instalar el componente

De esta manera el componente se encuentra ya instalado, Ahora para integrar el

componente al Portal es necesario seguir el siguiente procedimiento.
 Crear el Menú del Estudiante (Menú Estudiante) en el capitulo anterior se
describió la manera de crear un menú
 Crear el Ítem Consultar Notas, aquí se va a describir como crear el ítem para
este componente

118
 o En el administrador de Joomla seleccionar Menús, luego Menú
Estudiantes
o En el Gestor de Ítems del menú, seleccionar Nuevo.
o Seleccionar Reporte de Notas de la lista de tipos de ítems del menú como
indica la siguiente figura

Figura 8-8. Selección de ítem Reporte de Notas

o A continuación hay que guardar seleccionando el botón Guardar

Figura 8-9. Configuración del ítem Consultar Notas

De esta manera el componente queda integrado al Portal web. Para poder ver las
119
propiedades del componente, en el administrador de Joomla, seleccionar, Extensiones,
Instalar/desinstalar, luego seleccionar Componentes, se visualiza una ventana similar
a la siguiente:

Figura 8-10. Propiedades del Componente Evaluación

Se puede observar en la Figura 8-6 el componente Evaluación, en donde:

Componente: Es el nombre del Componente instalado
Habilitado: Una marca verde o una X de color rojo muestra si el uso del componente se
activa / desactiva.
Versión: Numero de versión de la Extensión
Fecha: Fecha de instalación de la extensión
Autor: Es el nombre del autor de la extensión
Compatibilidad: Una marca verde en esta columna indica que esta extensión es
compatible con la actual versión de Joomla!. Una "X" roja indica que no es compatible.

8.2.2 Integración del Componente Evaluaciones

Para la instalación del componente Evaluaciones se sigue el mismo procedimiento que

se siguió para la instalación del Componente Consultar Notas.

Con el Componente ya instalado, ahora se procede a la integración del modulo con el

portal Web, para ello es necesario realizar lo siguiente

120
 En el Menú Estudiante, crear el Ítem Evaluar Docente, el proceso de crear el
ítem es el mismo proceso indicado anteriormente.
 En tipo de ítem del menú se debe seleccionar Evaluación Profesores como
indica la siguiente figura:

Figura 8-11. Selección del Ítem Evaluación Profesores

 A continuación hay que guardar haciendo clic en el botón Guardar, como

indica la siguiente figura:

Figura 8-12. Configuración del ítem Evaluar Docente

121
De esta manera se ha integrado el componente al Portal Web, ahora podemos ver las
propiedades del componente como muestra la siguiente figura:

Figura 8-13. Propiedades del componente Reporte

8.3 SEGURIDAD EN EL PORTAL

Los portales WEB se ven expuestos a un creciente número de amenazas y
vulnerabilidades que pueden afectar la imagen institucional, la disponibilidad de los
servicios brindados, la integridad y la confidencialidad de la información que se
trasmite a través del mismo, entre otros.
A continuación se mencionan algunos métodos y consejos para brindar seguridad al
portal Web.

BACKUP DEL PORTAL

Realizar copias de seguridad del Portal es una tarea muy importante que se debe realizar
periódicamente. Con esta operación se está prevenido ante cualquier problema que
pueda provocar la pérdida de información del portal, como puede ser una avería del
disco duro que contiene el sitio web o una instalación incorrecta de una extensión que
manipula de forma considerable el entorno de Joomla.

Akeeba Backup es un componente instalado en el portal para crear una copia de

seguridad del sitio que puede ser restaurada en cualquier sitio Joomla. Alternativamente
se puede hacer una copia de seguridad sólo de la base de datos, o sólo de los archivos.
El respaldo debe hacerlo frecuentemente y guardar en un lugar seguro.

122
 Figura 8-14. Ventana de Akeeba Backup

SEGURIDAD DEL SEVIDOR

El hosting contratado para albergar el portal Web, ofrece

servicio de respaldos y uno general de seguridad en cinta
por cualquier desastre natural o contingencia de todos los servidores

Se puede general respaldos de todo el Portal atreves del panel de control del
administrador (CPanel)

ACTUALIZACIONES

Por seguridad es conveniente actualizar tanto el CMS Joomla como las diferentes
extensiones a la última versión estable.

USUARIOS Y CONTRASEÑAS

Los nombres de usuarios deben de ser diferentes a los nombres de usuarios que vienen por
defecto en Joomla como admin, etc.

123
Crear contraseñas complejas para los administradores. Usar combinaciones de letras
mayúsculas y minúsculas, números, símbolos y que no tengan menos de ocho caracteres.
Cambiar las contraseñas con frecuencia.

8.4 PRUEBAS
Para probar el funcionamiento del Portal con todos los servicios que ofrece es necesario
realizar diversas pruebas que confirmen el buen funcionamiento del portal

8.4.1 Pruebas del Portal con todos los servicios que ofrece

Una vez concluido el desarrollo y la implementación del Portal es necesario probar

todos los servicios que éste ofrece.
Se comenzará a analizar desde la autentificación de los usuarios, con ello se espera
llegar a los siguientes resultados:
Cuando un usuario inicie sesión como estudiante podrá realizar las siguientes acciones:
 Menú Estudiante: Menú para consulta de Notas y evaluación al docente
 Menú Principal: Menú de modificar detalles del perfil
 Noticias
 Calendario

124
 Figura 8-15. Página principal del usuario Estudiante

Cuando un usuario inicie sesión como secretaria podrá realizar las siguientes acciones:
 Menú Secretaria: Ver resultado de las Evaluaciones a los docentes
 Menú Principal: Modificar perfil
 Noticias
 Calendario

Figura 8-16. Página principal del usuario Secretaria

125
Con los Componentes ya desarrollados se procedió a presentar el Portal web al colegio
“Cesar Andrade y Cordero”, de manera también se va a probar todas las funcionalidades
del portal

Para una mejor utilización del Portal Web se realizó capacitación con la secretaría,
profesores y alumnos del Colegio. A continuación se muestran algunas imágenes
captadas durante la capacitación y presentación del Portal

Secretaria

Figura 8-17. Capacitación y presentación del Portal a la Secretaria

Docente

126
 Figura 8-18. Presentación y capacitación al docente

Estudiantes

Figura 8-19. Presentación y Capacitación a los Estudiantes

Con la presentación del Portal a los estudiantes, secretaria y docentes se comprobó

todas las funcionalidades del portal, llegándose a detectar algunas fallas en cuanto a los
privilegios del usuario, y también la solicitud de nuevos requerimientos funcionales del
portal
A continuación se detalla más acerca de estas fallas y requerimientos

Problemas

El problema se suscita, cuando el usuario inicia sesión como secretaria, este usuario no
cumple con lo prescrito al inicio de esta sección numeral 8.3.1 que dice:

127
Cuando un usuario inicie sesión como secretaria podrá realizar las siguientes acciones:
 Menú Secretaria: Menú para consulta de los resultados de las evaluaciones
 Menú Principal: Menú de modificar detalles del perfil
 Noticias
 Calendario
No Cumple, ya que a mas de realizar estas acciones, la secretaria podía ver las acciones
del usuario estudiante.
Pero cuando el usuario iniciaba sesión como estudiante si cumplía con lo establecido en
el numeral 8.3.1 que dice:

Cuando un usuario inicie sesión como estudiante podrá realizar las siguientes acciones:
 Menú Estudiante: Menú para consulta de Notas y evaluación al docente
 Menú Principal: Menú de modificar detalles del perfil
 Noticias
 Calendario

Para la solución de este problema sobre los privilegios de los usuarios fue necesario la
instalación del módulo Metamod, que permite insertar código PHP, y desde este
módulo controlar las acciones que cada usuario debe realizar cuando inicie sesión.

Requerimiento funcional solicitado por los estudiantes:

Un requisito funcional para el portal que solicitaron los estudiantes consiste en que el
sistema les permita personalizar el perfil, al poder seleccionar una imagen y que esta
aparezca en el mismo. A continuación se detalla más acerca de este requerimiento

Él estudiante al iniciar sesión se le direccionara a la página de Perfil, en dónde a mas de

sus datos personales aparecerá su fotografía, la misma que se seleccionó y cargo en la
Página Personal
La siguiente figura muestra el requerimiento solicitado por el estudiante

128
 Figura 8-20. Componente Perfil

Para realización de este requerimiento fue necesaria la creación de un componente

com_perfil, que se encarga de integrar la información personal del estudiante que se
encuentra en las tablas migradas con la funcionalidad q tiene el Joomla de subir
imágenes al perfil, esta información se encuentra en las tablas del Joomla por defecto
usadas para guardar información del perfil, de esta manera se mejora la presentación de
la página web y le da mayor usabilidad consiguiendo que sea un servicio más que el
colegio ofrece para sus estudiantes.

8.4.2 Pruebas de Rendimiento

Para las pruebas de rendimiento, se basó en las estadísticas de visitas de los usuarios al
Portal.
La herramienta Webalizer que es un programa complejo de análisis de logs que genera
una estadística visual por medio de una variedad de charts y graficas sobre quien ha
visitado el Portal Web
La siguiente figura muestra el reporte de las estadísticas generada por la herramienta
Webalizer, en dónde se puede observar un promedio de visitas realizadas diariamente
a los archivos, a las páginas del portal, el numero de accesos como también las visitas
mensuales, además la cantidad de Kbytes utilizados mensualmente

129
 Figura 8-21. Estadísticas de Uso generado por Webalizer

Banda Ancha

Esta función permite ver el uso de banda ancha del Portal web. Muestra el uso actual del
mes así como el uso total de banda ancha. Esto incluye todo el HTTP (web) y POP
(correo/mail) uso de banda ancha y puede incluir el uso de banda ancha de FTP en caso
de haber activado el registro de FTP de banda ancha.

La siguiente figura muestra el uso de banda ancha generado en los últimos 7 días y
durante cada mes

130
 Figura 8-22. Banda Ancha

Las siguientes figuras muestran los detalles de transferencia de Banda Ancha en el mes
de Junio

Figura 8-23. Transferencia de Banda Ancha en el mes de Junio

131
 Figura 8-24 Banda Ancha Diaria del Mes de Junio

A continuación se indicará acerca del tráfico del Servidor. La siguientes figuras

muestran las estadísticas de tráfico en la red de este servidor MySQL desde su inicio.

Figura 8-25. Trafico del Servidor.

La siguiente tabla muestra las estadísticas de consultas enviadas al servidor

132
Figura 8-26. Estadísticas de consultas

133
CONCLUSIONES Y RECOMENDACIONES

CONCLUSIONES
Al finalizar este proyecto de tesis sobre el análisis, desarrollo e implementación del
Portal Web del Colegio “César Andrade y Cordero” se puede decir que se ha cumplido
los objetivos planteados al inicio del proyecto de la mejor manera.

Hoy en día los desarrolladores de aplicaciones web se basan en el acceso y el uso de

las diferentes herramientas de Joomla que permiten ampliar las necesidades de los
usuarios. Existen variedades de componentes disponibles que son de acceso libre, otros
que tienen costos de licencia para su uso, o la creación de nuevos componentes y darles
la funcionalidad de acuerdo a los requerimientos de los usuarios. La realización de este
proyecto fue posible con la utilización de componentes gratuitos y la creación de
nuevos componentes para la consulta de notas, evaluación a los docentes y
personalización del perfil estudiante.

La utilización del esquema MVC para el desarrollo de los componentes, brinda un gran
número de funcionalidades en especial para la reutilización de código, así como una
mejor distribución, diseño y modularidad.

En cuanto a la seguridad, se basa en el uso y cambio constante de contraseñas tanto de

los usuarios del Portal como de los Administradores y también en las actualizaciones
del CMS. Por lo que durante el desarrollo del proyecto se actualizó la versión de
Joomla de 1.5.11 a la versión de 1.5.23, esto con el fin de dar seguridad al portal y tener
más recursos disponibles

Durante la búsqueda y análisis de herramientas para la migración de datos de FoxPro a

Mysql, cierta herramienta funcionó perfectamente en el servidor local, teniendo
problemas de migración en el servidor remoto por lo que fue necesario buscar y analizar
otra herramienta para la migración.

Para poder disfrutar del Portal Web del Colegio y de los distintos servicios que brinda el
mismo se puede dirigir a la siguiente dirección: www.cesarandradeycordero.com.ec.

134
 RECOMENDACIONES

Realizar el análisis de requerimientos directamente con las personas involucradas

porque son aquellas que van a utilizar el portal y podrán dar información adecuada y
necesaria. Se recomienda elaborar diagramas necesarios para el desarrollo de un
sistema que permitirán obtener el análisis de los requerimientos solicitados por los
usuarios.

En cuanto a la seguridad, se recomienda a los usuarios de las aplicaciones Web, y

administradores del Portal web cambiar sus contraseñas con constancia. Es
recomendable que en un futuro no muy lejano, se migre a la versión 1.6, para tener más
recursos disponibles y hacerla aun más competitiva. Actualmente algunos componentes del
Portal no están listos para esta actualización y perderían su funcionalidad.

Para el desarrollo de un sitio web se recomienda el uso de CMS que permitan utilizar el
esquema MVC por que mejora notablemente la organización de los archivos de los
componentes y la localización específica de una parte de los mismos.

Recomendar a la institución tratar de contar con un administrador para el Portal Web ya

que constantemente se debe ir actualizando la información de las páginas del sitio, por
lo que el este debe estar controlado.

Sugerir a un director de tesis que sea tolerante, responsable para que el proyecto se
desarrolle de manera satisfactoria, también que esté involucrado con el tema para
poder recibir ideas y opiniones que ayuden al desarrollo de la tesis propuesta.

135
 GLOSARIO
FTP: File Transfer Protocol (Protocolo de Transferencia de Archivos), es un protocolo
de red para la transferencia de archivos entre sistemas conectados a una red
GPL: La Licencia Pública General de GNU está orientada principalmente a proteger la
libre distribución, modificación y uso de software
GNU: Sistema operativo de libre distribución.
HTTP: Hypertext Transfer Protocol (Protocolo de transferencia de hipertexto) es el
protocolo usado en cada transacción de la World Wide Web.
HTTPS: Hipert Text Transfer Potocol Secure (protocolo de transferencia de hipertexto
seguro), es un protocolo de aplicación basado en el protocolo http pero seguro.
CSS: Cascading Style Sheets (hojas de estilo en cascada) CSS es un lenguaje usado
para definir la presentación de un documento estructurado escrito en HTML o XML
SSL: Secure Socket Layer (protocolo de capa de conexión segura). Protocolo que
proporciona comunicaciones seguras por una red, comúnmente Internet.
TSL: Transport Layer Security (Seguridad para la Capa de Transporte) Protocolo que
proporciona comunicaciones seguras por una red, comúnmente Internet.
SGBD: Sistema de gestión de base de datos, son un tipo de software muy específico,
dedicado a servir de interfaz entre la base de datos, el usuario y las aplicaciones que la
utilizan.
WAMP: Es el acrónimo usado para describir un sistema de infraestructura de internet
que usa las siguientes herramientas Windows, Apache, Mysql, Php
FUNCIÓN Y PROCEDIMIENTO se refieren a las rutinas internas escritas en SQL o
lenguajes procedurales como PL/SQL.
RUTINA EXTERNA se refiere a la escritura en los lenguajes anfitriones como C,
Java, Cobol, etc.
JAVASCRIPT: JavaScript es un lenguaje de programación interpretado, dialecto del
estándar ECMAScript. Se define como orientado a objetos, basado en prototipos,
imperativo, débilmente tipado y dinámico.
CDONTS: Se trata de un componente incluido en Windows NT server y Windows
2000 server. Este complemento facilita la creación y envío de mensajes de correo desde
los scripts de aplicaciones Web, principalmente desde páginas ASP

136
XML: extensible markup language (lenguaje de marcado ampliable o extensible) Su
objetivo es conseguir páginas web más semántica; separando la estructura del contenido
y permite el desarrollo de vocabularios modulares. Se trata de un formato abierto
XHTML: eXtensible Hypertext Markup Language (lenguaje extensible de marcado de
hipertexto) es el lenguaje de marcado pensado para sustituir a HTML como estándar
para las páginas web.
JDBC: Java Database Connectivity, es una API que permite la ejecución de
operaciones sobre bases de datos desde el lenguaje de programación Java,
independientemente del sistema operativo donde se ejecute o de la base de datos a la
cual se accede, utilizando el dialecto SQL del modelo de base de datos que se utilice.
SERVLETS: Los servlets, son objetos que corren dentro del contexto de un contenedor
de servlets (ej: Tomcat) y extienden su funcionalidad. El uso más común de los servlets
es generar páginas web de forma dinámica a partir de los parámetros de la petición que
envíe el navegador web
ODBMS: object database management system (sistema gestor de base de datos
orientada a objetos) resulta cuando se integra las características de una base de datos
con las de un lenguaje de programación orientado a objetos
TRANSACT-SQL (T-SQL) es una extensión al SQL de Microsoft y Sybase. Expande
el estándar de SQL para incluir programación procedural, variables locales, varias
funciones de soporte para procesamiento de strings, procesamiento de fechas,
matemáticas, etc, y cambios a los estatutos DELETE y UPDATE.
DDL: Un lenguaje de definición de datos (Data Definition Language, DDL por sus
siglas en inglés) es un lenguaje proporcionado por el sistema de gestión de base de datos
que permite a los usuarios de la misma llevar a cabo las tareas de definición de las
estructuras que almacenarán los datos así como de los procedimientos o funciones que
permitan consultarlos.
DML: Lenguaje de Manipulación de Datos (Data Manipulation Language, DML) es un
lenguaje proporcionado por el sistema de gestión de base de datos que permite a los
usuarios de la misma llevar a cabo las tareas de consulta o manipulación de los datos,
organizados por el modelo de datos adecuado.
WWW: World Wide Web, es un sistema de distribución de información basado en
hipertexto o hipermedios enlazados y accesibles a través de Internet.

137
 BIBLIOGRAFÍA

 Alegsa. (s.f.). Diccionario de Informática. Recuperado el 2 de Enero de 2011, de

http://www.alegsa.com.ar/Dic/requerimientos.php
 Edinunez. (s.f.). Base de Datos Orientado a Objetos. Recuperado el 2 de
Febrero de 2011, de http://edinunez.wordpress.com/2008/05/07/base-de-datos-
orientado-a-objetos/
 Essanvicente. (s.f.). Oracle. Recuperado el 05 de Febrero de 2011, de
http://www.iessanvicente.com/colaboraciones/oracle.pdf
 GNU, S. O. (22 de Julio de 2009). Recuperado el 07 de Abril de 2011, de
http://www.gnu.org/philosophy/free-sw.es.html
 ISSUU. (17 de Octubre de 2010). Portal Web. Recuperado el 20 de Junio de
2011, de Sitio Web de Issuu:
http://issuu.com/edisue/docs/el_frontend_y_el_backend
 ITESO. (s.f.). Iteso. Recuperado el 4 de Diciembre de 2010, de
http://iteso.mx/~carlosc/pagina/documentos/usabilidad.htm.
 Joomla Spanish Group. (04 de Abril de 2011). Joomla Spanish. Recuperado el
28 de junio de 2011, de Joomla! Spanish: http://joomlaspanish.info/noticias/200-
versiones-del-pack-joomlaspanish-y-joomla/282-joomla-150-khepri-spanish-
pack.html#top
 Lenguajes de Programacion. (2009). Colegio "Cesar Andrade". Recuperado el
11 de mayo de 2011, de www.lenguajes-de-programacion.com:
http://www.lenguajes-de-programacion.com/lenguajes-de-programacion.shtml
 Maestros del Web. (2008). Colegio "Cesar Andrade". Recuperado el 20 de
Mayo de 2011, de www.maestrosdelweb.com:
http://www.maestrosdelweb.com/principiantes/los-diferentes-lenguajes-de-
programacion-para-la-web/
 NOSOLOCODIGO. (02 de Abril de 2008). Recuperado el 07 de Mayo de 2011,
de http://www.nosolocodigo.com/componentes-para-joomla-15-i
 Scribd. (14 de Abril de 2011). Recuperado el 23 de Mayo de 2011, de es.scribd:
http://es.scribd.com/doc/54318618/ASP
 Source, L. O. (Mayo de 2008). Recuperado el 30 de Mayo de 2011, de Taringa:
http://www.taringa.net/posts/offtopic/1114168/Licencia-Open-Source.html
 Stalling, W. (2010). Arquitectura de Computadores. En S. Willimar. Mexio:

138
 Pearson.
 Taringa. (22 de junio de 2008). CMS. Recuperado el 20 de Febrero de 2011, de
CMS: http://www.taringa.net/posts/info/1320996/Que-es-CMS____.html
 Wikipedia. (10 de noviembre de 2010). Recuperado el 13 de Diciembre de 2010,
de http://es.wikipedia.org/wiki/Sistema_de_gesti%C3%B3n_de_contenidos
 Wikipedia. (10 de Marzo de 2011). Colegio "Cesar Andrade". Recuperado el 09
de mayo de 2011, de www.Wikipedia.com:
http://es.wikipedia.org/wiki/Servidor_web

139
 9. ANEXOS

A. INSTALACION DE WAMPSERVER
Una vez que tengamos el archivo ejecutable en el ordenador, hacemos doble clic
para empezar la instalación. Se mostrará la siguiente pantalla:
1.- Aquí nos dan la bienvenida, y hacemos Clic en Next > para continuar

Figura A-1 Ventana de Bienvenida

2.- En la siguiente pantalla muestra un acuerdo de licencia. Debemos aceptarlo

haciendole doble clic en I accept the agreement y pulsar el botón Next >

Figura A-2. Ventana de Licencia

3.- En esta ventana nos pregunta donde queremos que se guarde el programa.
Seleccionar la ruta de la carpeta donde se desea instalar WAMP SERVER. En nuestro
caso la ruta es C:\wamp y pulsar el botón Next >

140
 Figura A-3. Ventana de Selección de Ruta

4.- Crear icono de Inicio rápido y el icono de escritorio, hacer clic en Next >.

Figura A-4. Ventana de Selección de Herramientas

5.- El WAMP está listo para instalar, como se muestra a continuación. Hacemos clic en
Install

Figura A-5. Ventana de Instalar

6.- Esperar que se termine la instalación.

141
 Figura A-6. Ventana del Proceso de Instalación

7.- Seleccionamos el navegador por defecto.

Figura A-7. Ventana de selección del navegador

8.- A continuación dejamos el SMPT con localhost como esta, en E-mail llenamos con
un nombre de correo.

Figura A-8. Ventana de Parámetros de SMPT y E-mail

142
9.- La instalación termina con la siguiente pantalla y hacemos clic en Finish

Figura A-9. Ventana de Finalización de la Instalación

10.- El icono de WAMP Server aparece en la parte inferior derecha del ordenador

Figura A-10. Icono de WampServer en la barra de herramientas

11.- Al hacer clic en este icono. Se mostrará un menú que contiene todas las
configuraciones de Apache, PHP y MySql

Figura A-11. Servicios de WampServer

143
12.- Para comprobar la instalación de WAMP Server, escribimos http://localhost/ en el
navegador, y si aparece la siguiente pantalla WAMP Server está instalado correctamente

Figura A-12. Ventana de WampServer

13.- Para trabajar con la base de datos, escribir en el navegador

http://localhost/phpmyadmin y nos aparecerá la siguiente ventana:

144
 Figura A-13. Ventana de PhpMyAdmin

B. INSTALACION DE JOOMLA
1) Se debe crear una carpeta del Portal dentro del directorio de WAMP SERVER
C:\wamp\www\Portal

Figura B-1. Creación de la Carpeta

145
2) Dentro de la carpeta descargar el archivo y se
lo descomprime

Figura B-2. Descarga del archivo

3) En el navegador escribir el nombre de la carpeta creado anteriormente, en este caso la

carpeta se llama Portal http://localhost/Portal
Aparecerá la siguiente pantalla y hacemos clic en Siguiente

Figura B-3. Selección del Idioma

4) Aparecerá la siguiente ventana de comprobación, hacemos clic en Siguiente

146
 Figura B-4. Comprobación Previa

5) Aceptamos la Licencia haciendo clic en Siguiente

Figura B-5. Condiciones de la Licencia

6) A continuación Configurar los parámetros necesarios que son los siguientes:

a. Nombre del servidor: Normalmente localhost o un nombre de host provisto

por su proveedor.
b. Nombre de usuario: Puede ser root o un nombre de usuario, para la base de
datos, asignado por su proveedor.
c. Contraseña: Por razones de seguridad el uso de una contraseña para la

147
 cuenta de la base de datos MySQL es altamente recomendado. Esta es la
contraseña para acceder a su base de datos. Es posible que esta información
sea predeterminada por su proveedor.
d. Nombre de la base de datos: Algunos hosts permiten solo una base de datos
por cuenta. Si debe instalar más de un sitio Joomla! con una misma base de
datos, puede modificar la opción de prefijo de tabla en la sección Parámetros
avanzados para cada sitio instalado
Hacer clic en Siguiente

Figura B-6. Configuración de la Base de Datos

7) Configurar los siguientes parámetros:

a. Nombre del sitio web: Especificar el nombre del sitio web Joomla.
b. Correo electrónico: Es el correo electrónico para el Super Administrador
del sitio.
c. Contraseña del usuario admin: Escribir la contraseña y la confirmación de
la misma que usará el Super Administrador. Con ésta el usuario admin
podrá ingresar al área de administración una vez finalizada la instalación

148
 Figura B-7. Configuración de FTP

8) Si desea instalar los ejemplos, se deberá hacer clic en “Instalar los datos de ejemplo
predeterminado”

Figura B-8. Instalar el ejemplo

9) Dirigirse a la carpeta donde se encuentra el Portal C:\wamp\www\Portal; en donde

se tiene que eliminar completamente la carpeta "installation".

Figura B-9. Finalización de la Instalación

10) Se confirma la eliminación dando clic en el botón “Si”

Figura B-10. Borrar la carpeta Installation

149
11) Si damos clic en “Portada”.

Figura B-11. Iconos de Portada y Administración

12) Aparecerá una portada como la siguiente:

Figura B-12. Bienvenida de Joomla

150
 C. MANUAL DE JOOMLA
 DISEÑO DEL MENU
o Crear Nuevo Menú
Una vez ingresado, usuario y contraseña en el administrador de Joomla
(backend) aparecerá la siguiente ventana

Figura C-1. Backend del portal web

En el Menú Principal se debe escoger la opción Menús, seleccionar el ítem Gestor de

Menús, aparece una ventana similar a la siguiente:

Figura C-2. Gestor de Menús

Seleccionar la opción Nuevo, en dónde se debe llenar los siguientes campos:

151
Nombre Único: Es el nombre de identificación usado por Joomla para identificar este
menú dentro del código y debe ser único
Título: Es el título para el Menú
Descripción: Descripción para el menú
Título del módulo: El título que se dará al módulo en el gestor de módulos

Figura C-3. Crear Menú

A continuación se debe guardar haciendo clic en el botón Guardar

o Crear Ítems
En el administrador de Joomla seleccionar Menús, se desplegaran al final los menús
creados, hay que seleccionar el menú que se va a insertar los ítems.
En seguida aparecerá una ventana del menú con sus ítems, como muestra la siguiente
figura

Figura C-4. Gestor de Items del menú

A continuación seleccionar el botón Nuevo, aquí se debe seleccionar el tipo de ítem

del menú, como muestra la siguiente figura:

152
 Figura C-5. Seleccionar tipo de Ítem.

A continuación hay que configurarlo dependiendo del tipo de ítem seleccionado.

Para nuestro Portal Web se han creado ítems, la mayoría son de tipo Artículos, razón
por cual a continuación se detallara acerca de la configuración este tipo de item

Seleccionar Artículos: seleccionar la opción Artículo, luego Presentación del

Artículo. Como muestra la siguiente imagen:

Figura C-6. Tipo de Ítem Artículos

Al seleccionar Presentación del Artículo, este ítem sirve para crear un artículo como
153
muestra la siguiente figura:

Figura C-7. Ítem: Presentación del Articulo

En dónde:
Título: Es el título del artículo
Parámetros-Básico: Hay que seleccionar el artículo que se va a mostrar en el ítem,

para ello se hace clic en , aquí se muestra todos los artículos creados, como
muestra la siguiente figura:

Figura C-8. Selección del artículo

Una vez seleccionado el artículo, este aparecerá en la pestaña de Parámetros-Básico

154
 Figura C-9. Artículo seleccionado

El resto de campos se deja como esta. Luego hay que guardar seleccionado el botón
Guardar.

 DISEÑO DE NOTICIAS

o Agregar Nueva Noticia

Una vez ingresado, usuario y contraseña en el administrador de Joomla (backend), en
Menú Principal hay que señalar la opción Contenido, luego Gestor de Artículos, a
continuación se presentara una ventana similar a la siguiente:

Figura C-10. Gestor de Artículos

A continuación se selecciona Nuevo, en dónde hay llenar algunos campos:

Figura C-11. Crear Nuevo Artículo

155
En donde:
Titulo: Es el título de la Noticia que se va a publicar
Sección: Aquí se selecciona Noticias y automáticamente se cargara la categoría Noticias.
Luego se redacta la noticia, donde se puede poner imágenes, elegir el tipo de letra, etc

Figura C-12. Articulo Creado

Existen pestañas en la parte derecha de la ventana, estas pestañas permiten configurar los
artículos

Figura C-13. Pestañas para configurar los Artículos

Parámetros-Artículo: Para configurar la fecha de inicio de la publicación de la noticia y la

fecha de finalización de la publicación

Parámetros-Avanzados: En esta pestaña podemos configurar algunas opciones (ícono pdf,

ícono imprimir, etc), donde cada opción tiene tres alternativas: Usa Valor Global, Si, No.

Se escogerá Ocultar en las opciones: Nombre del autor, Creado en fecha y hora,
Modificado en fecha y hora, el resto de opciones quedara igual con el valor predeterminado:
Usa el valor Global.
156
Información de metadatos: En esta pestaña no se configura nada, se deja como esta.

Una vez realizado todo el proceso anterior se selecciona Guardar.

 Modificar Noticia

Para Modificar una Noticia, en el menú principal del Administrador de Joomla se

selecciona Contenido, luego Gestor de Contenido. Se elige la categoría Noticias y a
continuación el artículo de la Noticia que se va a modificar y se selecciona Editar

Figura C-14. Escoger Artículo a Modificar

Se realiza los cambios necesarios de la noticia y luego se seleccionar Guardar

Figura C-15. Ventana para Modificar Artículo

 Eliminar Noticia

157
Para eliminar una Noticia, en el menú principal del Administrador de Joomla se selecciona
Contenido, luego Gestor de Contenido. Se elige la categoría Noticias y a continuación el
artículo de la Noticia a eliminar, y finalmente dando clic en Papelera

Figura C-16. Ventana para seleccionar el artículo a eliminar

 ADMINISTRACION DEL CALENDARIO

JEVENTS es un componente de Joomla para la administración de diferentes eventos

dentro de un calendario

Para ubicar este componente, se debe ingresar al Backend o Administrador de Joomla,

luego en el menú principal se selecciona Componentes, seguido de JEvents y se mostrara
la siguiente ventana

Figura C-17. Panel de Control de JEvents

Para crear eventos en el calendario es necesario primero crear al menos una categoría

 Crear Categoría

158
Para crear una categoría, en el panel de control de Jevents se selecciona Administrar
Categorías y aparecerá la siguiente ventana, donde se da clic sobre el botón Nuevo.

Figura C-18. Ventana de las Categorías creadas

Se debe llenar el campo Titulo, que es el título de la Categoría, se selecciona un color para
la categoría para diferenciarla del resto de categorías. En descripción se escribe la
descripción de la categoría. Terminado el proceso de configuración se da clic sobre el botón
Guardar.

Figura C-19. Crear Categoría

 Crear Eventos

Para crear un evento, en el panel de Control de Jevents, se debe seleccionar la opción

Administrar eventos.

159
 Figura C-20. Eventos creados

A continuación hay que seleccionar Nuevo. Se debe configurar algunos campos:

Asunto: Es el nombre del Evento

Categorías: Se selecciona una categoría.

Figura C-21. Crear Evento

En la pestaña Calendario, se configura el inicio y el final del evento. A continuación se da

160
clic sobre Guardar

Figura C-22. Configurar Calendario del Evento

GALERIA DE IMÁGENES

Es un componente de Joomla para mostrar galerías de imágenes en diferentes estilos.

Para poder administrar las imágenes se debe ingresar al componente, para ello hay que
situarse en el administrador de Joomla y seleccionar Componentes – Phoca Gallery –
Panel de Control. Luego se presentará la siguiente ventana:

Figura C-23. Panel de Control de Phoca Gallery

Para subir imágenes lo primero que se debe hacer es crear al menos una categoría y colocar
las imágenes en esa categoría

 Crear Categoría

Para crear una categoría en el Panel de Control Phoca Gallery hay que seleccionar la
opción Categorias y se visualizará una ventana como la siguiente:
161
 Figura C-24. Categorías creadas

Se selecciona el botón Nuevo. Se desplegará una nueva ventana donde se debe llenar el
campo Titulo que es el nombre de la Categoría, el resto de campos permanecerá con su
valor por defecto. Para finalizar se debe seleccionar Guardar.

 Subir Imágenes

Una vez que se haya creado al menos una categoría, a continuación hay que subir las
imágenes es necesario crear al menos una categoría; en la ventana principal de “Phoca
Gallery” se debe dar clic en el botón “Imágenes”. Se desplegará una ventana como la que se
detalla a continuación.

Figura C-25. Ventana de imágenes cargadas

162
A continuación se hace clic en el botón Nuevo y se presentará la siguiente ventana, en
dónde hay que llenar algunos campos que se indica a continuación:

Nombre: Se específica el nombre de la imagen

Categoría: Se selecciona una de las categorías creadas con anterioridad a la que la imagen
va a pertenecer.
Filename: En este campo se selecciona la imén a subir, para ello se hace clic en el botón

Imagen y se presentara una ventana como la siguiente:

Figura C-26. Carpeta de Imágenes de Phoca Gallery

En donde tenemos la carpeta Galería, abrimos y aquí se van a ubicar las imágenes que se

van a subir

163
 Figura C-27. Imágenes de la Carpeta Galería

A continuación se hace clic en el botón Examinar , se busca el archivo a subir,

una vez seleccionado se hace clic en el botón Abrir. Para finalizar se selecciona Start

upload .

 Eliminar Imágenes

Para eliminar Imágenes, se debe ingresar al Panel de control de Phoca Gallery y

seleccionar Imágenes. Se selecciona la o las imágenes que se van a eliminar y a
continuación se debe hacer clic en el botón Borrar y la o las imágenes serán eliminadas.

164
Figura C-28. Eliminar Imágenes

165
D. MANUAL DE USUARIO
 Menú Principal

En esta sección se encuentra un menú que contiene información referente al

Colegio, y los servicios para el usuario registrado. Para ello se debe dar clic
sobre cada uno de las pestañas para poder acceder a la información de forma
más detallada.

Figura D-1. Menú Principal del Portal

 Galería de Imágenes

Figura D-2. Pestaña de la Galería de Imágenes

Pertenece al Menú Principal y al hacer clic en la pestaña nos mostrara los

diferentes álbumes que tiene la galería.

Figura D-3. Galería de Imágenes

166
A continuación se debe escoger un álbum dando clic sobre el mismo y se
visualizan todas las imágenes que se encuentran dentro del álbum seleccionado.
Se presentan imágenes pequeñas.

Figura D-4. Imágenes de una Categoría

Pero si desea verlas más grande se debe hacer clic sobre las mismas

167
 Figura D-5. Presentación de Imágenes

 Contáctenos

Figura D-6. Pestaña de Contáctenos

La opción Contáctenos tiene dos pestañas, las que se detallan a continuación:

Al hacer clic en la pestaña se presentara una ventana, en

donde, cualquier persona puede enviar mensajes, en esta ventana se debe llenar los
siguientes campos:

Escriba su nombre y apellidos: Se debe especificar el nombre de la persona que envía

el mensaje.
Dirección de e-mail: Se debe escribir el e-mail de la persona que está redactando el
mensaje.
Tema del mensaje: Es el tema del mensaje que se va a redactar.
Escriba su mensaje: Es el espacio en donde se va a detallar el mensaje.
Si desea recibir una copia del mensaje que está redactando a su e-mail se debe señalar

la casilla

168
Luego de haber llenado los campos detallados anteriormente se debe dar clic en el botón

Figura D-7. Formulario para enviar Mensaje

Al hacer clic en la pestaña nos mostrara un mapa con la

ubicación del Colegio

169
 Figura D-8. Ubicación del Colegio en el Mapa de Cuenca

Al dar clic en el boton (+) permite acercar la imagen. Al dar clic en el

botón (-) permite alejar la misma.

Al hacer clic en Mapa muestra la imagen del mapa de manera

tradicional. Al hacer clic en Satélite muestra la imagen del mapa por satélite.

 Menú
En este menú se encuentran ítems que también se encuentran dentro del menú
principal, estos ítems son los más accedidos por los usuarios, esta fue la razón
por la que se coloraron en este menú, para un rápido acceso.

170
 Figura D-9. Menú Secundario

 Acceso Online

Figura D-10. Acceso OnLine

Para iniciar sesión se debe dar clic en el siguiente icono y enseguida

se desplegará una ventana como la siguiente

Figura D-11. Inicio de Sesión

Aquí se debe llenar:

Nombre de Usuario: Se debe escribir el nombre de usuario.
Clave: Se debe ingresar la contraseña o clave del usuario.

A continuación se da un “enter” o clic en esta imagen para acceder a la

información correspondiente al usuario registrado.

Para salir de la sesión de usuario

171
 Figura D-12. Cerrar Sesión

Se debe dar clic en la imagen

A continuación se debe confirmar el cierre de sesión, dando clic en el botón
“Salir”.

Figura D-13. Confirmar cierre de Sesión

 Contador de Visitas
El recuadro contador de visitas que se muestra en la pantalla principal del portal
nos muestra siempre una estadística de las visitas que ha recibido el portal.
Se muestran datos de las visitas recibidas hoy, de las recibidas la última semana,
de las recibidas el último mes y del total de visitas recibidas.

Figura D-14. Contador de Visitas

 Calendario

172
 Figura D-15. Calendario de Eventos

En el calendario podemos ver un desglose del mes con los eventos que hay
anotados. La vista puede ser cambiada con los botones superiores a diaria,
semanal, anual (en vez de la mensual que está definida por defecto).

Figura D-16. Eventos por Mes

173
Cuando pulsamos sobre un evento en cuestión, podemos ver información más
detallada sobre ese evento.

Figura D-17. Información detallada del Evento

174
 MENU DEL ESTUDIANTE

Una vez que el usuario a iniciado sesión como estudiante se mostrara la siguiente
pagina

Figura D-18. Opciones del Estudiante

 Menú Estudiante
Este menú muestra los siguientes ítems:

Figura D-19. Ítems del Menú Estudiante

Al hacer clic en , muestra los datos personales del estudiante

como muestra la siguiente figura

175
 Figura D-20. Ítem Tu Perfil

Al hacer clic en , veremos las materias con sus respectivas

notas de cada mes, el examen, las faltas y el promedio, correspondientes a cada
trimestre

176
 Figura D-21. ítem Consultar Notas

Si deseamos ver las notas de otros trimestres, solo tenemos que arrastrar la barra de
desplazamiento.
En promedio final podemos visualiza: Extras (puntos adicionales), Supletorio (la nota
que debería obtener en el examen supletorio,) y el promedio final

177
 Figura D-22. Notas por Trimestres

Podemos imprimir las notas, haciendo clic en y nos presentara la

siguiente pagina en formato pdf. Y seleccionamos imprimir.

Figura D-23. Notas en formato PDF

Al seleccionar el Ítem , nos presentara a todos los docentes

con sus respectivas materias que imparten.
A continuación hay que seleccionar un docente y pulsar el botón “Aceptar”

178
 Figura D-24. Ítem Evaluar Docente

Y nos mostrara un cuestionario, donde el estudiante deberá ir evaluando cada pregunta

utilizando la siguiente escala de valoración
SIEMPRE (5), CASI SIEMPRE (4), ALGUNAS VECES (3), RARAVEZ (2), NUNCA
(1).
Una vez completada la evaluación hay que guardar para ello se debe pulsar el botón
“Guardar”

179
Figura D-25. Cuestionario para Evaluar

180
A continuación se debe seleccionar otro docente para evaluar, y seguimos con el mismo
procedimiento indicado anteriormente, hasta terminar con todos los docentes.

Al seleccionar el Ítem , podemos visualizar los periodos

lectivos anteriores y consultar las notas.

Figura D-26. Ítem Períodos lectivos

Al hacer clic en “2009-2010”, se visualizara las notas de ese año lectivo, en formato
pdf.

181
 Figura D-27. Notas por Períodos Lectivos

Al seleccionar nos presentara la ventana de confirmación de

salir de sesión y debemos pulsar “Salir”

Figura D-28. Ítem Cerrar Sesión

 Menú Principal del Estudiante

182
 Figura D-29. Menú Principal del estudiante

Al seleccionar la pestaña , iremos a la página principal del Portal y desde allí

el estudiante puede ir realizando las diferentes consultas.

Figura D-30. Ítem Inicio del Menú Principal

Al seleccionar la pestaña nos presentara un formulario, para

modificar la cuenta del usuario, aquí el usuario puede cambiar su Nombre, E-mail,
Contraseña. También el usuario estudiante tiene la opción de seleccionar una imagen y
visualizarla en el ítem Tu Perfil

183
 Figura D-31. Ítem Pagina Personal

Para seleccionar una imagen se debe hacer clic en el botón , en donde hay
que seleccionar la imagen a subir.
Una vez seleccionada la foto y realizada las modificaciones necesarias hay que guardar,

haciendo clic en el botón

Y para ver la imagen hay que ir al ítem Tu Perfil.

Al pulsar , nos mostrara un mensaje para confirmar y debemos pulsar

“Salir”

MENU SECRETARIA
Una vez que la secretaria se ha identificado como tal, se visualizara la siguiente
ventana

184
 Figura D-32. Opciones del Usuario Secretaria

Al seleccionar se visualizara el resultado de las evaluaciones

a los docentes realizadas por los estudiantes. Los resultados se presentan por Curso, por
materia y por Profesor y el puntaje es sobre 100

Figura D-33. Ítem Evaluaciones

185
Al seleccionar nos presentara la ventana de confirmación de
salir de sesión y debemos pulsar “Salir”

Figura D-34. Ítem cerrar Sesión

186