Desarrollo de Un Portal Con IWeb

DIRECCIÓN GENERAL DE EDUCACIÓN SUPERIOR TECNOLÓGICA INSTITUTO TECNOLÓGICO DE CD. VALLES

RESIDENCIA PROFESIONAL

DESARROLLO DE UN PORTAL PARA LOS PROCESOS ACADÉMICOADMINISTRATIVOS DE LA UNIVERSIDAD PEDAGÓGICA NACIONAL UNIDAD 242 DE CIUDAD VALLES, S.L.P

LICENCIATURA EN INFORMÁTICA

GONZÁLEZ MEDINA KARINA GUADALUPE

04690399

RONQUILLO FLORES NETTIE

04690349

ASESOR INTERNO:

ASESOR EXTERNO:

ING. ROSA IMELDA GARCIA CHI

C.PRIV. IRMA NORIEGA

IT. CD. VALLES.


INDICE INTRODUCCIÓN .............................................................................................. 1 1

JUSTIFICACIÓN ......................................................................................... 2

2

OBJETIVOS ................................................................................................ 3

3

4

2.1

Objetivo general ................................................................................... 3

2.2

Objetivos específicos............................................................................ 3

CARACTERIZACIÓN DEL ÁREA DONDE SE PARTICIPÓ ....................... 4 3.1

Descripción del área de trabajo ............................................................ 4

3.2

Descripción del área de trabajo ............................................................ 5

3.3

Antecedentes de la empresa ................................................................ 6

3.4

Misión ................................................................................................... 8

3.5

Visión.................................................................................................... 8

3.6

Organigrama ........................................................................................ 9

FUNDAMENTO TEÓRICO ....................................................................... 10 4.1

Internet y la web ................................................................................. 10

4.2

La World Wide Web............................................................................ 10

4.3

Qué es un Portal................................................................................. 11 i

IT. CD. VALLES.


4.4

Funciones y objetivos de un Portal ..................................................... 11

4.5

Bloque de construcción HTML ........................................................... 12

4.5.1 Los URL ........................................................................................ 13 4.5.2 Como Diseñar Su Sitio .................................................................. 14 4.5.3 Hojas de estilo............................................................................... 16 4.5.4 Herramientas HTML ...................................................................... 17 4.6

Dreamweaver ..................................................................................... 17

4.7

PHP .................................................................................................... 18

4.8

MySQL ............................................................................................... 19

4.9

Como publicar la página en la Web .................................................... 20

4.9.1 Como conseguir un dominio.......................................................... 21 4.10

Ingeniería web ................................................................................. 22

4.10.1 Estratos de la ingeniería web de WebApp .................................. 22 4.11

El proceso de la ingeniería Web ..................................................... 24

4.11.1 Definición del marco de trabajo ................................................... 24 4.12

Formulación y planeación para IWeb .............................................. 25

4.12.1 Formulación de sistemas en Web ............................................... 26

ii

IT. CD. VALLES.


4.12.2 Modelado de análisis para aplicaciones web .............................. 28 4.12.3 Modelado de diseño para aplicaciones web ............................... 33 4.13

Pirámide de diseño IWeb ................................................................ 36

4.14

Diseño de la interfaz de la WebApp ................................................ 37

4.14.1 Principios y directrices del diseño de interfaz.............................. 37 4.14.2 Mecanismos de control de la interfaz .......................................... 37 4.14.3 Flujo de trabajo en el diseño de la interfaz .................................. 38 4.15

Diseño estético................................................................................ 39

4.16

Diseño del contenido ....................................................................... 39

4.17

Diseño arquitectónico ...................................................................... 40

4.18

Diseño de navegación ..................................................................... 40

4.19

Diseño a nivel de componentes ...................................................... 41

4.20

Prueba de conceptos para WebApp ............................................... 42

4.21

Prueba del contenido ...................................................................... 44

4.22

Prueba de la interfaz de usuario ..................................................... 44

4.23

Prueba al nivel de componentes ..................................................... 44

4.24

Prueba de navegación .................................................................... 45

iii

IT. CD. VALLES.

4.25 5


Prueba de la configuración.............................................................. 45

ALCANCES Y LIMITACIONES ................................................................. 46 5.1

Alcances ............................................................................................. 46

5.2

Limitaciones ....................................................................................... 46

6

PROBLEMAS A RESOLVER .................................................................... 47

7

DESARROLLO DE ACTIVIDADES ........................................................... 48 7.1

Planteamiento y Formulación ............................................................. 48

7.1.1 Entrevista con el cliente ................................................................ 48 7.1.2 Identificación de necesidades y requerimientos ............................ 48 7.2

Planteamiento y Formulación ............................................................. 49

7.2.1 Entrevista con el cliente ................................................................ 49 7.2.2 Identificación de necesidades y requerimientos ............................ 49 7.2.3 Determinar objetivos de la WebApp .............................................. 51 7.2.4 Recopilación de requisitos ............................................................ 51 7.2.5 Establecer alcances y limitaciones................................................ 52 7.3

Planificación ....................................................................................... 52

7.3.1 Análisis de recursos y factibilidad ................................................. 52

iv

IT. CD. VALLES.


7.3.2 Análisis de riesgos ........................................................................ 53 7.4

Análisis ............................................................................................... 54

7.4.1 Análisis Relación-Navegación ....................................................... 54 7.4.2 Análisis de Configuración .............................................................. 54 7.4.3 Análisis Funcional ......................................................................... 55 7.4.4 Análisis de Interacción .................................................................. 55 7.4.5 Análisis de Contenido ................................................................... 56 7.5

Ingeniería ........................................................................................... 56

7.5.1 Diseño de componentes ............................................................... 56 7.5.2 Diseño arquitectónico.................................................................... 57 7.5.3 Diseño de navegación................................................................... 57 7.5.4 Diseño de contenido ..................................................................... 58 7.5.5 Diseño de las bases de datos ....................................................... 58 7.5.6 Diseño de la interfaz ..................................................................... 59 7.6

Generación de páginas y pruebas ...................................................... 59

7.6.1 Prueba de configuración ............................................................... 60 7.6.2 Prueba de componentes ............................................................... 60

v

IT. CD. VALLES.


7.6.3 Prueba de navegación .................................................................. 63 7.6.4 Prueba de contenido ..................................................................... 66 7.6.5 Prueba de la interfaz ..................................................................... 67 7.7

Evaluación del cliente ......................................................................... 67

7.7.1 Validación del avance ................................................................... 67 7.8

Implementación .................................................................................. 68

7.8.1 Configuración del servidor ............................................................ 68 7.8.2 Webhosting ................................................................................... 71 8

RESULTADOS .......................................................................................... 72

9

CONCLUSIONES Y RECOMENDACIONES ............................................ 73 9.1

Conclusiones ...................................................................................... 73

9.2

Recomendaciones .............................................................................. 74

10

BIBLIOGRAFÍA ...................................................................................... 75

11

GLOSARIO ............................................................................................ 76

12

ANEXOS ................................................................................................ 80

13

ÍNDICE DE ILUSTRACIONES ............................................................. 135

14

INDICE ANALÍTICO ............................................................................. 136

vi

IT.CD. VALLES.


INTRODUCCIÓN Hoy en día, el Internet es un medio de comunicación pública, cooperativa y autosuficiente en términos económicos, accesible a cientos de millones de personas en el mundo entero. Físicamente, el Internet usa parte del total de recursos actualmente existentes en las redes de telecomunicaciones. El componente más usado en el Internet es definitivamente el Web. Un portal en internet representa un medio de comunicación entre el usuario y la organización, lo que permite una mayor proyección. Un portal de Internet es un sitio web cuyo objetivo es ofrecer al usuario, de forma fácil e integrada, el acceso a una serie de recursos y de servicios, entre los que suelen encontrarse buscadores, foros, documentos, aplicaciones, compra electrónica, etc. Principalmente están dirigidos a resolver necesidades específicas de un grupo de personas o de acceso a la información y servicios de una institución pública o privada. Este proyecto de residencia profesional describe el desarrollo de un portal para la Universidad Pedagógica Nacional Unidad 242 a través del proceso de desarrollo de software orientado objetos utilizando el UML como lenguaje de modelado y aplicando las fases de desarrollo del modelo IWeb. En este documento se describe en el Fundamento teórico lo referente a desarrollo de software Web, así mismo, en la sección de actividades se refleja la aplicación del modelo IWeb de manera detallada y en los anexos se representan todos los diagramas generados.

1

IT.CD. VALLES.


1 JUSTIFICACIÓN La Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles establece un compromiso con sus alumnos en la educación y formación, como su lema lo dice “Educar para Transformar”, sustentada en la calidad del Proceso Educativo que ésta Institución maneja; para cumplir con los requerimientos que la Unidad 242 necesita para mantenerse a la vanguardia y sobre todo cumplir con las necesidades de sus alumnos y docentes. Por esta razón se desarrolla un Portal para gestionar el proceso Académico-Administrativo. Al desarrollar el Portal para la Universidad, se tendrá como finalidad la difusión de la información de las calificaciones, eventos académicos, así como el catálogo de bibliografía de la institución; además fungirá como gestor administrativo del usuario (alumno o maestro). La importancia de tener un control en el proceso Académico-Administrativo de la Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles sería una parte primordial en el desarrollo del Portal, por otra parte contendrá el catalogo de los libros con los que cuenta la biblioteca de dicha Institución, para que el usuario tenga conocimiento de la bibliografía disponible.

.

2

IT.CD. VALLES.


2 OBJETIVOS 2.1 Objetivo general Desarrollar un Portal para los procesos académico-administrativos de la Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles, para agilizar el informe de calificaciones, integrar los datos académicos y la difusión de la información entre la comunidad universitaria.

2.2 Objetivos específicos  Plantear y formular los objetivos que se alcanzarán a través de la implementación del Portal, así mismo delimitar el alcance de éste.  Planificar las estimaciones enfocadas a los costos durante el desarrollo, además de los riesgos y esfuerzos que se originarán.  Analizar los requerimientos técnicos, gráficos y de contenido que se emplearán durante el desarrollo del Portal para la Universidad Pedagógica Nacional Unidad 242.  Efectuar el diseño de contenido y producción integrando a ésta etapa: texto, gráficas, videos, etc.  Generar páginas y pruebas para evaluar si la información contenida se generará correctamente, aplicando pruebas de configuración, componentes, navegación, contenido y de interfaz.

3

IT.CD. VALLES.


3 CARACTERIZACIÓN DEL ÁREA DONDE SE PARTICIPÓ 3.1 Descripción del área de trabajo La Universidad Pedagógica Nacional Unidad 242 en sus inicios el 30 de mayo de 1992 no contaba con un laboratorio de cómputo, lo que dificultaba las actividades del alumnado de dicha institución, por lo que optaron por realizar una gran inversión con el único fin de cubrir las necesidades que actualmente en esa fecha se presentaban, ya validado el proyecto se construyó en la parte trasera de la institución a un costado del departamento de servicios escolares un pequeño salón o área para que ahí se llevarán a cabo las actividades que más demandaban los estudiantes. Actualmente

esta

área

con

un

total

de

21

máquinas

distribuidas

uniformemente además instalaron Internet inalámbrico Prodigy Infinitum con 4MB de banda ancha para dar confort a los que ahí se encuentran trabajando atendiendo las exigencias del alumnado, pero ahora surge una gran necesidad la cuál consta de la implementación de un Portal Web para Informar a la sociedad en general y al alumnado de la Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles sobre los eventos y/o actividades de la Institución, asimismo automatizar los procesos Académico-Administrativos mediante la implementación de éste para la mejora del servicio del área administrativa obteniendo como beneficios aumento en la demanda de población estudiantil, incremento de los recursos económicos e impulso hacia una mejor infraestructura, por consiguiente se pretende en un mañana acarrear mayores bienes acrecentando el capital deseado por los directivos de la institución académica.

4

IT.CD. VALLES.


3.2 Descripción del área de trabajo La Universidad Pedagógica Nacional Unidad 242 en sus inicios el 30 de mayo de 1992 no contaba con un laboratorio de cómputo, lo que dificultaba las actividades del alumnado de dicha institución, por lo que optaron por realizar una gran inversión con el único fin de cubrir las necesidades que actualmente en esa fecha se presentaban, ya validado el proyecto se construyó en la parte trasera de la institución a un costado del departamento de servicios escolares un pequeño salón o área para que ahí se llevarán a cabo las actividades que más demandaban los estudiantes, por lo que ahora ya cuenta con dicha área de cómputo con un total de 21 máquinas distribuidas uniformemente además instalaron Internet inalámbrico Prodigy Infinitum con 4MB de banda ancha para dar confort a los que ahí se encuentran trabajando atendiendo las exigencias del alumnado, pero ahora surge una gran necesidad la cuál consta de la implementación de un Portal Web para Informar a la sociedad en general y al alumnado de la Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles sobre los eventos y/o actividades de la Institución, asimismo automatizar los procesos Académico-Administrativos mediante la implementación de éste para la mejora del servicio del área administrativa obteniendo como beneficios aumento en la demanda de población estudiantil, incremento de los recursos económicos e impulso hacia una mejor infraestructura, por consiguiente se pretende en un mañana acarrear mayores bienes acrecentando el capital deseado por los directivos de la institución académica.

5

IT.CD. VALLES.


3.3 Antecedentes de la empresa Al principio en el mes de octubre de 1979, nace la Unidad UPN 242, en Ciudad Valles. Siendo gobernador en el Estado el Profr. y Lic. Carlos Jonguitud Barrios (1979-1985), quien fuera el cabecilla del grupo “Vanguardia Revolucionaria” del SNTE, quien a su vez, iniciará las gestiones para la creación de la UPN, durante el gobierno de José López Portillo, a nivel nacional. En sus inicios, la Unidad UPN 242 tuvo sus oficinas en el tercer nivel del edificio que se encuentra ubicado en la esquina de Abasólo y Carranza de la Zona Centro. Este edificio albergaba la oficina administrativa, y además, dos pequeñas instalaciones que servían para realizar reuniones de los asesores, así como para atender a los maestros-alumnos que lo solicitaban. Las gestiones iniciales para la creación de la Unidad UPN 242, en esta ciudad, estuvo a cargo del Profr. Bonifacio Ramírez Olvera quien fuera el primer Director de ésta Institución Académica y estando como Jefa

Administrativa la Profra. Ma.

Enedina Méndez Montaño. La instalación de la Unidad UPN 242, estuvo mediada por una fuerte presión por parte de un grupo de Tamazunchale, quienes argumentaban que en ese lugar, existía un mayor número de maestros que podrían ser beneficiados con esta nueva institución. En octubre de 1989, asume la Dirección de la Unidad UPN 242, la Profra. Elba Lidia López Jiménez, como Directora de la Unidad, las oficinas de éstas se trasladaron al inmueble que actualmente ocupa, el cual se ubica en la calle Mozambique, Esquina con Damas. S/n, Fraccionamiento Valle Alto, 3a Sección, en Ciudad Valles.

6

IT.CD. VALLES.


La construcción del edificio se inicio el 26 de febrero de 1982, siendo Gobernador del Estado el Lic. Carlos Jonguitud Barrios, quien fuese el responsable de poner la primera piedra. Las gestiones para la construcción de dicha obra estuvo a cargo de la Jefa Administrativa Profra. Ma. Enedina Méndez Montaño, en apoyo a la Directora. Elba Lidia López Jiménez, las cuales se realizaron frente al Director de la CAPFSE, Lic. Guillermo Fonseca Álvarez. Cabe aclarar, que el proyecto de construcción estaba

destinado al Estado de Michoacán, pero debido a la alta

inscripción registrada por la apertura de la Licenciatura en Educación Preescolar y Educación Primaria, orientada al medio indígena, Plan 90 (LEPEPMI), el proyecto se trasladó a esta ciudad. El 30 de mayo de 1992, se inauguró formalmente el edificio que hoy ocupa la UNIDAD UPN 242, fungiendo como Director el Mtro. Bernardo Guillermo Bravo Rodríguez (1991-1996). En ese periodo de administración fungen como jefas administrativas, la Profra. Ana Rosa García Navarrete, la L.A.E. Ernestina Ramírez Lárraga, la Lic. Carmen de la Fuente y de la Rosa y, finalmente en abril de 1995, la C. Irma Noriega, quien sigue en el cargo hasta la fecha. En Noviembre de 1996, asume el cargo de Director de la Unidad UPN 242, EL Lic. Juan Bernardo Escamilla Hernández, y quien se retira en Mayo de 2000, asumiendo el cargo como Director de la mencionada Unidad, desde entonces y hasta la fecha, el Mtro. Daniel Cruz Laureano.

7

IT.CD. VALLES.


3.4 Misión La Universidad Pedagógica Nacional Unidad 242 tiene como misión: “formar investigadores y profesionales de la educación capaces de generar y aplicar conocimientos con una concepción humanística acorde con las necesidades nacionales, estatales, regionales y locales; así como diseñar, elaborar, producir y difundir materiales de la cultura pedagógica, realizar investigación educativa y proporcionar servicios de intercambio académico con otras instituciones educativas públicas o privadas y de la sociedad en general”.

3.5 Visión La Universidad Pedagógica Nacional Unidad 242 tiene como visión: “ofrecer una propuesta de formación educativa a los profesionales de la educación de la región huasteca y zona media del estado que les proporcione elementos científicos, humanísticos e innovadores que contribuyan al mejoramiento de sus prácticas educativas en todos sus niveles”. (DIRECCIÓN ADMINISTRATIVA DE LA UPN)

8

IT. CD. VALLES


3.6 Organigrama DIRECCIÒN MTRO. DANIEL CRUZ LAUREANO

SUBDIRECCIÒN ACADÈMICA MTRO. JUAN JOSE AMARO VARGAS

COMISIÒN DE TITULACIÒN MTRO. BLAS LARA BARRON

JEFATURA ADMINISTRATIVA IRMA NORIEGA

PERSONAL ADMINISTRATIVO Y DE APOYO

DEPENDENCIAS DE EDUCACIÒN SUPERIOR

SERVICIOS ESCOLARES MA. GRISELDA BARRA

CENTRO DE CÓMPUTO LICENCIATURA EN EDUCACIÒN PARA EL MEDIO INDIGENA LICENCIATURA EN INTERVENCIÒN EDUCATIVA MTRO. RAYMUNDO AVALOS PEREZ (Coordinador)

SUBSEDE TAMAZUNCHALE, S.L.P PROFRA. ANGELINA HERNÀNDEZ MENDEZ COORDINADORA

LICENCIATURA EN EDUCACIÒN MAESTRIA EN EDUCACIÒN, CAMPO FORMACIÒN DE DOCENTES Y PRÀCTICA PROFESIONAL. MTRO. JUAN JOSÈ AMARO VARGAS (Coordinador)

SEDE CD. VALLES MTRO. BLAS LARA BARRÒN COORDINADOR

SUBSEDE RIOVERDE, S.L.P. PROFR. FELIPE MARTINEZ RIVERA COORDINADOR

FUENTE: DIRECCIÓN ADMINISTRATIVA DE LA UPN. Ilustración 1. Organigrama de la UPN Unidad 242.

9

IT. CD. VALLES


4 FUNDAMENTO TEÓRICO 4.1 Internet y la web El Internet, algunas veces llamado simplemente "La Red", es un sistema mundial de redes de computadoras, un conjunto integrado por las diferentes redes de cada país del mundo, por medio del cual un usuario en cualquier computadora puede, en caso de contar con los permisos apropiados, accesar información de otra computadora y poder tener inclusive comunicación directa con otros usuarios en otras computadoras. Hoy en día, el Internet es un medio de comunicación pública, cooperativa y autosuficiente en términos económicos, accesible a cientos de millones de personas en el mundo entero. Físicamente, el Internet usa parte del total de recursos actualmente existentes en las redes de telecomunicaciones. Técnicamente, lo que distingue al Internet es el uso del protocolo de comunicación llamado TCP/IP (Transmission Control Protocol/Internet Protocol). El componente más usado en el Internet es definitivamente el Web. Su característica sobresaliente es el texto remarcado, un método para referencias cruzadas instantáneas. La exploración en el Web se realiza por medio de un software especial denominado Browser o Explorador. La apariencia de un Sitio Web puede variar ligeramente dependiendo del explorador que use. (LEMAY, 1998)

4.2 La World Wide Web WWW es un sistema hipermedia interactivo desarrollado sobre Internet. La idea de hipermedia es la de juntar texto, imágenes, audio y vídeo dentro de un mismo envoltorio llamado documento. WWW se asienta sobre el protocolo HTTP (Hyper Text Transfer Protocol) y sobre el lenguaje de definición de documentos hipermedia HTML (HyperText Markup Language). 10

IT. CD. VALLES


El primer precedente del WWW se puede encontrar en un tratado escrito por Vannevar Bush titulado “As We May Think”, de 1954, en el que básicamente animaba a los científicos a hacer más accesible a todo el mundo sus conocimientos y experiencia. En este tratado surgieron las nociones de hipertexto e hipermedia. Así, WWW es el sistema de difusión del conocimiento más importante que implementa estas nociones. (MORRIS, 1997) (MORRIS, 2006)

4.3 Qué es un Portal Portal es un término, sinónimo de puente, para referirse a un Sitio Web que sirve o pretende servir como un sitio principal de partida para las personas que se conectan al World Wide Web. Son sitios que los usuarios tienden a visitar como sitios ancla. Los Portales tienen gran reconocimiento en Internet por el poder de influencia que tienen sobre grandes comunidades. Principalmente están dirigidos a resolver necesidades específicas de un grupo de personas o de acceso a la información y servicios de una institución pública o privada. Un Sitio Web no alcanza el rango de Portal sólo por tratarse de un sitio robusto o por contener información relevante. Un Portal es más bien una plataforma de despegue para la navegación en el Web. (MORRIS, 1997) (PRESSMAN, 2007)

4.4 Funciones y objetivos de un Portal El término Portal tiene como significado puerta grande, y precisamente su nombre hace referencia a su función u objetivo: punto de partida de un usuario que desea entrar y realizar búsquedas en la web u obtener información importante de él. Se puede decir que un Portal ofrece servicios para la navegación en el internet, logrando incrementar la intensidad de tráfico en el mismo.

11

IT. CD. VALLES


Un Portal de Internet puede ser un Centro de contenido intermediario entre compradores y vendedores de rubros específicos, estos se pueden complementar con herramientas que le ayuden a identificar empresas que satisfagan necesidades de un comprador, visualizar anuncios de vendedores, ofrecer cotizaciones, brindar correos electrónicos, motores de búsqueda, etc. El Portal es considerado un intermediario de información que tiene como fuente de ingreso la publicidad de empresas que ahí se anuncian. (MORRIS, 1997)

4.5 Bloque de construcción HTML Puede crear un documento en HTML con cualquier editor o procesador de textos entre los que se incluyen los más básicos Teach Text o SimpleText Packmak y el bloc de notas Wordpad para Windows; todos ellos se incluyen gratuitamente con un sistema operativo correspondiente. También puede comprar un editor de páginas web, como PageMill o Dreamweaver. Etiquetas HTML. Las etiquetas HTML son comandos escritos entre los signos “menor que” (<) y “mayor que” (>), también llamados corchetes angulares, que indica cómo debe el navegador mostrar el texto. Existen versiones de apertura y cierre para la mayor parte de las etiquetas (pero no de todas) y afectan al texto que esta contenido entre las dos etiquetas. Tanto en las etiquetas de apertura como las de cierre emplean el mismo comando, pero la etiqueta de cierre lleva una barra inclinada adicional /. (CASTRO, 2001) Atributos. El atributo se introduce entre el nombre del comando y el símbolo “>” del final. Normalmente puede emplear una serie de atributos dentro de una misma etiqueta. Simplemente escriba uno tras otro (en cualquier orden) con un espacio entre ellos. (CASTRO, 2001)

12

IT. CD. VALLES


4.5.1 Los URL El Localizador Uniforme de Recursos, o URL, es una forma imaginativa de decir dirección. Contiene información sobre donde se encuentra el archivo y sobre qué debe hacer un navegador con él. Cada archivo de Internet dispone de un URL único. La primera parte de un URL se denomina esquema. Informa al navegador de cómo tratar con el archivo que va a abrir. Uno de los esquemas que vera es http (HipperText Transfer Protocol, Protocolo de Transferencia de HiperTexto). La segunda parte del URL es el nombre del servidor donde se encuentra ubicado el archivo, seguido por la ruta que conduce el archivo y del propio nombre del archivo. Otros esquemas habituales son: HTTPS, para páginas Web seguras, FTP (File Transfer Protocol, Protocolo de Transferencia de Archivos). Los URL pueden ser absolutos o relativos. Un URL absoluto muestra la ruta completa del archivo, incluyendo el esquema, el nombre del servidor, la ruta completa y el propio nombre de archivo. Un URL absoluto es como la dirección completa de un domicilio, que incluye nombre, calle y número, ciudad, provincia, código postal y país. El URL absoluto no depende en sí misma de la ubicación del archivo referenciado (no importa que una Portal esté en un servidor o en el de otra persona; si el URL es absoluto, será exactamente igual que cualquiera de los casos). Del mismo modo, un URL relativo describe la ubicación del archivo deseado con relación a la ubicación del archivo que contiene el propio URL. Por tanto, podría encontrar que el URL dice algo similar a “muestra la imagen xyz que se encuentra en el mismo directorio que el archivo actual”. Así el URL relativo para un archivo que está en el mismo directorio que el archivo actual (esto es él, archivo que contiene el URL en cuestión), es, simplemente, el nombre del archivo y la extensión. Para crear el URL de un archivo que se encuentra en un subdirectorio actual, sólo es necesario el nombre del directorio seguido por una barra inclinada y el nombre del archivo y la extensión. (CASTRO, 2001) 13

IT. CD. VALLES


4.5.2 Como Diseñar Su Sitio Aunque puede lanzarse directamente a escribir páginas HTML, es una buena idea empezar por pensar como debe ser su sitio y esbozar un diseño inicial. De esta forma, dispondrá de un camino a seguir y se ahorrara tener que reorganizarlo con posterioridad. Para diseñar su sitio: 1. Pregúntese porque quiere crear esta página. ¿Qué es lo que quiere que transmita? 2. Piense en su audiencia. ¿Cómo puede ajustar su contenido para atraer a esta audiencia? Por ejemplo, ¿Debería añadir gran cantidad de gráficos o es más importante que su página se descargue rápidamente? 3. ¿Cuántas páginas necesitará? ¿Qué tipo de estructura le gustaría que tuviera? ¿Desea que sus visitantes avance por su sitio web en una dirección concreta o quiere que le sea fácil avanzar en cualquier dirección? 4. Esboce su sitio sobre el papel. 5. Idee un sistema simple y coherente para denominar a sus páginas, imágenes y otros archivos externos.

Para crear una página Web: 1. Abra cualquier editor o procesador de textos. 2. Elija Archivo, Nuevo, para crear un documento nuevo en blanco. 14

IT. CD. VALLES


3. Cree el contenido HTML. 4. Asegúrese de guardar su archivo. (CASTRO, 2001)

Como colocar los cimientos. La mayoría de las páginas Web están divididas en dos secciones: HEAD y BODY. En la sección HEAD es donde se define el título de la página, se incluye información sobre su página para los motores de búsqueda, se establece la ubicación de su página, se añade información avanzada de formato y donde se escribe las secuencias de comandos.

Para crear la sección HEAD: 1. Directamente después de la etiqueta HTML escriba . 2. Deje algo de espacio para el contenido de la sección HEAD. 3. Escriba . La sección BODY de su documento HTML encierra el contenido de su página web, la parte que sus visitantes verán, incluyendo el texto y los gráficos.

Para crear la sección BODY: 1. Detrás de la etiqueta final , escriba . 2. Deje algo de espacio para los contenidos de su página web. 3. Escriba . (CASTRO, 2001)

15

IT. CD. VALLES


4.5.3 Hojas de estilo El lenguaje HTML fue originariamente desarrollado como sistema de codificación universal que debería permitir a cualquiera ver las mismas páginas, con independencia de la plataforma que utilizará. HTML ofrece un formato estructural, pero no permite a los diseñadores mucho control sobre la apariencia de la página. Las hojas de estilo en cascada, también conocidas como CSS, o simplemente estilo, permiten asignar de una vez varias propiedades a todos los elementos de una Portal marcados con una etiqueta en particular. Además, los estilos le permiten controlar el texto que queda fuera del ámbito de las etiquetas HTML. Puede ajustar el espacio entre líneas, el color de fondo y eliminar el formateo de negritas y cursivas, entre otras cosas. También puede usar estilos junto con JavaScript para crear efectos dinámicos conocidos como DHTML. La mayor desventaja del uso de hojas de estilo es que ningún navegador las soporta completamente. Netscape 4, en particular, no soporta muy bien las hojas de estilo. (CASTRO, 2001)

Cada definición contiene una propiedad, los puntos, y uno o más valores. Las hojas internas de estilo son ideales para páginas individuales con mucho texto. Permiten crear, al principio de la página, el estilo que se usará a lo largo de un documento HTML. Las hojas de estilo externas son ideales para otorgar un aspecto común a todas las páginas de un sitio web. En lugar de crear los estilos a partir de las hojas de estilo internas individuales, es posible indicar a cada página que consulte la hoja externa asegurando así que todas tengan los mismos ajustes. (CASTRO, 2001)

16

IT. CD. VALLES


4.5.4 Herramientas HTML Puede utilizar cualquier editor de textos para escribir HTML, incluyendo SimpleText o Teach Text sobre Macintosh, WordPad para Windows o para sistemas Unix.

Dreamweaver (M, W)

300$. Macromedia. Probablemente el más popular editor entre los profesionales de la Web.

http://www.macromedia.com/ Software/Dreamweaver; demo disponible.

Adobe GoLive (M, W)

300$. Anteriormente GoLive CyberEstudio. El principal competidor de Dreamweaver.

http://www.adobe.com/prodindex /GoLive/main.html; demo disponible.

NetObjects Fusion (M, W)

300$. Net Objects editor http://www.netobjects.com/products WYSIWYG para /html/nof.html; demo disponible. webmasters profesionales. Ilustración 2. Cuadro comparativo de herramientas.

4.6 Dreamweaver Macromedia Dreamweaver: Este editor, programa para crear páginas Web, es tipo WYSIWYG creado por Macromedia (actualmente de Adobe Systems). Es la aplicación de este tipo más usada en el sector de diseño y programación Web. Posee, como toda la línea Macromedia/Adobe, excelentes funcionalidades e integración con otras herramientas. Su éxito data desde 1990 y en la actualidad capta el 90% del mercado de editores HTML. Ventajas:  Permite muchas cosas.  es muy flexible, sobre todo para el diseño. 17

IT. CD. VALLES


 Tiene muchas opciones como botones flash, botones normales y formularios.  Todas las herramientas se encuentras rápidamente. Desventajas:  Las nuevas versiones no facilitan nada respecto a las anteriores.  Se necesita dar de alta resolución para manejar todas las barras.  Falta implementación de DHTML.  Su precio es considerable y carga muy lentamente. (SORIA, 1997)

4.7 PHP El lenguaje PHP es un lenguaje de programación de estilo clásico, con esto quiero decir que es un lenguaje de programación con variables, sentencias condicionales, bucles, funciones, etc. PHP se ejecuta en el servidor, por eso nos permite acceder a los recursos que tenga el servidor como por ejemplo podría ser una base de datos. El programa PHP es ejecutado en el servidor y el resultado enviado al navegador. El resultado es normalmente una Portal HTML pero igualmente podría ser una página WML.

Ilustración 3. Modelo PHP.

18

IT. CD. VALLES


Al ser PHP un lenguaje que se ejecuta en el servidor no es necesario que su navegador lo soporte, es independiente del navegador, pero sin embargo para que sus páginas PHP funcionen, el servidor donde están alojadas debe soportar PHP. La ventaja que tiene PHP sobre otros lenguajes de programación que se ejecutan en el servidor (como podrían ser los script CGI Perl), es que nos permite intercalar las sentencias PHP en las paginas HTML. (ULLMAN, 2003)

4.8 MySQL MySQL es un gestor de base de datos sencillo de usar y increíblemente rápido. También es uno de los motores de base de datos más usados en Internet, la principal razón de esto es que es gratis para aplicaciones no comerciales. Las características principales de MySQL son:  Es un gestor de base de datos. Una base de datos es un conjunto de datos y un gestor de base de datos es una aplicación capaz de manejar este conjunto de datos de manera eficiente y cómoda.  Es una base de datos relacional. Una base de datos relacional es un conjunto de datos que están almacenados en tablas entre las cuales se establecen unas relaciones para manejar los datos de una forma eficiente y segura. Para usar y gestionar una base de datos relacional se usa el lenguaje estándar de programación SQL.  Es Open Source. El código fuente de MySQL se puede descargar y está accesible a cualquiera, por otra parte, usa la licencia GPL para aplicaciones no comerciales.

19

IT. CD. VALLES


 Es una base de datos muy rápida, segura y fácil de usar. Gracias a la colaboración de muchos usuarios, la base de datos se ha ido mejorando optimizándose en velocidad. Por eso es una de las bases de datos más usadas en Internet. MySQL (algunas veces referido como "monitor MySQL") es un programa interactivo que permite conectarnos a un servidor MySQL, ejecutar algunas consultas, y ver los resultados. MySQL puede ser usado también en modo batch: es decir, se pueden colocar toda una serie de consultas en un archivo, y posteriormente decirle a MySQL que ejecute dichas consultas. (ULLMAN, 2003)

4.9 Como publicar la página en la Web Como conseguir un host para su web. A no ser que tenga su propio servidor, seguramente tendrá que pagar a alguien para que actúe como host de su sitio. Al considerar un host, hay un cierto número de cosas a tener en cuenta.  ¿Cuánto espacio en disco necesitará para su sitio web?  ¿Ofrecen soporte técnico? Si es así ¿por teléfono o por email? ¿Cuánto tiempo tardarán en responder?  ¿Registrarán para usted un nombre de dominio? ¿Cuánto le costará esto?  ¿Es rápida la conexión a internet? Esto determinará la rapidez con que sus páginas se ofrecerán a sus visitantes. ¿Cuentan con conexiones múltiples para el caso en que una de ellas no funcione?  ¿Incluyen acceso por marcación telefónica a Internet? ¿Lo incluirán si lo necesita usted?

20

IT. CD. VALLES


 ¿Le dejarán poner en marcha guiones CGI personalizados, Server Side Includes, extensiones FrontPage, RealAudio y otras funciones avanzadas? ¿Hay por ello una tarifa extra?  ¿Ofrecen un servicio de estadística web para permitirle saber cuánta gente ha

visitado su sitio? (CASTRO, 2001)

4.9.1 Como conseguir un dominio Si no quiere que el nombre de su host web aparezca en el URL de su página web, puede registrar su propio nombre de dominio (por una tarifa) y luego pedirle a su compañía de host web que cree un dominio virtual en su servidor con su nombre de dominio. Suponga, por ejemplo, que sus Portales están en el servidor ServidorWeb y que tiene registrado el dominio mi sitio: la dirección para acceder a sus páginas, a pesar de estar almacenadas realmente en ServidorWeb, será www.misitio.com, lo que da a entender que las páginas están en un servidor de su propiedad. Para conseguir su propio nombre de dominio:  Dirija su navegador a www.nic.es y verifique si el dominio que quiere está disponible.  Cuando haya encontrado un nombre de dominio, pídale a su servicio de

Hosting en la Web que lo establezca para usted. Podría pedirle una tarifa estándar (unas 25.000 pesetas por un dominio .es). Los demás dominios son más baratos y rondan las 6.000 pesetas. (CASTRO, 2001)

21

IT. CD. VALLES


4.10 Ingeniería web 4.10.1 Estratos de la ingeniería web de WebApp El desarrollo de sistemas y aplicaciones basados en Web Incorpora modelos de proceso especializados, métodos de la ingeniería del software adaptados a las características del desarrollo de WebApps y un conjunto de importantes tecnologías habilitadoras. (PRESSMAN, 2005)

Proceso. Los modelos de procesos IWeb adoptan las filosofías de desarrollo ágil. El desarrollo ágil enfatiza un enfoque de desarrollo riguroso que incorpora rápidos ciclos de desarrollo. Aún cuándo rápidos ciclos de tiempo dominan la reflexión acerca del desarrollo, es importante reconocer que el problema todavía debe analizarse, debe desarrollarse un diseño, la implementación debe proceder en una forma incremental y se debe iniciar un enfoque organizado de prueba. (PRESSMAN, 2005)

Métodos. El panorama de los métodos de IWeb abarca un conjunto de labores técnicas que permiten al ingeniero web comprender, caracterizar y luego construir una WebApp de alta calidad.  Métodos de comunicación: Definen el enfoque con que se facilita la comunicación entre ingenieros web y los demás participantes de la WebApp. Las técnicas de comunicación son particularmente importantes durante la recolección de requisitos y siempre que sea evaluado un incremento en la WebApp. 22

IT. CD. VALLES


 Métodos de análisis de Requisitos: Proporcionan una base para comprender el contenido que entregará una WebApp, la función que proporcionará al usuario final y los modos de interacción de cada clase de usuario requerirá mientras ocurra la navegación por medio de la WebApp.  Métodos de diseño: Abarcan una serie de técnicas de diseño que abordan el contenido, la aplicación y la arquitectura de información así como el diseño de interfaz y la estructura de navegación de la WebApp.  Métodos de prueba: Incorpora revisiones técnicas formales tanto del

contenido y el modelo de diseño como de una amplia variedad de técnicas de prueba que abordan conflictos a nivel de componente y arquitectónicos, pruebas de navegación, pruebas de facilidad de uso, pruebas de seguridad y pruebas de configuración. (PRESSMAN, 2005) Herramientas y tecnología. A lo largo de la década pasada a evolucionado un amplio conjunto de herramientas y tecnologías conforme las WebApp se han vuelto más complejas y extendidas. Dichas tecnologías abarcan un amplio conjunto de descripción de contenido y lenguajes de modelación (por ejemplo, HTML, VRML, XML), lenguajes de programación, recursos de desarrollo basados en componentes, navegadores, herramientas multimedia, herramientas de autoría de sitios, herramientas de conectividad de bases de datos, herramientas de seguridad, servidores y utilidades de servidor, y herramientas de administración y análisis de sitio. (PRESSMAN, 2005)

23

IT. CD. VALLES


4.11 El proceso de la ingeniería Web Los atributos de los sistemas y aplicaciones basados en web tienen una profunda influencia sobre el proceso de ingeniería web que se elija. Sin la inmediatez y la evolución continua son atributos principales de una WebApp, un equipo de ingeniería web debe elegir un modelo de proceso ágil que produzca liberaciones de WebApp a un ritmo vertiginoso. La intensa naturaleza de las aplicaciones de la red en este dominio sugiere una diversa población de usuarios y una arquitectura de aplicación que puede ser altamente especializada. (PRESSMAN, 2005)

4.11.1 Definición del marco de trabajo La efectividad de cualquier proceso de ingeniería

depende de su

adaptabilidad. Esto es, la organización del equipo de proyecto, los modos de comunicación entre miembros del equipo, las actividades de ingeniería y las tareas que deben realizarse, la información que se recolecte y cree, y los métodos empleados para producir el producto de alta calidad debe estar adaptados a la gente que realiza el trabajo, el plazo y las restricciones del proyecto, y al problema que se quiera resolver. Comunicación con el cliente. Dentro del proceso IWeb, la comunicación con el cliente se caracteriza por medio de dos grandes tareas: el análisis del negocio y la formulación. El análisis del negocio define el contexto empresarial- administrativo para la WebApp. La formulación es una actividad de recopilación de requisitos que involucra todos los participantes. El intento es describir el problema que la WebApp habrá de resolver con el aprovechamiento de la mejor información disponible.

24

IT. CD. VALLES


Planeación. Se crea el plan del proyecto con el incremento de la WebApp. El plan consiste de una definición de tareas y un calendario de clases respecto al periodo proyectado para el desarrollo del incremento de la WebApp. Modelado. Las labores convencionales de análisis y diseño de ingeniería del software se adaptan al desarrollo de la WebApp., se mezclan y luego se funden en la actividad de modelado IWeb. Construcción. Las herramientas y la tecnología IWeb se aplican para construir la WebApp que se ha modelado. Despliegue. La WebApp se configura para su ambiente operativo, se entrega a los usuarios finales y luego comienza un periodo de evaluación. La retroalimentación acerca de la evaluación se presenta al equipo IWeb y

el

incremento se modifica conforme se requiera. (PRESSMAN, 2005)

4.12 Formulación y planeación para IWeb A pesar de las declaraciones radicales de que la web representa un nuevo paradigma definido por reglas nuevas, los desarrolladores profesionales se están dando cuenta de que las lecciones acerca del desarrollo de software, aprendidas en los días previos al internet todavía se aplican. Las páginas Web son interfaces de usuario, la programación HTML, es programación, y las aplicaciones desplegables en el navegador son sistemas de software que pueden beneficiarse de los principios básicos de la ingeniería Web. Entre los principios fundamentales de la ingeniería de software destaca el de: comprender el problema antes de comenzar a resolverlo, y estar seguro de que la solución concebida es aquella que la gente realmente quiere. Esta es la base de la formulación, la primera gran actividad en la ingeniería Web. (PRESSMAN, 2005)

25

IT. CD. VALLES


4.12.1 Formulación de sistemas en Web La formulación de sistemas y aplicaciones basados en web representa una secuencia de acciones de ingeniería web que comienza con la identificación de las necesidades del negocio, se mueve hacia la descripción de los objetivos de la WebApp, define grandes características y funciones y realizan la recopilación de requisitos que conduce al desarrollo de un modelo de análisis. La formulación permite que los clientes y el equipo de ingeniería web establezcan un conjunto común de metas y objetivos para la construcción de la WebApp. La formulación se enfoca sobre el “gran cuadro”: en las necesidades y objetivos del negocio y en la información relacionada. (PRESSMAN, 2005) a. Recopilación de requisitos. Los métodos para la recopilación de requisitos, los objetivos globales de la recopilación de requisitos propuestos para la ingeniería de software permanecen inalterados.  Identificar requisitos de contenido.  Identificar requisitos funcionales.  Definir

escenarios de interacción para diferentes clases de usuarios.

(PRESSMAN, 2005)

b. Análisis de la información recopilada. El objetivo es desarrollar listas de objetos de contenido, operaciones que se aplican a los objetos de contenido dentro de una transacción de usuario específica, funciones que la WebApp proporciona a los usuarios finales, y otros requisitos no funcionales que se advierten durante las actividades de comunicación. (PRESSMAN, 2005)

26

IT. CD. VALLES


c. Desarrollo de casos de uso. Los casos de uso describen como interactuará con la WebApp una categoría de usuario específica (llamada actor) para lograr una acción específica. La acción puede ser tan simple como adquirir contenido definido, o tan compleja como el usuario realice un análisis detallado de registros seleccionado que se mantiene en una base de daros en línea. Los casos de uso 1) ayudan al desarrollador a entender como perciben los usuarios su interacción con la WebApp; 2) proporcionan el detalle necesario para crear un modelo de análisis efectivo; 3) ayudan a dividir en compartimientos el trabajo de IWeb; y 4) ofrecen una guía importante para quienes deben probar la WebApp. (PRESSMAN, 2005) d. Medición para web y WebApps. Los ingenieros web desarrollan sistemas complejos y, al igual que otros tecnólogos que realizan esta tarea, deben usar mediciones para mejorar el proceso de ingeniería web y el producto. La medición de ingeniería Web, si se caracteriza de manera adecuada, podría lograr todos estos beneficios y también mejorar la facilidad de uso, el desempeño de la WebApp y la satisfacción del usuario. En el contexto de ingeniería Web, las mediciones tienen tres metas principales: 1. Proporcionar un indicador de la calidad de la WebApp desde el punto de vista tecnológico. 2. Proporcionar una base para la estimación del esfuerzo. 3. Proporcionar una indicación del éxito de la WebApp desde el punto de vista empresarial. (PRESSMAN, 2005) 27

IT. CD. VALLES


4.12.2 Modelado de análisis para aplicaciones web Los sitios Web, por lo general, son complejos y enormemente dinámicos. Requieren fases de desarrollo cortas con la finalidad de tener listo el producto y ejecutarlo rápidamente. Con frecuencia, los desarrolladores van directo hacia la fase de codificación sin comprender que están tratando de construir o como quieren construirlo. La codificación respecto del servidor con frecuencia se hace ad hoc, las tablas de bases de datos se agregan conforme se necesitan y la arquitectura evoluciona en una forma a veces no intencional. (PRESSMAN, 2005)

4.12.2.1 Requisitos para el análisis de las WebApps El análisis de requisitos para las WebApps abarca tres grandes tareas: Formulación, recopilación de requisitos, y modelado de análisis. Durante la formulación se identifica la motivación (metas) y los objetivos básicos para la WebApp, y también se define las categorías de usuario. Los requisitos de contenido y funcionales se enlistan y se desarrollan los escenarios de interacción (casos de uso) descritos desde el punto de vista del usuario final. La jerarquía de usuario. Las categorías de usuario finales que interactuarán con la WebApp se identifican como parte de las tareas de formulación y de recopilación de requisitos. En la mayoría de los casos las categorías de usuario son relativamente limitadas y no necesitan de representación UML. Desarrollo de casos de uso. Los casos de uso se desarrollan par cada categoría de usuario descrita en la jerarquía de usuario. En el contexto de ingeniería Web, el caso de uso en sí mismo es relativamente informal: un párrafo narrativo que describe una interacción específica entre un usuario y la WebApp. (PRESSMAN, 2005)

28

IT. CD. VALLES


4.12.2.2 El modelado de análisis para WebApps El modelado de análisis para una WebApp se basa en la información que contienen los casos de uso desarrollados para la aplicación. Las descripciones de los casos de uso se analizan gramaticalmente para identificar potenciales clases de análisis y las operaciones y atributos asociados con cada clase. Se identifica el contenido que presentará la WebApp y se extraen las funciones que se desarrollarán a partir de las descripciones de caso de uso.  Análisis de contenido: Identifica todo el espectro del contenido que ofrecerá la WebApp. El contenido incluye texto, gráficas e imágenes, así como datos de video y audio.  Análisis de interacción: describe como interactúa el usuario con la WebApp.  Análisis de funciones: Define las operaciones que se aplicarán al contenido de la WebApp y describe otras funciones de procesamiento, independientes del contenido pero necesarias para el usuario final.  Análisis de configuración: Describe el ambiente y la infraestructura en la que reside la WebApp. El modelo en sí mismo contiene elementos estructurales y dinámicos. Los elementos estructurales identifican las clases de análisis y los objetos de contenido que se requieren para crear una WebApp que satisfagan las necesidades de los clientes. (PRESSMAN, 2005)

29

IT. CD. VALLES


4.12.2.3 Modelo de contenido Contiene elementos estructurales que proporcionan una importante visión de los requisitos de contenido para una WebApp. Dichos elementos estructurales incluyen objetos de contenido (por ejemplo: texto, imágenes, graficas, fotografías, imágenes de video, audio) que se presentan como parte de la WebApp. Además, este modelo incluye todas las clases de análisis: entidades visibles para el usuario que se crea o manipulan conforme éste interactúa con la WebApp. Definición de objetos de contenido. Las aplicaciones Web presentan información preexistente -llamada a contenido recursiva- a un usuario final. El tipo y forma de contenido abarca un amplio espectro de elaboración y complejidad. El contenido puede desarrollarse antes de la implementación de la WebApp, mientras que esta se construye mucho después de que la WebApp se encuentra en operación. Un objeto de contenido puede ser una descripción textual de un producto, un artículo que describe un evento noticioso, una fotografía de acción tomada en un cotejo deportivo, etc. Los objetos de contenido se extraen de los casos de uso al examinar la descripción del escenario para referencias directas e indirectas al contenido. (PRESSMAN, 2005)

4.12.2.4 El modelo de interacción Lo componen cuatro elementos: 1) casos de uso, 2) diagramas de secuencia, 3) diagramas de estado, y 4) prototipo de interfaz de usuario. Casos de uso. Los casos de uso son el elemento dominante del modelo de interacción para las WebApps.

30

IT. CD. VALLES


Diagrama de secuencia. Los diagramas de secuencia ofrecen una representación abreviada de la forma en la cual las acciones del usuario (los elementos dinámicos de un sistema que definen los casos de uso) colaboran con las clases de análisis (los elementos estructurales de un sistema que definen los diagramas de clase). Diagramas de estado. El diagrama de estado UML ofrece otra representación del comportamiento dinámico que la WebApp conforme sucede una interacción. Prototipo de la interfaz de usuario. La plantilla de la interfaz de usuario, el contenido que presenta, los mecanismos de interacción que implementa y la estética global de las conexiones usuario-WebApp, tienen mucho que ver con la satisfacción del usuario y aceptación global de la WebApp. (PRESSMAN, 2005)

4.12.2.5 Modelo funcional Aborda dos elementos de procesamiento de la WebApp y cada uno representa un grado diferente de la abstracción de procedimiento: 1. Funcionalidad observable respecto al usuario y que entrega al usuario final la WebApp, comprende cualesquiera funciones d procesamiento que el usuario

inicia

directamente.

Dichas

funciones en

realidad

puede

implementarse mediante operaciones dentro de las clases de análisis pero desde el punto de vista del usuario final, la función es el resultado visible. 2. Las operaciones dentro de las clases de análisis que implementan comportamientos asociados con la clase, dichas operaciones manipulan atributos de la clase y están involucradas como clases que colaboran entre sí para lograr algún comportamiento requerido. (PRESSMAN, 2005)

31

IT. CD. VALLES


4.12.2.6 El modelo de configuración Las WebApp se deben diseñar e implementar de forma que se acomoden a una diversidad de ambiente, tanto en lado del servidor como en clientes. La WebApp puede recibir en un servidor que proporcione acceso vía Internet, una intranet o una extranet. Se deben especificar el hardware del servidor y el ambiente del Sistema Operativo. Además, se deben considerar aspectos de interoperabilidad en el lado del servidor. Si la WebApp debe tener acceso a una gran base de datos o interoperar con las aplicaciones corporativas existentes en el lado del servidor, se deben especificar las interfaces apropiadas los protocolos de comunicación y la

información

complementaria necesaria. El software del lado del cliente proporciona la infraestructura que permite el acceso a la WebApp desde la ubicación del usuario. (PRESSMAN, 2005)

4.12.2.7 Análisis relación-navegación “La navegación” no solo es la acción de saltar de página a página, sino la idea de moverse a través de un espacio de información. El análisis relación-navegación (ARN) proporciona una serie de pasos de análisis que luchan por identificar relaciones entre los elementos descubiertos como parte de la creación del modelo de análisis: El ARN proporciona a los analistas de sistemas una técnica sistemática para determinar la estructura de relación de una aplicación, lo que les ayuda a descubrir las relaciones potencialmente útiles en los dominios de la aplicación y que se pueden implementar como vínculos más adelante. El enfoque ARN se organiza en 5 pasos:

32

IT. CD. VALLES


 Análisis de los participantes: identifica las diversas categorías de usuario y establece una apropiada jerarquía de participantes.  Análisis de elementos: identifica los objetos de contenido y los elementos funcionales de interés para los usuarios finales.  Análisis de relaciones: describe las relaciones entre los elementos WebApp.  Análisis de navegación: examina como los usuarios pueden acceder a elementos individuales o grupos de elementos.  Análisis de evaluación: considera temas pragmáticos (costo/beneficio)

asociados con la implementación de la relación definidas con anterioridad. (PRESSMAN, 2005)

4.12.3 Modelado de diseño para aplicaciones web Durante la primera década del desarrollo web, la idea artística fue el enfoque que eligieron muchos desarrolladores. El diseño ocurrió en una forma ad hoc y usualmente está dirigido conforme se generaron el HTML. El diseño evolucionó de una visión artística que en sí misma evolucionó conforme ocurrió la construcción de la WebApp. (PRESSMAN, 2005) Diseño y calidad de una WebApp. a. Diseño es la actividad de ingeniería que conduce un producto de gran calidad. La percepción del usuario de lo que esa “bueno” (y la resultante aceptación o rechazo de la WebApp como consecuencia) puede ser más importante que cualquier discusión técnica de la calidad de la WebApp. Las características generales de la calidad de software más relevantes son: facilidad de uso, funcionalidad, confiabilidad, eficiencia y facilidad de mantenimiento, que conduce a WebApps de gran calidad. (PRESSMAN, 2005) 33

IT. CD. VALLES

RESIDENCIA PROFESIONAL Comprensibilidad global del sitio

Fácil de uso

Caracterización de la interfaz y estética Características especiales Capacidades de búsqueda y recuperación Características de navegación y visualización

Funcionalidad

Calidad de la aplicación Web

Características de la aplicación real.

Correcto procesamiento de vínculos

Confiabilidad

Recuperación de errores Validación y recuperación de entrada de usuario

Desempeño en tiempo de respuesta

Eficiencia

Rapidez de generación de Portal Rapidez de generación de gráficos

Fácil de corregir

Facilidad

de

mantenimiento

Adaptabilidad Extensibilidad

Ilustración 4 Árbol de requisitos de calidad

b. Seguridad. La medida clava de la seguridad es la habilidad de la WebApp y su ambiente de servidor de rechazar el acceso no autorizado e impedir un franco ataque malévolo. c. Disponibilidad. Es la medida del porcentaje del tiempo que una WebApp está disponible para usarla. d. Escalabilidad. Es la facilidad con que la WebApp y su ambiente de servidor pueden escalar para manejar 100, 1000, 10000 o 100000 usuarios. 34

IT. CD. VALLES


e. Tiempo en el mercado. La primera WebApp en el mercado usualmente captura un número desproporcionado de usuarios finales. (PRESSMAN, 2005) Metas de diseño. a. Simplicidad.

Existe

una

tendencia

entre

algunos

diseñadores

a

proporcionar al usuario final “demasiado”: exhaustivo, efectos visuales extremos, animación entrometida, enormes páginas web, es mejor luchar por la moderación y la simplicidad. b. Consistencia. Se aplica virtualmente a cada elemento del modelo de diseño, el contenido se debe construir de manera consistente. El diseño gráfico (estética) debe presentar una apariencia consistente en todas las partes de la WebApp. El diseño arquitectónico debe establecer plantillas que conduzcan a una estructura Hipermedia consistente. El diseño de interfaz debe definir modos consistentes de interacción, navegación y despliegue de contenido. c. Identidad. La estética, la interfaz y el diseño de navegación de una WebApp deben ser consistentes con el dominio de la aplicación para la cual se va a construir. La arquitectura de WebApp será completamente diferente, las interfaces se construirán para acomodar diferentes categorías de usuario, la navegación estará organizada para lograr diferentes objetivos. d. Robustez. Con base en la identidad establecida, usualmente una WebApp hace una “promesa” implícita al usuario. El usuario espera contenido y funciones robustas que sean relevantes para sus necesidades.

35

IT. CD. VALLES


e. Navegabilidad. Ya se ha señalado que la navegación debe ser simple y consistente. También debe estar diseñada de modo que sea intuitiva y predecible; esto es, el usuario debe entender cómo moverse por la web sin tener que buscar vínculos o instrucciones de navegación. f. Apariencia visual. De todas las categorías de software, las aplicaciones web son incuestionables las más visuales, las más dinámicas y sin duda las más estéticas. g. Compatibilidad. Una WebApp se utilizará en una diversidad de ambientes

(por ejemplo, diferentes equipos, tipos de conexión a internet, sistemas operativos, navegadores) y se debe diseñar para que sea compatible con cada uno. (PRESSMAN, 2005)

4.13 Pirámide de diseño IWeb El diseño conduce a un modelo que contiene la mezcla adecuada de estética, contenido y tecnología. La mezcla variará dependiendo de la naturaleza de la WebApp, y, como consecuencia, las actividades de diseño también variarán.

Diseño de la Interfaz Diseño estético

Diseño de contenido Diseño de navegación

Diseño arquitectónico Diseño de componentes

Ilustración 5 Pirámide de diseño para la Ingeniería Web.

36

IT. CD. VALLES


4.14 Diseño de la interfaz de la WebApp Toda interfaz de usuario debe presentar las siguientes características: fácil de usar, fácil de aprender, fácil de navegar, intuitiva, consistente, eficiente, libre de errores y funcional. Debe ofrecer al usuario final una experiencia satisfactoria y gratificante. Los conceptos, principios y métodos de diseño de la interfaz brindan al ingeniero web las herramientas requeridas para lograr esta lista de atributos. (PRESSMAN, 2005)

4.14.1 Principios y directrices del diseño de interfaz Bruce Tognozzi [TOG01] define un conjunto de características fundamentales que deben presentar todas las interfaces y, al hacerlo, establece una filosofía que debe seguir todo diseñador de interfaz de WebApp: Las interfaces efectivas son visualmente aparentes e indulgentes, e implantan en sus usuarios una sensación de control. Las interfaces efectivas no preocupan al usuario con los trabajos internos de la computadora. El trabajo se guarda de manera cuidadosa y continua, con la opción total de que el usuario deshaga cualquier actividad en cualquier tiempo. Las aplicaciones y servicios efectivos realizan un máximo de trabajo mientras demandan un mínimo de información a los usuarios. (PRESSMAN, 2005)

4.14.2 Mecanismos de control de la interfaz Los objetivos de la interfaz de una WebApp son 1) establecer una ventana consistente con el contenido y la funcionalidad que proporciona, 2) guiar al usuario a través de una serie de interacciones con la WebApp, y 3) organizar las opciones de navegación y el contenido disponible para el usuario. Las opciones de navegación las implementa el diseñador seleccionando de entre varios mecanismos de interacción:

37

IT. CD. VALLES


 Menús de navegación: menús clave que mencionen contenido o funcionalidad clave.  Iconos gráficos: botón, interruptores e imágenes gráficas similares que permitan al usuario seleccionar alguna propiedad o especificar una decisión. Imágenes gráficas: alguna representación gráfica que el usuario pueda seleccionar y que implemente un vínculo hacia un objeto de contenido o funcionalidad de la WebApp. (PRESSMAN, 2005)

4.14.3

Flujo de trabajo en el diseño de la interfaz

Una vez que se han identificado las tareas del usuario, se crean y analizan sus escenarios (casos de uso) para definir un conjunto de objetos y acciones de interfaz. Las siguientes tareas representan un flujo de trabajo rudimentario para el diseño de la interfaz WebApp. 1. Revisar la información contenida en el modelo de análisis y refinarla conforme se requiera. 2. Desarrollar un bosquejo aproximado de la plantilla de la interfaz WebApp. 3. Correlacionar los objetivos el usuario con acciones específicas de la interfaz. 4. Definir un conjunto de tareas de usuario que estén asociadas con cada acción. 5. Elaborar bosquejos con imágenes de la pantalla para cada acción de la interfaz. 6. Refinar la plantilla de la interfaz y los bosquejos con el uso de entradas desde el diseño estético. 38

IT. CD. VALLES


7. Identificar los objetivos de la interfaz de usuario que se requiera para implementarlo. 8. Desarrollar una representación de procedimiento de la interacción del usuario con la interfaz. 9. Desarrollar una representación del comportamiento de la interfaz. 10. Describir la plantilla de la interfaz para cada estado. 11. Refinar y revisar el modelo de diseño de la interfaz. (PRESSMAN, 2005)

4.15 Diseño estético Es llamado también diseño grafico, es un esfuerzo artístico que complementa los aspectos técnicos de la ingeniería web. El diseño grafico considera cada aspecto de la presentación y percepción de una WebApp. El proceso de diseño grafico comienza con la plantilla y procede hacia la consideración de esquemas de color globales, tipos de fuentes, tamaños y estilos, el uso de medios audiovisuales complementarios y todos los demás elementos estéticos de una aplicación. (PRESSMAN, 2005)

4.16 Diseño del contenido Desarrolla una representación de diseño para los objetos de contenido y representa los mecanismos que se requieren para que establezcan sus relaciones uno con otro. Además, el diseño de contenido se ocupa de la representación de la información dentro de un objeto de contenido específico. Una vez modelados todos los objetos de contenido, la información que cada objeto entregará debe crearse y luego formatearse para satisfacer mejor las necesidades del cliente. (PRESSMAN, 2005)

39

IT. CD. VALLES


4.17 Diseño arquitectónico Está enlazado con las metas establecidas para la WebApp, el contenido que se presentará, los usuarios que la visitarán y la filosofía de navegación que se establezca. El diseño de la arquitectura de contenido se centra en la definición de la estructura hipermedia global de la WebApp. El diseño se puede elegir de cuatro diferentes estructuras de contenido.  Estructuras lineales.  Estructuras en retícula.  Estructuras jerárquicas.  Estructuras en red o “Web pura”. La arquitectura de WebApp describe una infraestructura que permite a un sistema o aplicaciones basadas en web lograr sus objetivos de negocios. (PRESSMAN, 2005)

4.18 Diseño de navegación Una vez establecida la arquitectura de WebApp y la identificación de los componentes, el diseñador debe definir las rutas de navegación que habiliten para los usuarios el acceso al contenido y las funciones de la WebApp. Para lograr esto el diseñador debe 1) identificar la semántica de navegación para diferentes usuarios del sitio y 2) definir la mecánica que logra la navegación.

40

IT. CD. VALLES


El diseño de navegación comienza con una consideración de la jerarquía de usuario y los casos de uso desarrollados para cada categoría de usuario (actor). Cada actor puede usar la WebApp de manera un poco diferente y, por tanto tener diferentes requisitos de navegación. Conforme el diseño se lleva acabo se define la mecánica de navegación. Entre muchas posibles soluciones están:  Vinculo de navegación individual.  Barra de navegación horizontal.  Columna de navegación vertical.  Pestañas.  Mapas de sitio. (PRESSMAN, 2005)

4.19 Diseño a nivel de componentes Patrones de diseño hipermedia. Los patrones de diseño aplicados en la Ingeniería Web abarcan dos grandes clases: 1) patrones de diseño genérico que son aplicables a todos los tipos de software 2) patrones de diseño hipermedia que son específicos de la WebApp. En el contexto de los sistemas basados en Web German y Cowan sugieren las siguientes categorías de patrones:  Patrones arquitectónicos.  Patrones de construcción y componentes.

41

IT. CD. VALLES


 Patrones de navegación.  Patrones de presentación.  Patrones de interacción comportamiento/usuario. (PRESSMAN, 2005)

4.20 Prueba de conceptos para WebApp Dimensiones de calidad. La calidad se incorpora en una aplicación Web como consecuencia de un buen diseño. Se evalúa al aplicar una serie de revisiones técnicas que valoran varios elementos del modelo de diseño y al aplicar un proceso de prueba. Dimensiones de calidad:  El contenido se evalúa tanto en el ámbito sintáctico (ortografía, puntuación y gramática se valoran para los documentos basados en texto) como semántico (se valoran la exactitud de la información presentada, la consistencia y la falta de ambigüedad).  La función se prueba para descubrir errores que indiquen que no hay concordancia con los requisitos del cliente.  La estructura se valora para asegurarse de que entrega adecuadamente contenido y función de la WebApp.  La navegabilidad se pone a prueba para garantizar que toda la sintaxis y semántica de navegación se ejercen para descubrir cualquier error de navegación.  La compatibilidad se prueba al ejecutar la WebApp en varias configuraciones huésped.

42

IT. CD. VALLES


 La seguridad se prueba al valorar las vulnerabilidades potenciales e intentar explotar cada una de ellas. Los procesos de prueba para ingeniería Web comienzan con pruebas que ejercitan el contenido y la funcionalidad de la interfaz que es inmediatamente visible para los usuarios finales. Conforme se realizan las pruebas, se ejercitan los aspectos de la arquitectura de diseño y de navegación. (PRESSMAN, 2005)

Prueba de contenido

U

Prueba de la interfaz

suari o Diseño de la interfaz

Prueba de navegación

Diseño estético Diseño de contenido Diseño de navegación

Prueba de componentes

Diseño arquitectónico Prueba de configuración

Diseño de componentes

Tecnología

Prueba de desempeño

Prueba de seguridad

Ilustración 6. El proceso de prueba.

.

43

IT. CD. VALLES


4.21 Prueba del contenido Combina tanto revisiones como la generación de casos de prueba ejecutables. La revisión se aplica para descubrir errores semánticos en cualquier objeto de contenido presentado conforme ocurra la navegación y hallar errores en la organización o estructura del contenido que se presenta al usuario final. La prueba de contenido tiene tres objetivos importantes: 1) descubrir errores sintácticos en los documentos basados en texto, representaciones gráficas y otros medios audiovisuales, 2) descubrir errores semánticos en cualquier objeto de contenido presentado conforme ocurra la navegación, y 3) hallar errores en la organización o estructura del contenido que se presenta al usuario final. (PRESSMAN, 2005)

4.22 Prueba de la interfaz de usuario La verificación y validación de la interfaz del usuario de una WebApp ocurre en tres puntos distintos

durante el proceso de ingeniería Web. Durante la

formulación y el análisis de requisitos se revisa el modelo de la interfaz para garantizar que se ajusta a los requisitos del cliente y a otros elementos del modelo de análisis. Durante el modelo se revisa el modelo de diseño de la interfaz para garantizar que se han alcanzado los criterios genéricos de calidad establecidos para todas las interfaces de usuario, y que los conflictos en el diseño de la interfaz específicos de la aplicación se han abordado adecuadamente. (PRESSMAN, 2005)

4.23 Prueba al nivel de componentes Son también llamadas pruebas de función, se enfocan sobre un conjunto de pruebas que intentan descubrir errores en las funciones de la WebApp. Los casos de prueba al nivel de componentes con frecuencia se alimentan con entrada al nivel de formularios. Son comunes los siguientes métodos de diseño de casos de prueba.

44

IT. CD. VALLES


 Partición de equivalencia.  Análisis de valores límite.  Pruebas de ruta. (PRESSMAN, 2005)

4.24 Prueba de navegación El trabajo de probar la navegación es 1) garantizar que todos los mecanismos que permiten al usuario de la WebApp viajar a través de ella son funcionales, y 2) validar que cada unidad semántica de navegación (USN) pueda ser alcanzada por la categoría de usuario adecuada.

La primera fase de la prueba de navegación en realidad comienza durante la prueba de la interfaz. Los mecanismos de navegación se prueban para asegurar que cada uno realiza la función que se busca. (PRESSMAN, 2005)

4.25 Prueba de la configuración. La variabilidad y la inestabilidad de la configuración son factores importantes que hacen de la ingeniería Web un desafío. La labor de probar la configuración no es ejercitar toda posible configuración del lado del cliente. Más bien, es probar un conjunto de probables configuraciones de los lados del cliente y del servidor para garantizar que la experiencia del usuario será la misma en todos ellos y para aislar errores que puedan ser específicos de una configuración particular.

45

IT. CD. VALLES


5 ALCANCES Y LIMITACIONES 5.1 Alcances  El Portal permitirá el acceso a la información sobre las boletas de calificaciones a los alumnos por medio de su número de control.  Difundirá a toda la sociedad el catalogo de la bibliografía con la que cuenta la UPN Unidad 242 en su biblioteca.  Publicará la información Académico-Administrativos de la Universidad Pedagógica Nacional Unidad 242.

5.2 Limitaciones  El uso de tecnologías y software con licencia.  El pago del hospedaje por parte de la institución.  La adquisición de un servidor para colgar el Portal.  La continúa capacitación del administrador de la aplicación, para que actualice la base de datos y las publicaciones del Portal.

46

IT. CD. VALLES


6 PROBLEMAS A RESOLVER 1. Con la implementación del Portal se tendrá un control automatizado del proceso Académico Administrativo de la Universidad Pedagógica Nacional Unidad 242 a través de la Internet. 2. La difusión de la información será veraz, oportuna, concisa y significativa para la comunidad estudiantil, y para la sociedad en general. 3. Aglomeramiento en servicios escolares.

47

IT. CD. VALLES


7 DESARROLLO DE ACTIVIDADES Para la realización de las siguientes actividades se tomó como referencia el Lenguaje Unificado de Modelado mejor conocido como UML, que sirvió como base para modelar algunos de los requisitos que se establecieron por el cliente durante la etapa de planteamiento y formulación apoyado al mismo tiempo de la Ingeniería Web (IWeb).

7.1 Planteamiento y Formulación 7.1.1 Entrevista con el cliente Versión 1 En esta actividad se procedió a realizar una entrevista con el Director de la Universidad Pedagógica Nacional Unidad 242, el Mtro. Daniel Cruz Laureano, con el propósito de recabar la información, determinando así los requisitos funcionales y de contenido que forma la estructura del Portal. (VER ANEXO 3). Versión 2 En esta versión se realizaron algunos ajustes de acuerdo a lo establecido por la Jefa Administrativa de la institución, sólo se eliminaron algunos componentes del Portal.

7.1.2 Identificación de necesidades y requerimientos Versión 1 Para la realización de las siguientes actividades se tomó como referencia el Lenguaje Unificado de Modelado mejor conocido como UML, que sirvió como base para modelar algunos de los requisitos que se establecieron por el cliente durante la etapa de planteamiento y formulación apoyado al mismo tiempo de la Ingeniería Web (IWeb). 48

IT. CD. VALLES


Versión 2 En esta fase de las necesidades y requerimientos no se realizaron ajustes, ya que los establecidos en la etapa de planteamiento y formulación no sufrió alteraciones.

7.2 Planteamiento y Formulación 7.2.1 Entrevista con el cliente Versión 1 En esta actividad se procedió a realizar una entrevista con el Director de la Universidad Pedagógica Nacional Unidad 242, el Mtro. Daniel Cruz Laureano, con el propósito de recabar la información, determinando así los requisitos funcionales y de contenido que forma la estructura del Portal. (VER ANEXO 3). Versión 2 En esta versión se realizaron algunos ajustes de acuerdo a lo establecido por la Jefa Administrativa de la institución, sólo se eliminaron algunos componentes del Portal.

7.2.2 Identificación de necesidades y requerimientos Versión 1 Mediante la actividad anterior y otras técnicas de recopilación de requisitos, como la observación, se analizaron las respuestas y se llegó a la conclusión, que la Universidad Pedagógica Nacional Unidad 242 requiere de un Portal para gestionar los procesos académico-administrativos, el informe de calificaciones, estos a su vez se integraron los datos académicos del alumnado de la comunidad universitaria. Estos son algunos de los requerimientos que se establecieron por parte del cliente:

49

IT. CD. VALLES


 El Portal se diseño con los colores que distinguen a la institución: blanco y azul, logrando una mejor estética de éste.  Se manejo el envío de correos electrónicos a los docentes de la institución.  Se incluyó un catálogo bibliográfico de los libros existentes en la UPN Unidad 242.  En toda la estructura del Portal aparecen los logotipos que distinguen a la institución.  Se incluyó una sección para servicios escolares, que permite al usuarioalumno conocer sus calificaciones durante el periodo cursado.  Los alumnos acceden a las calificaciones mediante un password que se les asigno.

Requerimientos por parte de los desarrolladores:  Un servidor.  Software para el diseño y programación del Portal, como lo es la Macromedia de Dreamweaver, el Sistema Operativo Linux, PHP, MySQL, etc.  Un espacio dentro de la Institución para trabajar sobre el proyecto.  Apoyo económico por parte de la Dirección y la Jefatura Administrativa. Versión 2 No se llevó a cabo ningún cambio ya que en la versión 1, se establecieron definitivamente las necesidades y requerimientos.

50

IT. CD. VALLES


7.2.3 Determinar objetivos de la WebApp Versión 1 Con los análisis anteriores se determinó que el objetivo principal es desarrollar un Portal para los procesos académico-administrativos de la Universidad Pedagógica Nacional Unidad 242 de Ciudad Valles, para gestionar el informe de calificaciones, la integración de los datos académicos y la difusión de la información entre la comunidad universitaria. Versión 2 En esta etapa no se replantearon los objetivos del Portal, ya que se determinaron claramente los objetivos y las metas en la versión anterior.

7.2.4 Recopilación de requisitos Versión 1 Esta actividad se realizó con el fin de recopilar los requisitos que impone el cliente: requisitos de contenido, requisitos funcionales, definición de las interacciones que existen entre los diferentes usuarios y la aplicación, mediante las técnicas mencionadas anteriormente y realizando diferentes tipos de modelados para tener una idea clara de lo que se pretende desarrollar. (VER ANEXO 3) Versión 2 No hubo necesidad de modificar los modelados de análisis realizados en la versión anterior.

51

IT. CD. VALLES


7.2.5 Establecer alcances y limitaciones Versión 1 En mutuo acuerdo entre los desarrolladores y la Universidad Pedagógica Nacional se establecieron los alcances y limitaciones para no comprometer a los desarrolladores a realizar trabajos o actividades fuera del lapso programado para el desarrollo del Portal y además para identificar el contenido que formará parte de éste. Versión 2 No se llevaron a cabo cambios en esta actividad por el motivo del tiempo en que se desarrolló el Portal, además de ser esta etapa una de las más importantes durante la formulación de todo proyecto.

7.3 Planificación 7.3.1 Análisis de recursos y factibilidad Versión 1 Se realizó mediante un análisis detallado en el cuál se obtuvieron los siguientes requerimientos divididos en cuatro categorías:  El equipo o maquinaria con el que cuenta la Universidad Pedagógica Nacional Unidad 242 (Factibilidad Técnica).  El recurso humano disponible y capaz para la manipulación del proyecto (Factibilidad Operativa).  Capital actual disponible por parte de la Institución para cubrir los costes que se generaron durante el desarrollo del proyecto (Factibilidad Económica).

52

IT. CD. VALLES


 Autorización de requerimientos de los programas, así como las licencias requeridos para el proyecto que se desarrolló. (Factibilidad Legal).(VER ANEXO 2) Versión 2 La Factibilidad quedó establecida en la versión 1 con costos reales, por lo que no existió modificación.

7.3.2 Análisis de riesgos Versión 1 En este proceso existieron diferentes tipos de riesgos tales como el tiempo destinado para el desarrollo del mismo, perdida de hardware por desastres naturales, etc., éstos amenazaron el plan del proyecto. Por ejemplo, si dicho riesgo se hubiese vuelto real, es muy probable que la calendarización del proyecto pudiera haberse modificado y por ende también los costos. Para realizar este análisis se realizaron una serie de cuestiones y una estimación del riesgo del proyecto. (VER ANEXO 4) Versión 2 No existió ningún conflicto por parte de la dirección de la institución y desarrolladores, por lo que las dos partes involucradas estuvieron colaborando en cada una de las necesidades que surgieron en su momento.

53

IT. CD. VALLES


7.4 Análisis 7.4.1 Análisis Relación-Navegación Versión 1 En esta fase se identificaron las relaciones que existen entre la información que contiene la aplicación con las funciones de procesamiento que el usuario del Portal inicia directamente.

Esto se llevó a cabo con el propósito de establecer los principales requisitos para especificar los vínculos de navegación que le permiten al usuario lograr el propósito de su visita al sitio, de manera que le haga más práctica el cambio de un contenido hacia otro contenido. (VER ANEXO 5) Versión 2 Esta actividad no se modificó respecto a la versión anterior ya que se llevó un análisis detallado para evitar cambios constantemente.

7.4.2 Análisis de Configuración Versión 1 La página de la Universidad Pedagógica Nacional Unidad 242, se desarrolló de manera que pueda acoplarse a los diferentes ambientes; tanto del lado del servidor como de los usuarios de la aplicación. Los navegadores que se usarán para las pruebas de navegación del Portal de la UPN Unidad 242 será: Mozilla FireFox e Internet Explorer por ser éstos unos de los más comunes entre los usuarios. (VER ANEXO 6)

54

IT. CD. VALLES


Versión 2 En la versión 1 de esta actividad se mencionaron los únicos navegadores sobre los cuáles se trabajó para llevar a cabo cada una de las pruebas requeridas por lo que no hubo necesidad de especificar otros.

7.4.3 Análisis Funcional Versión 1 El análisis funcional representa el grado de abstracción respecto al usuario de la WebApp, es decir la función de acuerdo a la jerarquía de usuario; las actividades de cada uno es diferente ya que cada uno realiza diferentes tipos de operaciones. (VER ANEXO 7) Versión 2 Esta fase no requirió de nuevos análisis y por ende ajustes, ya que en las etapas anteriores se especificaron cada uno de los usuarios y operaciones que éstos ejecutarán.

7.4.4 Análisis de Interacción Versión 1 En este análisis se procedió a la realización de jerarquías de usuario y dependiendo de ésta se desarrollaron casos de uso para los usuarios del Portal. Esto permitió tener una visión más amplia acerca de los objetos de contenido con los que el usuario querrá trabajar. (VER ANEXO 8, 9 y 10)

55

IT. CD. VALLES


Versión 2 Se especificaron en la versión 1 cada uno de los usuarios que interactuarán con el Portal y la manera en que trabajarán con éste, por tal motivo no se realizaron ajustes en esta fase.

7.4.5 Análisis de Contenido Versión 1 En esta etapa del análisis se incluyeron los componentes que forman parte de la aplicación; es decir, imágenes, logotipos de la institución, fotografías, graficas, etc., así como también los atributos que los describen. El contenido bien, puede desarrollarse antes de la implementación del Portal, mientras éste se encuentra en construcción o mucho después de que el Portal se encuentre en funcionamiento. (VER ANEXO 11) Versión 2 No se requirió llevar a cabo un re-análisis de contenido, ya que en la fase de análisis se especificaron concretamente los requisitos que contiene el Portal.

7.5 Ingeniería 7.5.1 Diseño de componentes Versión 1 En este proceso se aplicó la ingeniería que es una parte esencial que se llevó a cabo para el desarrollo del Portal. En esta apartado del diseño se establecieron los componentes con los que está estructurado el Portal. (VER ANEXO 12)

56

IT. CD. VALLES


Versión 2 En esta fase del diseño de componentes existieron modificaciones, ya que se omitieron y se agregaron algunos componentes, así como la modificación de títulos en el menú desplegable para dar una mejor presentación.(VER ANEXO 1)

7.5.2 Diseño arquitectónico Versión 1 En esta actividad se realizó el diseño arquitectónico del Portal, ya que se tiene una estrecha relación con el contenido que se presenta a los usuarios, además de la forma de cómo éste navega en el sitio. (VER ANEXO 13) Versión 2 En esta versión del diseño arquitectónico existieron modificaciones; ya que como se menciono anteriormente en el diseño de componentes de las modificaciones que se realizaron en esta, por lo tanto sufre modificaciones en esta fase de diseño. (VER ANEXO 2)

7.5.3 Diseño de navegación Versión 1 Se diseñaron diferentes rutas de navegación de manera que se le haga más fácil al usuario encontrar el contenido que busca, para ello se hizo una reconsideración de las jerarquías de usuario y los casos de uso establecidos para cada actor o usuario, estos diseñados anteriormente en el modelo de análisis de navegación. (VER ANEXO 14)

57

IT. CD. VALLES


Versión 2 En el diseño de navegacional existieron alteraciones en las rutas de navegación; se omitieron y se agregaron rutas de acceso, así como también la modificación de títulos en el menú desplegable. (VER ANEXO 3)

7.5.4 Diseño de contenido Versión 1 En esta fase se diseñaron los objetos de contenido de los que está compuesto el Portal; es decir se realizó la representación de la información dentro de un objeto de contenido específico, así como de la descripción de sus componentes. (VER ANEXO 15) Versión 2 Se rediseñaron algunos objetos de contenido en esta fase del diseño, así como la descripción de los componentes de éstos, con el fin de dar una mejor apariencia del Portal. (VER ANEXO 4)

7.5.5 Diseño de las bases de datos Versión 1 Para la realización de la base de datos se procedió a la elaboración de las tablas, así como los campos que contiene la misma; por otra parte también se estableció la llave primaria con la que el alumno puede acceder a la base de datos. (VER ANEXO 16) Versión 2 Existieron alteraciones en las tablas establecidas en la versión 1, se omitieron e incrementaron unos campos en las tablas; por otra parte también se descartaron algunas relaciones que existían entre una tabla y otra. (VER ANEXO 5) 58

IT. CD. VALLES


7.5.6 Diseño de la interfaz Versión 1 La interfaz fue una parte esencial para la Universidad Pedagógica Nacional Unidad 242, ya que en esta se estableció la estructura del Portal, así como los colores, ubicación de los logotipos, botones, etc. (VER ANEXO 17) Versión 2 No existieron alteraciones en esta fase del diseño, es decir lo establecido en la versión 1, acerca de la ubicaron de los logotipos, colores, etc., no sufrió cambios; ya que las modificaciones solo se realizaron en el menú desplegable.

7.6 Generación de páginas y pruebas Versión 1 Se procedió en esta fase a la generación de cada una de las páginas que el cliente solicitó que se agregaran al Portal, para ello se tomaron en cuenta los requisitos mencionados en la fase de análisis y de diseño de páginas. Posteriormente se realizaron las siguientes pruebas. Versión 2 Se generaron e incrementaron algunas páginas que no se establecieron en las fases de análisis y de diseño.

59

IT. CD. VALLES


7.6.1 Prueba de configuración Versión 1 En ésta actividad se evaluaron cada una de las interfaces que se diseñaron en la etapa de generación de páginas, para ello cada una de éstas se

probaron

mediante dos de los navegadores más usados por los usuarios: Internet Explorer y Mozilla Firefox, con el fin de corregir los errores de presentación de los componentes y contenidos (imágenes, texto, menús de navegación, color, etc.) de cada una de las páginas. (VER ANEXO 19) Versión 2 Como se indico en la versión 1, se evaluaron y probaron en los 2 navegadores mencionados anteriormente, para poder mostrar la diferencia entre un navegador y otro. (VER ANEXO 6)

7.6.2 Prueba de componentes Versión 1 Se centran sobre las funciones del Portal, es decir se llevaron a cabo para descubrir errores sobre éstas, teniendo, estrecha relación con las pruebas de navegación y de contenido.

60

IT. CD. VALLES


Componente Inicio

Navegadores Mozilla Internet Firefox Explorer   

Bienvenida



Convenios

X

X

Directorio

X

X

Documentos descargables

X

X

Unidades UPN





Carrera LIE





Carrera LEP





Carrera LEPEPMI





Admisión LIE





Admisión LEP





Admisión LEPEPMI





Servicios de Comedor





Sala de cómputo





Servicio Social





Servicios Culturales





Servicios Escolares





Publicaciones de Libros

X

X

Publicaciones de Convocatorias

X

X

Publicaciones de Revistas

X

X

Noticias UPN

X

X

Noticias Culturales

X

X

Noticias Varios

X

X

Mapa de sitio





Biblioteca





Correo electrónico





Páginas UPN





Quejas y sugerencias





Ilustración 7 Prueba de componentes

61

IT. CD. VALLES


Versión 2 En esta versión se centran las funciones del Portal, aquí es donde se muestran los resultados que se generaron con las pruebas de navegación y de contenido.

Componente Inicio

Navegadores Mozilla Internet Firefox Explorer  

Bienvenida





Convenios





Directorio





Documentos oficiales





Unidades UPN





Carrera Lic. Intervención Educativa





Carrera Lic. Educación





Carrera Lic. Educación Preescolar





Admisión Requisitos LIE





Admisión Requisitos LEP





Admisión Requisitos LEPEPMI





Servicios Escolares





Sala de Cómputo





Servicio Social










Servicio de Cafetería





Publicación de Libros





Publicación de Revistas





Publicación de Convocatorias





Noticias Locales





Noticias Escolares





Noticias Culturales





Continúa en la siguiente página

62

IT. CD. VALLES


…Continúa Noticias Varios





Mapa de sitio





Biblioteca





Correo electrónico





Páginas UPN










Consulta de Calificaciones





Boleta de Calificaciones





Galería de fotos





Ilustración 8 Prueba de componentes versión 2

7.6.3 Prueba de navegación Versión 1 Se llevó a cabo para verificar que todos las opciones que permiten navegar al usuario final del Portal de la UPN 242 a través de éste, es decir que se encuentre trabajando correctamente. Los mecanismos de navegación se probaron para asegurar que cada uno realice la función que debe hacer.

Navegación Inicio

Navegadores Mozilla Internet Firefox Explorer   

Bienvenida



Convenios

X

X

Directorio

X

X

Documentos descargables

X

X

Unidades UPN





Carrera LIE





Carrera LEP





Carrera LEPEPMI





Continúa en la siguiente página 63

IT. CD. VALLES


…Continúa Admisión LIE





Admisión LEP





Admisión LEPEPMI





Servicios de Comedor





Sala de cómputo





Servicio Social










Servicios Escolares





Publicaciones de Libros

X

X

Publicaciones de Convocatorias

X

X

Publicaciones de Revistas

X

X

Noticias UPN

X

X

Noticias Culturales

X

X

Noticias Varios

X

X

Mapa de sitio





Biblioteca





Correo electrónico





Páginas UPN










Ilustración 9 Prueba de navegación

64

IT. CD. VALLES


Versión 2 En esta versión se verificaron todas las opciones que permiten al usuario navegar en el Portal de la UPN 242.

Navegación Inicio

Navegadores Mozilla Internet Firefox Explorer  

Bienvenida





Convenios





Directorio










Unidades UPN





Carrera Lic. Intervención Educativa





Carrera Lic. Educación





Carrera Lic. Educación Preescolar





Admisión Requisitos LIE





Admisión Requisitos LEP





Admisión Requisitos LEPEPMI





Servicios Escolares





Sala de Cómputo





Servicio Social










Servicio de Cafetería





Publicación de Libros





Publicación de Revistas





Publicación de Convocatorias





Noticias Locales





Noticias Escolares





Noticias Culturales





Noticias Varios





Continúa en la siguiente página

65

IT. CD. VALLES


…Continúa Mapa de sitio





Biblioteca





Correo electrónico





Páginas UPN










Consulta de Calificaciones










Galería de fotos





Ilustración 10 Prueba navegación versión 2

7.6.4 Prueba de contenido Versión 1 En la prueba de contenido se revisaron pruebas ejecutables del Portal para descubrir errores semánticos en los objetos de contenido, estructura y organización presentados, es decir cuándo el usuario esta navegando de una Página a otra. La prueba de contenido tiene tres objetivos importantes: 1) descubrir errores sintácticos en los documentos basados en texto, representaciones gráficas y otros medios audiovisuales 2) descubrir errores semánticos en cualquier objeto de contenido presentado conforme ocurra la navegación, y 3) hallar errores en la organización o estructura del contenido que se presenta al usuario final. (PRESSMAN, 2005) (VER ANEXO 19)

Versión 2 En esta prueba de contenido se revisaron las pruebas ejecutables del Portal, la semántica de los objetos de contenido, estructura y organización presentados, es decir cuándo el usuario esta navegando de una Página a otra. (VER ANEXO 6) 66

IT. CD. VALLES


7.6.5 Prueba de la interfaz Versión 1 Para realización de la prueba de la interfaz ocurrieron distintos puntos generados en el proceso de la Ingeniería Web; es decir la formulación y el análisis de los requisitos de la Universidad Pedagógica Nacional, así como la aplicación de la Métrica Orientada a la Función; estos se revisaron en el modelo de la interfaz, con el propósito de garantizar los requerimientos y/o necesidades especificados por la Institución. Además, se revisaron los modelos de diseño para que la UPN242 especificara los criterios establecidos y alcanzados para todas las interfaces que se usan en el Portal. (VER ANEXO 17 y 18) Versión 2 En la fase de prueba de interfaz, se replanteo la Métrica Orientada a la Función; con el propósito de obtener resultados óptimos y concretos en cuanto a las pruebas y así garantizar un mejor resultado del Portal. (VER ANEXO 6 y 7)

7.7 Evaluación del cliente 7.7.1 Validación del avance Versión 1 En esta fase la Universidad Pedagógica Nacional Unidad 242 realizó una inspección del Portal para evaluar aspectos tales como la estructura, organización y contenido de las Páginas que se requirieron para el desarrollo del Portal. Versión 2 Se presento a la Universidad Pedagógica Nacional Unidad 242 la presentación del Portal.

67

IT. CD. VALLES


7.8 Implementación 7.8.1 Configuración del servidor Versión 1 Esta actividad se pospuso debido a que la Universidad Pedagógica Nacional acaba de realizar la compra del servidor y aún no se hace la entrega del equipo, por lo tanto la configuración se concluirá en la segunda versión de dicha actividad. Versión 2 Se procedió a la configuración del servidor de marca HP ProLiant ML 110 (G5), se le instaló un Sistema Operativo Linux-Ubuntu y la siguiente paquetería: 

PHP 5



Apache 2



Postgresql 8.3

Se eligió Linux para el servidor por los siguientes motivos y se procedió a la comparación frente al Sistema Operativo Windows: WINDOWS Instalación:  La instalación es mínimamente

LINUX Instalación:  No resulta sencillo siempre,

configurable aunque es muy

pero

permite

personalizar

sencillo.

totalmente los paquetes que se quieran instalar.

Software:

Software: 68

IT. CD. VALLES


 Windows al ser el mas fácil de

 Linux al tener menos software

usar en las empresas, posee

en algunos campos sufre una

una gran cantidad de software.

menor aceptación por parte de

La copia y distribución es un

las empresas, aunque gracias

delito.

a los apoyos de empresas

Shareware: es aquel que tras

como Sun Microsystems o

un

IBM se ha logrado muchos

periodo

de

prueba

es

necesario pagar o comprar.

avances. Freeware: permiten la copia y distribución de Software.

Robustez:

Robustez:

 En Windows siempre hay que reiniciar cuando se cambia la configuración del sistema, se bloquea ejecuta

fácilmente

cuando

operaciones

aparentemente simples por lo que hay que reiniciar el equipo.

 Linux

se

ha

caracterizado

siempre por la robustez de su sistema ya que pueden pasar meses e incluso años sin la necesidad

de

apagar

o

reiniciar el equipo, también si una

aplicación

simplemente

no

falla bloquea

totalmente al equipo. Seguridad: Seguridad:  Muy poco seguro, existen miles de virus que atacan sistemas Windows.

 Extremadamente seguro, tiene varios sistemas de protección. No existen virus para Linux.

Ilustración 11 Comparación de sistemas operativos

69

IT. CD. VALLES


Además se realizaron comparaciones y se justifica el porque usar Postgresql y no MySQL, plasmando mediante una tabla las siguientes diferencias de cada manejador de Base de Datos: POSTGRESQL

MYSQL

 Costo de adquisición bajo o nulo.

velocidad a la hora de realizar las operaciones, lo que le hace

 Cero problemas de licencias.  Es

 Lo mejor de MySQL es su

capaz

número

de

de

cantidad

uno

ajustarse

al

CPUs y a

la

de

memoria

de

los

gestores

que

ofrecen mayor rendimiento.

que

posee el sistema de forma óptima, haciéndole capaz de soportar una mayor cantidad de peticiones simultáneas de manera correcta (en algunos benchmarks se dice que ha llegado a soportar el triple de carga

de

lo

que

soporta

MySQL). Ilustración 12 Diferencias entre PostgreSQL y MySQL

70

IT. CD. VALLES


7.8.2 Webhosting Versión 1 Se cotizaron algunos Hosting y el que más ventajas y servicios ofrece, de acuerdo a las necesidades de la UPN 242, tiene un costo anual de $ 2,080.00, por lo que se procedió a darle informes al cliente sobre los movimientos que se requieren para efectuar el hospedaje. Versión 2 De acuerdo a la cotización del Hosting que se realizó en la versión 1, se procedió a la adquisición de ésta para poder hospedar la página de la Universidad Pedagógica Unidad 242.

71

IT. CD. VALLES


8 RESULTADOS Los resultados que se obtuvieron en el Desarrollo e Implementación del proyecto son los siguientes:  El conocimiento y manejo del Software Macromedia Dreamweaver 8, que se utilizó para el diseño de cada una de las páginas que contiene el Portal.  Otra herramienta del que se hizo uso para el diseño del botones, encabezados, subtítulos de cada página, etc., fue CorelDRAW 12.  Conocimiento acerca de la instalación y configuración del servidor que se utilizó para el almacenamiento de la base de datos, así como del Portal.  Administración de sitios, esto se realizo para poder accesar de forma remota de la maquina virtual que es donde se encuentra almacenada el Portal.

72

IT. CD. VALLES


9 CONCLUSIONES Y RECOMENDACIONES Al llevar a cabo la realización de proyecto para la Universidad Pedagógica Nacional Unidad 242 se llego a lo siguiente:

9.1 Conclusiones  El desarrollo del Portal siguió las fases de desarrollo del modelo IWeb conocido como modelo de ingeniería Web.  El software desarrollado utilizo una metodología orientada a objetos utilizando el UML como lenguaje de modelado.  Los requerimientos técnicos, gráficos y de contenidos se recabaron en tiempo y forma logrando el desarrollo de software con las pruebas pertinentes desarrolladas en las actividades.  El desarrollo e implementación del Portal fue creado con las especificaciones recopiladas y propuestas por la Institución, fueron cumplidas de la forma adecuada en que se especificaron al inicio del proyecto.  Se configuró el servidor con un sistema operativo de código abierto (open source) lo cual garantiza la funcionalidad y no ocasiona problemas con licenciamiento.  Se llevaron a cabo las gestiones ante Nic México para la adquisición del .edu así como el hospedaje en el servidor de Teléfonos de México.

73

IT. CD. VALLES


9.2 Recomendaciones  Se recomienda que el servidor en el que se encuentra almacenada el contenido del Portal no se desconecte la corriente eléctrica, ya que es necesario que esté disponible para la Web.  Darle el mantenimiento adecuado al servidor para dar mejor rendimiento.  También se recomienda que este se encuentre a una temperatura ambiente ya que podría llegar a ocurrir un fallo.

74

IT. CD. VALLES


10 BIBLIOGRAFÍA CASTRO, Elizabeth. HTML 4, cuarta edición., Prentice Hall, PAG. 16 DUBOIS, Paul. MySQL Prentice Hall, Madrid, 2001, pp. 5-48, 383-412, 535552 MORRIS, Brouce. HTML avanzado herramientas y trucos para hacer una Web de primera, Microsoft press, México, 1997, pp. 81-82,522-529

PRESSMAN Roger S. 6ta Edición MC Graw Hill INGENIERIA DEL SOFTWARE un enfoque práctico, pp. 501-638

SEEN, James A. Análisis y diseño de sistemas de información; segunda edición, Mc Graw Hill, México, 1992, pp. 116-147

SOMMERVILLE, Ian. Ingeniería de software, sexta edición, Pearson Educación, México 2002, pp.

SORIA, Ramón. HTML diseño y creación de páginas Web, Ra-Ma, México, 1997

75

IT. CD. VALLES


11 GLOSARIO ARQUITECTURA: Conjunto de elementos de programación adecuadamente estructurados dentro de un sistema, con el fin de crear una programación lógica y fiable para el diseño de aplicaciones. ATRIBUTOS: Las propiedades de una etiqueta HTML. Un atributo es un campo que contiene valores para cada objeto que pertenece a una relación. BODY: Es el cuerpo de la página, donde va lo que se ve en el navegador al cargar una web. En el Body van los textos, las imágenes y todos los contenidos de la web. BROWSER: Programa utilizado para visualizar las páginas web. Los más utilizados son el Internet Explorer y Netscape. CGI: Sistema normalizado de intercambio de datos (protocolo) entre servidores web y otras aplicaciones. CSS: Son plantillas que se pueden utilizar para crear documentos HTML y dar formato a los textos que se presenten en pantalla. DREAMWEAVER: Programa desarrollado por Macromedia (ahora Adobe) para diseño, desarrollo, publicación y administración de sitios y aplicaciones Web. ETIQUETA HTML: HTML, es un lenguaje simple de marcado utilizado para crear documentos de hipertexto para WWW. FTP: Protocolo que permite la transferencia de archivos desde ya un servidor de alojamiento. HEAD: Define la cabecera del documento HTML, esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario. 76

IT. CD. VALLES


HIPERMEDIA: Combinación de los términos “hipertexto” y “multimedia”. Se refiere a las páginas Web que integran información en distintos tipos de formato: texto, imágenes, sonidos y video, principalmente. HOST: Computadora que, mediante la utilización de los protocolos TCP/IP, permite a los usuarios comunicarse con otros sistemas anfitriones de una red. HOSTING: Servicio que brindan determinadas empresas que tienen servidores conectados a Internet, de forma que ofrecen espacio en sus discos para que usted pueda alojar en el los archivos que componen su sitio web. HTTP: Es el protocolo de transferencia de hipertexto, o sea el protocolo que los servidores de World Wide Web utilizan para mandar documentos HTML a través de Internet. INTERNET: Es un sistema mundial de redes de computadoras, un conjunto integrado por las diferentes redes de cada país del mundo, por medio del cual un usuario en cualquier computadora puede tener acceso a cualquier tipo de información. LINUX: Es un sistema operativo, compatible Unix. Dos características muy peculiares lo diferencian del resto de los sistemas que podemos encontrar en el mercado, la primera, es que es libre, esto significa que no tenemos que pagar ningún tipo de licencia a ninguna casa desarrolladora de software por el uso del mismo, la segunda, es que el sistema viene acompañado del código fuente. MYSQL: Es un gestor de Bases de Datos multiusuario que gestiona bases de datos relacionales PHP: Es un lenguaje de programación interpretado, diseñado originalmente para la creación de páginas web dinámicas.

77

IT. CD. VALLES


PORTAL: Un portal de Internet es un sitio web cuyo objetivo es ofrecer al usuario, de forma fácil e integrada, el acceso a una serie de recursos y de servicios. POSTGRESQL: Postgresql es un servidor de base de datos relacional orientada a objetos de software libre, liberado bajo la licencia BSD. SERVIDOR: Se encarga de proporcionar al navegador los documentos y medios que este solicita. Utiliza un protocolo HTTP para atender las solicitudes de archivos por parte de un navegador. SISTEMA UNIX: Unix es un sistema operativo robusto, estable, multiusuario, multitarea, multiplataforma y con gran capacidad para gestión de redes, Linux fue creado siguiendo estas características. SITIO: También denominado lugar de la red, para referirnos a cualquier recurso en la misma, normalmente un servidor donde se ubican cuentas de clientes con páginas web. TCP/IP: (Transport Control Protocol/Internet Protocol) Protocolo en el que se basa la comunicación de la red Internet; el primero se encarga de dividir la información en paquetes en origen, para luego recomponerla en destino, mientras que el segundo se responsabiliza de dirigirla adecuadamente a través de la red. UML: Lenguaje gráfico para especificar, construir, visualizar las partes o artefactos que son información utilizada y originada mediante un proceso de software. Es un lenguaje estándar de modelado orientado a objetos. URL: Es el Localizador Uniforme de Recursos, o dicho más claramente, es la dirección que localiza una información dentro de Internet. VINCULO: Conexión que se establece entre páginas web o textos mediante una referencia insertada. 78

IT. CD. VALLES


WEB: El término se utiliza para definir el universo del World Wide Web, los sitios, la información y los servicios de la “telaraña”. WEBAPP: Se denomina aplicación web a aquellas aplicaciones que los usuarios pueden utilizar accediendo a un servidor web a través de Internet o de una intranet mediante un navegador. WWW: Siglas que corresponden a la frase en inglés World Wide Web y que se refiere al principal servicio de Internet por medio del cual se agrupan los distintos sitios o páginas electrónicas.

79

IT. CD. VALLES


12 ANEXOS

80

IT. CD. VALLES


ANEXO 2. ESTUDIO DE FACTIBILIDAD VERSIÓN 1 Se realizó mediante un análisis detallado en el cuál se obtuvieron los siguientes requerimientos divididos en cuatro categorías:  El equipo o maquinaria con el que cuenta la Universidad Pedagógica Nacional Unidad 242 (Factibilidad Técnica).  El recurso humano disponible y capaz para la manipulación del proyecto (Factibilidad Operativa).  Capital actual disponible por parte de la Institución para cubrir los costes que se generaron durante el desarrollo del proyecto (Factibilidad Económica).  Autorización de requerimientos de los programas, así como las licencias requeridos para el proyecto que se desarrolló. (Factibilidad Legal). TÈCNICO. En lo que a este estudio se refiere, la Universidad Pedagógica Nacional Unidad 242 cubrió las necesidades y/o requerimientos para el desglose de las actividades de diseño, el desarrollo e implementación del Portal dentro de ésta institución como lo son:  Diseño, Desarrollo e Implementación del Portal:  Equipo dentro del laboratorio de cómputo:

81

IT. CD. VALLES


UPN

REQUERIDO

Cuenta con 15 1 servidor con las computadoras de siguientes características: las cuales cada una tiene por especificaciones técnicas del CPU: Sistema: Microsoft Windows Sistema: Sistema XP Profesional operativo Linux Versión 2002

Equipo:

Pentium 4 CPU 2.40 GHz 80 GB en disco Equipo: duro 256 MB de RAM

HP ML 110G5 Intel E2 160 1.8 GHz, 1GB RAM RED DVD ROM

Monitor

Monitor

Teclado

Teclado

Mouse

Mouse

La institución no contaba con un servidor con las características necesarias para implementar el proyecto; pero se formuló una cotización del precio total de éste a los directivos y administrativos llegando a la conclusión de la adquisición del mismo, de acuerdo a las especificaciones técnicas mencionadas anteriormente por los desarrolladores.  La Universidad Pedagógica Nacional Unidad 242 puso a disposición los lenguajes de programación necesarios para el desarrollo del proyecto que son los siguientes:  Linux  HTML  Dreamweaver 82

IT. CD. VALLES


 PHP  MySQL Dichos lenguajes fueron facilitados por la Universidad Pedagógica Nacional Unidad 242 para la elaboración de la Pagina Web.  Implementación:  La institución ya cuenta con Internet inalámbrico Prodigy Infinitum, que es el requerimiento indispensable para poner en marcha el Portal, pero este servicio contiene limitantes que no satisfacen las necesidades de la institución, es por esto que se opto por la adquisición de un servicio de Hosting que ofrece a la UPN mayores beneficios que costo.  Y en lo que al servidor se refiere la UPN adquirió un servidor con las características establecidas.

83

IT. CD. VALLES


OPERATIVA. Una vez implementado el proyecto, la funcionalidad de éste se lleva a cabo por el Administrador de la WebApp de la Universidad Pedagógica Nacional Unidad 242; mismo que es el encargado de la mantenibilidad de ésta, refiriéndonos a las actualizaciones correspondientes que implican el manejo de la información asociados a la Institución y que se encuentran en constante cambio; por efecto, a él se le brindó una capacitación previa a la implementación; con un tiempo aproximado de 2 horas durante 4 días alcanzando un costo total de $1400.00 MN, esto facilitó al administrador la forma en que se llevan a cabo los reajustes de la información de manera óptima, obteniendo como derivado un buen manejo administrativo de los datos que contiene el Portal. La persona encargada de administrar éste; tiene como compromiso el mantenimiento del mismo, ya que ésta actividad se realiza constantemente de acuerdo a las necesidades de la Institución.

ECONÓMICA. Este estudio consistió en el desglose de las actividades que se generaron durante el desarrollo del proyecto, además se describieron los costos que arrojaron cada actividad durante su proceso.

En la tabla siguiente se muestran los costos monetarios desglosados de acuerdo a cada movimiento que se realizo durante el desarrollo del proyecto arrojando como resultado el costo total referente a las etapas de las que se compone una Aplicación Web.

84

IT. CD. VALLES


ACTIVIDADES

Días

Tarifa

Entrevista con el cliente

1

$50.00

Identificación de necesidades y Requerimientos

1

$50.00

WebApp

1

$50.00

Recopilación de requisitos

2

$100.00

Establecer alcances y limitaciones

1

$50.00

Análisis de recursos y factibilidad

3

$200.00

Análisis de riesgos

3

$150.00

Análisis relación-navegación

3

$150.00

Análisis de configuración

2

$150.00

Análisis functional

2

$150.00

Análisis de interacción

2

$150.00

Análisis de contenido

3

$150.00

Diseño de componentes

4

$200.00

Diseño arquitectónico

4

$200.00

Diseño de navegación

5

$250.00

Diseño de contenido

4

$250.00

Diseño de las bases de datos

3

$200.00

Diseño de la interfaz

5

$250.00

60

3,000

Costo

PLANTEAMIENTO Y FORMULACIÓN

Determinación de

objetivos de la

$300.00

PLANIFICACIÓN

$350.00

ANÁLISIS

$750.00

INGENIERIA

GENERACIÓN

DE

PÁGINAS

$1,350.00

Y

PRUEBAS Generación de las páginas del Portal

85

IT. CD. VALLES


Prueba de configuración

2

$100.00

Prueba de componentes

2

$100.00

Prueba de navegación

3

$150.00

Pruebas de contenido

3

$150.00

Pruebas de la interfaz

2

$100.00

$3,600.00

1

$100.00

$100.00

EVALUACIÓN DEL CLIENTE Validación del avance IMPLENTACIÓN Configuración del servidor

3

Webhosting

1

DOCUMENTACIÓN Manual de usuario

3

$200.00

Manual técnico

2

$200.00

$400.00

5

$1,500.00

$1,500.00

CAPACITACIÓN Curso de capacitación OTROS GASTOS Servidor HP ML 110GHz

$10,690.00

Hosting /costo anual

$2,080.00

Costo de recurso humano

$5,000.00

COSTO TOTAL

$26,120.00

Considerando que el proyecto que se desarrollo no fue de tipo comercial, sino académico, la institución sólo aporto el capital necesario para la compra del servidor y del Hosting; por lo tanto se estima como máximo un costo total de $12,770.00 MN.

86

IT. CD. VALLES


LEGAL La seguridad Informática debe vigilar principalmente las propiedades de Privacidad, Integridad de datos y/o programas, así como la disponibilidad de los mismos en un ambiente dado. El problema básicamente está en que no se respeten los derechos de los autores, usando nuevas tecnologías de una manera inadecuada, por lo cual surgen problemas como la piratería. Al llevarse a cabo el desarrollo del proyecto se tomó en cuenta las especificaciones de la adquisición del software requerido para el desarrollo del Portal; es decir el software necesario para su diseño, así como para la programación del mismo.

87

IT. CD. VALLES


ANEXO 3. ENTREVISTA VERSIÓN 1

NOMBRE: Mtro. Daniel Cruz Laureano_____________________________________ PUESTO: Director de la Universidad Pedagógica Nacional Unidad 242____________ FECHA: Martes 26 de Agosto de 2008_____________________________________ OBJETIVO DE LA ENTREVISTA: Recabar los requisitos de contenido y requisitos__ funcionales que estructurarán al Portal._____________________________________ 1. ¿Cuáles son las principales necesidades de la UPN Unidad 242 para querer implementar un Portal? Dar a conocer la Universidad Pedagógica Nacional de Cd. Valles vía medios_ de comunicación como lo es la Internet._______________________________ 2. ¿Quién es la persona que solicita la creación del Portal y que puesto funge en la institución? Mtro. Daniel Cruz Laureano, director de la Institución____________________ 3. ¿Cuáles son los objetivos que debe cubrir la creación e implementación de ésta? Debe de mantener informado a los alumnos y al público en general_________ 4. ¿Cuáles son las metas que se deben de cumplir con la implementación del Portal? Mantener informado al alumnado sobre el proceso administrativo y eventos de la misma._______________________________________________________ 5. ¿Qué problemas solucionara la aplicación? La aglomeración en servicios escolares_______________________________

88

IT. CD. VALLES


6. ¿Qué funciones o tareas se lograrán cuándo se use la página Web de la UPN Unidad 242? Informar sobre calificaciones, registros, eventos y convocatorias de carreras_ entre otros._____________________________________________________

7. ¿Quién administrará la página? C. Celia Rangel Rocha____________________________________________ 8. ¿Quién(es) usarán la página Web? Personal administrativo, docente, alumnado y público en general.__________ 9. ¿El personal requerido cuenta con el profesionalismo y experiencia que se requiere para el mantenimiento de la página? Sí_____________________________________________________________ 10. ¿Qué clase de contenido se proporcionará a los usuarios de la página Web? Cultural, educativo y de información acerca de algunos otros eventos_______ referentes a la institución.__________________________________________ 11. ¿La UPN Unidad 242, está dispuesta a cubrir los gastos que se requieran para el desarrollo e implementación de la página Web? Sí_____________________________________________________________ 12. ¿Alguna otra persona o algún departamento de la institución que podría proporcionar información adicional? Sí, el departamento de servicios escolares, administrativo y docencia_______

89

IT. CD. VALLES


ANEXO 4. ANÁLISIS DE RIESGOS VERSIÓN 1 El riesgo que se considero para el desarrollo del proyecto es el tiempo destinado para el mismo, pérdida de hardware por desastres naturales, etc., éstos amenazaron el plan del proyecto. Por ejemplo, si dicho riesgo se hubiese vuelto real, es muy probable que la calendarización del proyecto pudiera haberse modificado y por ende también los costos.

Para el análisis del riesgo global del producto se formularon las siguientes preguntas y una tabla de riesgos:

1. ¿El director del plantel y la jefatura administrativa se han comprometido formalmente a apoyar el desarrollo de una página para la UPN Unidad 242?

2. ¿Los desarrollares de la aplicación y la UPN Unidad 242 han definido y entendido el cumplir con los requisitos?

3. ¿Los requisitos que se estipularon para el desarrollo de la aplicación son estables?

4. ¿Las desarrolladoras de la página cuentan con conocimiento amplio acerca de las herramientas y tecnologías que están usando?

5. ¿Es adecuado el número de participantes que trabajan sobre el proyecto?

90

IT. CD. VALLES


ESTIMACIÓN DE RIESGOS DEL PROYECTO RIESGOS

CATEGORIAS

PROBABILIDAD

IMPACTO

La estimación del tamaño de la aplicación no es la correcta.

TP

50%

2

Los usuarios de la aplicación se resisten al uso de éste.

CO

20%

1

No soporte el número de usuarios (concurrencia)

TP

30%

1

La fecha de entrega del proyecto estará ajustada.

CO

60%

2

Los directivos de la UPN Unidad 242 no apoyan el proyecto económicamente.

CL

30%

1

Las herramientas y tecnologías utilizadas no sean satisfactorias con el cliente.

RT

10%

1

Personal inexperto.

PE

40%

1

Definición de nuevos requisitos.

TP

80%

3

Perdida de hardware por desastres naturales.

CL

20%

1

Falta de propaganda adecuada para difundir por todos los medios de comunicación a la aplicación.

RV

20%

1

91

IT. CD. VALLES


ANEXO 5. ANÁLISIS RELACIÓN-NAVEGACIÓN VERSIÓN 1 En esta fase se identificaron las relaciones que existen entre la información que contiene la aplicación con las funciones de procesamiento que el usuario de la página inicia directamente.

Esto se llevó a cabo con el propósito de establecer los principales requisitos para especificar los vínculos de navegación que le permiten al usuario lograr el propósito de su visita al sitio, de manera que le haga más práctica el cambio de un contenido hacia otro contenido.

Para poder realizar un mejor análisis de relación entre el contenido del sitio se formularon las siguientes cuestiones:

1. ¿Cuál es el contenido que requiere la institución que se muestre en diferentes ubicaciones dentro de la página UPN Unidad 242?

2. De acuerdo al cuestionamiento anterior, ¿dónde pretende que se coloque la información solicitada dentro de la página?

3. ¿Qué elementos de la página deben de aparecer siempre en conjunto con otros elementos que la conforman? ¿cuáles son los otros elementos?

4. ¿Cuáles son los objetos de contenido que siempre deben de aparecer en el mismo lugar; es decir, misma ubicación de la página? 92

IT. CD. VALLES


Una vez que se identificaron los elementos que se relacionan, se procedió a realización de un análisis de navegación que indica la manera en que navega cada categoría de usuario dentro de la página UPN Unidad 242. En este análisis se plantearon las siguientes preguntas:

1. ¿Qué información debe ser más fácil de alcanzar respecto a otros elementos de la página? ¿y en qué orden se deben presentar?

2. ¿Cuál es la información que debe resaltarse para llamar la atención de los usuarios y lograr que navegue hacia esa dirección?

3. ¿La navegación de un contenido hacia otro, dentro de la página se debe de realizar por medio de vínculos u otro medio?

4. ¿Debe de estar disponible un mapa o menú de navegación completo, dentro de cada punto en donde puede interactuar el usuario? ¿o es mejor un simple vínculo de retroceso?

5. ¿Un usuario puede acceder a todos los elementos, funciones u objetos de contenido dentro de la aplicación? ¿habrá restricciones para las diferentes clases de usuario?

93

IT. CD. VALLES


ANEXO 6. ANALISIS DE CONFIGURACIÓN VERSIÓN 1 El Portal de la Universidad Pedagógica Nacional Unidad 242, se desarrollo de manera que es acoplable a los diferentes ambientes; tanto del lado del servidor como el de los usuarios de la aplicación.

Los navegadores que se usaron para las pruebas de navegación de la página UPN Unidad 242 fueron:  Mozilla FireFox. Se está consolidando poco a poco como uno de los mejores navegadores del mercado y un poderoso competidor del omnipresente Internet Explorer. Una de las ventajas más sobresalientes es la navegación por pestañas que consiste en abrir pequeñas pestañas dentro del mismo navegador para navegar sin tener que abrir tantas ventanas, es como abrir muchos archivos de Flash al mismo tiempo, pero más coherente. Firefox ha avanzado muchísimo en lo que a usabilidad se refiere, es muy intuitivo y para los usuarios fanáticos de Internet Explorer les resultara muy fácil migrar a él.

 Internet Explorer. Cuándo se navega con Explorer en cualquier página que se abra se tiene una peste de igual difusión que el spam, las ventanas emergentes de publicidad. Estas llenan la barra de tareas de basura publicitaria que no interesan, tales como casinos, porno, cámaras de seguridad y mas porno, etc.

94

IT. CD. VALLES


Estos navegadores son los más comúnmente usados por los usuarios por lo tanto son los que se tomaron para la mejora de la calidad del Portal. El ambiente del sistema operativo es Linux para el servidor, ya que al trabajar en este ambiente de sistema es más seguro el alojamiento de la página en cuanto a seguridad de datos, es decir los datos no están propensos a los diferentes tipos de virus que circulan por la red.

95

IT. CD. VALLES


ANEXO 7. ANÁLISIS FUNCIONAL DE LA UPN UNIDAD 242 VERSION 1

Página de Bienvenida

Categoria de usuario

Asigna categoría

Registro

Consultar Catálogo bibliográfico

Usuario externo

Usuario alumno

Carreras que ofrece

Consultar calificaciones

Usuario externo

Convocatorias

Requisitos de admisión

Eventos educativos

Usuario docente

Información de calificaciones

Avisos

Cerrar sesión

96

IT. CD. VALLES


ANEXO 8. ANÁLISIS DE INTERACCIÓN DE LA UPN UNIDAD 242 VERSIÓN 1 Para llevar a cabo los análisis siguientes se procedió a jerarquizar

a los

usuarios que visitan o que hacen uso del Portal, obteniendo como resultado:

JERARQUIA DE USUARIOS

USUARIO DE UPN242Valles.edu

VISITANTE DEL SITIO

USUARIO DOCENTE

USUARIO ALUMNO

ADMINISTRADOR

USUARIO EXTERNO

97

IT. CD. VALLES

RESIDENCIA PROFESIONAL CASO DE USO PARA EL ADMINISTRADOR

Actualizar Base de datos

USUARIO ADMINISTRADOR

Inspeccionar contenido general

Actualizar contenido de la página

Este es el caso de uso para la jerarquía de usuario administrador, quien realiza una inspección del contenido del Portal y decide junto con los directivos de la UPN Unidad 242 si actualiza la base de datos y el contenido del Portal o bien realizar ambas tareas. CASO DE USO PARA USUARIO DOCENTE

Inspeccionar contenido general

Realizar avisos

Usuario docente

Ingresar a interfaz de captura de calificaciones

Capturar Calificaciones

Consultar catalogo bibliográfico

98

IT. CD. VALLES


El caso de uso docente, muestra las actividades que realiza este tipo de usuario, es decir el docente que labora en esta institución. CASOS DE USO PARA USUARIO ALUMNO

USUARIO ALUMNO

Inspeccionar contenido

Contestar test

Ingresar a servicios escolares

Ingresar número de control

Accesar a página UPN242

Desplegar boleta

Este caso de uso es aplicado a todos los alumnos inscritos en la Universidad Pedagógica Unidad 242, son los que tendrán acceso al Portal.

99

IT. CD. VALLES


CASOS DE USO PARA USUARIO EXTERNO

Inspeccionar contenido

USUARIO EXTERNO

Accesar a página UPN242

Contestar test

Visualizar carreras que ofrece Visualizar requisitos de admisión Biblioteca Servicios de la UPN242 Otros

En el caso del usuario externo está dirigido a cualquier tipo de persona que esté dispuesto a visitar el Portal de la Universidad Pedagógica Nacional Unidad 242.

100

IT. CD. VALLES


ANEXO 9. DIAGRAMA DE SECUENCIA USUARIO ALUMNO VERSIÓN 1 Usuario alumno Navegador

Página UPN 242 Valles

Interfaz de servicios escolares

Base de datos calif_alumnos

Servidor

Password

Interfaz de calificaciones

Introduce URL

Se envía URL

Mostrar petición

Visualizar contenido

Selecciona opción del menú

Teclea número de control

Número de control validado

Envía datos

Muestra información

101

IT. CD. VALLES


ANEXO 10. DIAGRAMA DE SECUENCIA USUARIO ADMINISTRADOR VERSIÓN 1

Navegador

Base de datos

Servidor

Interfaz de actualización

Password

Actualizar información

Usuario Administrador Teclea URL Envía URL Envía menú

Solicta id

Valida id

Envía el contenido Envía información

Envía actualizaciones

102

IT. CD. VALLES


ANEXO 11. MODELO DE CONTENIDO DE LA UPN UNIDAD 242 VERSIÓN 1

Autor

Imágenes

Componentes estructurales

Logotipo UPN

Catálogo de libros

Nombre del libro Editorial

Fotos Año de edición

Bienvenida

Quien lo publica

Nombre

Eventos Académicos

Fecha Lugar

Hora

A quien va dirigido Convocatorias Nombre de la convocatoria

Fecha

103

IT. CD. VALLES


ANEXO 12. DISEÑO DE COMPONENTES DEL PORTALDE LA UPN VERSIÓN 1 ¿Qué es la UPN? Bienvenida

Mostrar () Cerrar () Regresar ()

Directorio Nombre Puesto que funge Correo electrónico Teléfono Dirección Mostrar () Cerrar () Regresar ()

Unidades UPN


Convenios


Documentos UPN descargables


Admisión ¿Qué estudiar en la UPN? Licenciaturas Licenciaturas


Especialidades


Maestria



Servicios Comedor


Sala de Cómputo


Servicio social


Servicios culturales

Servicios escolares



Publicaciones Libros Nombre Autor Año Edición Mostrar () Cerrar () Regresar ()

Revistas Nombre Año Mostrar () Cerrar () Regresar ()

Convocatorias Nombre Publicador A quien dirigido Fecha Mostrar () Cerrar () Regresar ()

104

IT. CD. VALLES


Noticias UPN Varios

Escolales

Culturales Tipo Publicador Fecha

Tipo Publicador Fecha



Biblioteca

Tipo Fecha Mostrar () Cerrar () Regresar ()

Correos electrónicos

Catálogo bibliográfico Nombre Autor Año Edición

Correo Maestros

Correo UPN’s

Nombre Correo electrónico

Unidad Dirección Correo electrónico




Buzón de quejas y sugerencias Mapa de sitio Quejas

Sugerencias Ubicación

Nombre Fecha Comentario Depto. dirigido

Nombre Fecha Sugerencia Depto. dirigido




105

IT. CD. VALLES


ANEXO 13. DISEÑO ARQUITECTÓNICO DEL PORTAL DE LA UPN VERSIÓN 1

PRINCIPAL Mapa del sitio Biblioteca Correos electrónicos Páginas UPN Buzón de quejas y sugerencias

BIBLIOTECA Catálogo bibliográfico

NOTICIAS Escolares Culturales Varios

¿QUE ES LA UPN? Bienvenida Directorio Unidades UPN Convenios Documentos UPN(descargables)

ADMISIÓN Licenciaturas

CORREOS ELECTRÓNICOS Correos-Docentes Direcciones UPN’s

CARRERAS Licenciaturas Especialidades Maestrías

SERVICIOS Comedor Sala de cómputo Servicio social Servicios culturales Servicios escolares

BUZON DE QUEJAS Y SUGERENCIAS Quejas Sugerencias

106

IT. CD. VALLES


ANEXO 14. DISEÑO NAVEGACIONAL DEL PORTAL DE LA UPN VERSIÓN 1 INICIO

Mapa de sitio

¿Qué es la UPN?

Buzón de quejas y sugerencias

Carreras

Admisión

Áreas académicas

Noticias UPN Biblioteca

Bienvenida

Unidades UPN

Publicaciones

Documentos UPN descargables

Quejas

Convenios

Licenciaturas

Sugerencias

Licenciaturas

Noticias escolares

Servicios Directorio


Noticias culturales

Correos maestros

Direcciones UPN

Maestrías

Noticias varios

Comedor

Servicio social


Servicios escolares

Sala de cómputo

Libros

Catálogo bibliográfico

Revistas

Convocatorias

107

IT. CD. VALLES


ANEXO 15. DISEÑO DE CONTENIDO DEL PORTAL DE LA UPN VERSIÓN 1 Bienvenida


Descripción de componente

Descripcióndetexto Color texto Estilo fuente Tamaño texto Espaciadoenlíneas Color fondo

Fotografíabienvenida Estiloborde Dimensión horizontal Dimensión vertical

Testdemejora Color texto Estilo fuente Tamaño texto Alineación texto Color fondo

Menú Color texto Estilo fuente Tamaño texto Alineación texto Color fondo

Logotipo Posición logotipo tamaño logotipo

Botoneslinks Color texto Estilo fuente Tamaño texto Alineación texto Posición botón Tamaño botón Color fondo

108

IT. CD. VALLES

RESIDENCIA PROFESIONAL Directorio


Descripcióndecomponente

Descripcióndetexto Color texto Estilo fuente Espaciado líneas Tamaño texto Color fondo


Testdemejora

Menú

Color texto Estilo fuente Espaciado líneas Tamaño texto Color fondo

Color texto Estilo fuente Tamaño texto Alineación texto Color fondo

Logotipo Posición logotipo Tamaño logotipo

UnidadesUPN





Testdemejora

Menú




109

IT. CD. VALLES

RESIDENCIA PROFESIONAL Licenciaturas





Testdemejora

Menú




Maestrías





Testdemejora

Menú




110

IT. CD. VALLES

RESIDENCIA PROFESIONAL Servicodecomedor





Testdemejora

Menú




Fotografíaservicio Estilo borde Dimensión horizontal Dimensión vertical Posición fotografía

AdmisiónLicenciaturas





Testdemejora Color texto Estilo fuente Espaciado líneas Tamaño texto Color fondo



111

IT. CD. VALLES

RESIDENCIA PROFESIONAL Saladecómputo





Testdemejora

Menú





Serviciosculturales





Testdemejora

Menú





112

IT. CD. VALLES

RESIDENCIA PROFESIONAL Interfazdeacceso

Serviciosescolares


Mostrar () Consultar () Regresar () Cerrar ()

Mostrar () Consultar () Cerrar () Regresar ()

Botones Texto Color texto Estilo fuente Espaciado líneas Tamaño texto Color fondo




Testdemejora

Menú



Color texto Estilo fuente Tamaño texto Alineación texto Posición botón Tamaño botón Color fondo


Fotografía Estilo borde Dimensión horizontal Dimensión vertical Posición fotografía

113

IT. CD. VALLES


ANEXO 16. DISEÑO DE LA BASE DE DATOS VERSION 1 ALUMNO

CARRERA

PK

matricula

FK1 FK3

apellidopat apellidomat nombre nivel clavecarrera clavemateria

PK

clavecarrera

FK1

nombrecarrera plan clavemateria

ASESORES PK

claveasesor

FK1

apellidopatase apellidomatase nombreasesor clavemateria clavecarrera

MATERIAS PK

clavemateria

FK1 FK2

nombremateria clavecarrera creditos clavecarrera matricula

CALIFICACIONES

FK1

FK2

matricula calificacion observacion periodo tipo clavemateria

114

IT. CD. VALLES


ANEXO 17. DISEÑO DE INTERFAZ DEL PORTAL DE LA UPN VERSIÓN 1

LOGOTIPO DE LA UPN

UNIVERSIDAD PEDAGÓGICA NACIONAL UNIDAD 242

LOGOTIPO DE LA SEGEST

¿QUE ES LA UPN? CARRERAS ADMISION SERVICIOS AREAS ACADÉMICAS PUBLICACIONES NOTICIAS UPN

GRÁFICO MAPA DEL SITIO

GRÁFICO BIBLIOTECA

GRAFICO

GÁFICO

CORREOS ELECTRONICOS

TEXTO DE LA PAGINA INICIAL PAGINAS UPN

BUZON DE QUEJAS Y SUGERENCIAS

TEST DE MEJORA DEL PORTAL

115

IT. CD. VALLES


ANEXO 18. MÉTRICA ORIENTADA A LA FUNCIÓN VERSIÓN 1 Parámetros de

Factor de Ponderación Cuenta

$

7

Simple

Medio

Complejo

X

3

4

6

=

28

5

X

4

5

7

=

25

29

X

3

4

6

=

116

3

X

7

10

15

=

30

32

X

5

7

10

=

224

medición Números de entradas de usuario Números de salidas de usuario Número de peticiones de usuario Número de archivos Número de interfaces externas

Cuenta Total

423

PF=423 * [ 0.65 + 0.01 * 6 (Fi) ] =423 [ 0.65 + 0.01 * 6 (56) ] = 423 [ 0.66 * 336 ] = 423 [ 221.76 ] PF =93804.48

116

IT. CD. VALLES


ANEXO 19. PRUEBAS DE CONFIGURACIÓN VERSIÓN 1 Prueba del index.php en Internet Explorer con un Sistema Operativo en Windows Vista Home:

117

IT. CD. VALLES


Prueba del index.php en Mozilla Firefox con un Sistema Operativo en Windows XP Profesional Versión 2002:

118

IT. CD. VALLES


ANEXO 1. DISEÑO DE COMPONENTES VERSION 2

UPN 242 Bienvenida

Unidades UPN

Directorio Nombre Puesto que funge Correo electrónico Teléfono Dirección




Convenios


Documentos Oficiales


Admisión

Carreras

Licenciaturas Maestria

Licenciaturas




Servicios Cafetería


Sala de Cómputo


Servicio social



Servicios escolares



Publicaciones Libros Nombre Autor Año Edición Mostrar () Cerrar () Regresar ()

Revistas Nombre Año Mostrar () Cerrar () Regresar ()

Convocatorias Nombre Publicador A quien dirigido Fecha Mostrar () Cerrar () Regresar ()

119

IT. CD. VALLES


Noticias UPN Escolales

Locales Tipo Publicador Fecha






Biblioteca Catálogo bibliográfico Nombre Autor Año Edición Mostrar () Cerrar () Regresar ()

Buzón de Quejas y Sugerencias Quejas y Sugerencias Nombre Fecha h Comentario Depto. dirigido Mostrar () Cerrar () Regresar ()

Varios

Culturales

Tipo Fecha Mostrar () Cerrar () Regresar ()

Correos electrónicos Correo Maestros

Correo UPN’s

Nombre Correo electrónico

Unidad Dirección Correo electrónico



Mapa de sitio Ubicación


120

IT. CD. VALLES


Consulta y Registro de Calificaciones Interfaz del Administrador


Interfaz del Alumno




Cubo de Fotos Cubo fotográfico


121

IT. CD. VALLES


ANEXO 2. DISEÑO ARQUITECTÓNICO VERSION 2 INICIO

UPN 242

Mapa del sitio Biblioteca Correos electrónicos Páginas UPN Buzón de quejas y sugerencias Consulta y registro de calificaciones

Bienvenida Directorio Unidades UPN Convenios Documentos oficiales

ADMISIÓN

SERVICIOS

Licenciaturas

CORREOS ELECTRÓNICOS Correos-Docentes Direcciones UPN’s

GALERÍA FOTOGRÁFICA

CARRERAS Licenciaturas Maestrías

BIBLIOTECA Catálogo bibliográfico

Servicios escolares Servicio social Servicios culturales Sala de cómputo cafetería

BUZON DE QUEJAS Y SUGERENCIAS Quejas y sugerencias

NOTICIAS Locales Escolares Culturales Varios

CONSULTA Y REGISTRO DE CALIFICACIONES Interfaz de acceso del alumno y administrador. Boleta de calificaciones. Interfaz de ingreso de calificaciones.

Cubo fotográfico

122

IT. CD. VALLES


ANEXO 3. DISEÑO DE NAVEGACIÓN VERSION2

Galería fotográfica

INICIO

Cubo fotográfico

Consulta y registro de calificacion Boleta de calificacion es

Mapa de sitio

UPN 242

Carreras

Noticias UPN

Admisión

Biblioteca


Buzón de quejas y sugerencias

Publicaciones Bienvenida

Unidades UPN


Directorio

Convenios

Licenciaturas

Interfaz de acceso alumnadministrad or

Licenciaturas Noticias escolares

Servicios

Ingreso de calificacion es

Noticias culturales

Correos maestros

Direcciones UPN

Maestrías

Noticias varios

Cafetería

Servicio social


Servicios escolares

Sala de cómputo

Libros

Revistas

Catálogo bibliográfico


Noticias locales

Convocatorias

123

IT. CD. VALLES


ANEXO 4. DISEÑO DE CONTENIDO VERSION 2 Bienvenida


Descripción de componente

Descripcióndetexto Color texto Estilo fuente Tamaño texto Espaciadoenlíneas Color fondo

Fotografíabienvenida Estiloborde Dimensión horizontal Dimensión vertical

Testdemejora Color texto Estilo fuente Tamaño texto Alineación texto Color fondo


Logotipo Posición logotipo tamaño logotipo


124

IT. CD. VALLES


Directorio








UnidadesUPN








125

IT. CD. VALLES


Licenciaturas





Testdemejora

Menú




Maestrías








126

IT. CD. VALLES


Cafetería





Testdemejora

Menú





AdmisiónLicenciaturas








127

IT. CD. VALLES


Saladecómputo





Testdemejora

Menú





Serviciosculturales





Testdemejora

Menú





128

IT. CD. VALLES


Galería fotográfica




Logotipo

Testdemejora

Menú



Posición logotipo Tamaño logotipo

Fotos diversos Estilo borde Dimensión horizontal Dimensión vertical Posición fotografía

Interfaz de acceso alumnoadministrador

Ingresar () Cerrar () Regresar ()


botonesacceso Color texto Estilo fuente Tamaño texto Alineación texto Posición botón Tamaño botón Color fondo


129

IT. CD. VALLES


Boleta de calificaciones

Consultar () Cerrar () Regresar ()


Logotipo

Botonconsulta Color texto Estilo fuente Tamaño texto Alineación texto Posición botón Tamaño botón Color fondo

Posición logotipo Tamaño logotipo

Interfaz de ingreso de calificaciones

Insertar () Guardar () Cerrar ()


Botonguardar Color texto Estilo fuente Tamaño texto Alineación texto Posición botón Tamaño botón Color fondo


130

IT. CD. VALLES


ANEXO 5. DISEÑO DE LA BASE DE DATOS VERSION 2 ALUMNO CARRERA

PK

matricula

FK1 FK3

apellidopat apellidomat nombre nivel clavecarrera clavemateria

PK

clavecarrera

FK1

nombrecarrera clavemateria

ASESORES

MATERIAS PK

clavemateria nombremateria clavecarrera creditos

PK

clavemateria apellidopatase apellidomatase nombreasesor

CALIFICACIONES

FK1

FK2

matricula calificacion observacion periodo tipo clavemateria promedio

131

IT. CD. VALLES


ANEXO 6. PRUEBA DE CONFIGURACIÓN VERSION 2 Prueba del index.php en Internet Explorer con un Sistema Operativo en Windows Vista Home:

132

IT. CD. VALLES


Prueba del index.php en Mozilla Firefox con un Sistema Operativo en Windows XP Profesional Versión 2002:

133

IT. CD. VALLES


ANEXO 7. METRICA ORIENTADA A LA FUNCIÓN VERSION 2

Parámetros De

Factor de Ponderación Cuenta

$

10

Simple

Medio

Complejo

X

3

4

6

=

40

7

X

4

5

7

=

35

31

X

3

4

6

=

124

7

X

7

10

15

=

70

36

X

5

7

10

=

252

medición Números de entradas de usuario Números de salidas de usuario Número de peticiones de usuario Número de archivos Número de interfaces externas

Cuenta Total

521

PF = cuenta-total * [0.65 + 0.01 * 6(Fi)] PF = 521* [0.65 + 0.01 * 6 (Fi)] = 521 [0.65 + 0.01 * 6 (56)] = 521 [0.66 * 336] = 521 [221.76] PF = 115536.96 134

IT. CD. VALLES


13 ÍNDICE DE ILUSTRACIONES Ilustración 1. Organigrama de la UPN Unidad 242. ...............................................9 Ilustración 2. Cuadro comparativo de herramientas.............................................17 Ilustración 3. Modelo PHP. ..................................................................................18 Ilustración 4 Árbol de requisitos de calidad ..........................................................34 Ilustración 5 Pirámide de diseño para la Ingeniería Web. ....................................36 Ilustración 6. El proceso de prueba......................................................................43 Ilustración 7 Prueba de componentes..................................................................61 Ilustración 8 Prueba de componentes versión 2 ..................................................63 Ilustración 9 Prueba de navegación .....................................................................64 Ilustración 10 Prueba navegación versión 2 ........................................................66 Ilustración 11 Comparación de sistemas operativos ............................................69 Ilustración 12 Diferencias entre PostgreSQL y MySQL .......................................70

135

IT. CD. VALLES


14 INDICE ANALÍTICO

ingeniería, ii, 24, 25, 27, 28, 29, 30, 31, 32, 37, 43, 46, 48, 49, 61, 79

A

Internet, 1, 5, 6, 12, 13, 14, 15, 22, 23, 35, 51, 59, 64, 65, 66, 68, 70

Análisis, iv, v, 30, 32, 33, 35, 36, 48, 56, 57, 58, 59, 60, 81,

L

91 Apache, 73

Linux, 54, 73, 84, 88, 102

B BODY, 17, 18, 82

M medición, 30, 126, 145

C

Métrica, 72 Modelo, 21, 33, 34, 147 MySQL, ii, 22, 23, 54, 75, 81, 89, 147

Componente, 65, 66 Configuración, v, vi, 58, 73, 92

N D

Navegación, v, 58, 68, 69

Datos, 75

O

desarrollo, 1, 3, 4, 25, 26, 28, 29, 31, 37, 56, 57, 61, 72, 79, 82, 87, 88, 90, 93, 95, 96, 101

Open Source, 22

Diseño, iii, v, 37, 40, 43, 44, 45, 61, 62, 63, 87, 91, 92

P

F

Portal, i, ii, 3, 4, 5, 6, 13, 14, 15, 18, 21, 50, 51, 52, 53, 54, funcional, 34, 40, 59

55, 56, 58, 59, 60, 61, 62, 63, 64, 65, 66, 68, 69, 71,

H

72, 78, 79, 80, 87, 89, 90, 92, 93, 94, 95, 101, 102, 105, 106, 107, 108

HEAD, 17, 18, 83

Postgresql, 73, 75, 84

HTML, ii, 12, 14, 16, 17, 18, 19, 20, 21, 26, 28, 37, 81, 82,

Proceso, 3, 25 Prueba, iii, iv, v, vi, 45, 47, 48, 49, 64, 65, 66, 68, 69, 71,

83, 88

72, 92, 127, 128, 143, 144, 147

I R Implementación, vi, 73, 78, 87, 89 Requerimientos, 54, 91

136

IT. CD. VALLES


S

UPN, 7, 8, 9, 10, 11, 50, 54, 59, 65, 66, 67, 68, 69, 70, 71, 76, 88, 89, 94, 95, 96, 98, 99, 100, 101, 103, 104, 106,

Servidor, 92

111, 112, 115, 117, 118, 125, 147

Sistema, 35, 54, 73

URL, ii, 15, 16, 24, 84

Sitio, ii, 12, 13, 16

W

Software, 19, 54, 73, 78

U

Web, i, ii, 1, 5, 6, 12, 13, 15, 17, 19, 20, 23, 24, 25, 27, 28, 29, 30, 31, 32, 33, 40, 44, 45, 46, 48, 49, 52, 72, 79,

UML, 1, 32, 34, 52, 79, 84

80, 81, 82, 83, 85, 89, 90, 95, 147 www, 19, 20, 24

137

Desarrollo de Un Portal Con IWeb

Recommend Documents