UNIDAD 1 Fundamentos de La IWeb

INSTITUTO TECNOLGICO DE CIUDAD VALLES
INGENIERA WEB
UNIDAD 1 FUNDAMENTOS DE LA IWEB
PRESENTA: MTI. ROSA IMELDA GARCA CHI
INGENERA WEB
MTI ROSA IMELDA GARCIA CHI
Introduccin
La World Wide Web y la Internet que la alimentan son, posiblemente los desarrollos ms importantes en la historia de la computacin. Estas tecnologas han llevado a todos (con cientos de millones ms que eventualmente seguirn) a la era de la informtica; adems se han convertido en parte integral de la vida diaria en la primera dcada del siglo XXI
INGENERA WEB
Pueden imaginar un mundo sin la Web?
El crecimiento catico de la tecnologa tiene su origen en otra era:
los primeros das del software
INGENERA WEB
Era una poca de poca disciplina pero enorme entusiasmo y creatividad. Eran tiempos en que los programadores a menudo ingresaban a sistemas en conjunto a veces para bien a veces para mal
La actitud prevaleciente pareca ser:

hazlo rpido y entra en el campo; en el camino se entender qu es lo que realmente se necesita constuir
INGENERA WEB MTI ROSA IMELDA GARCIA CHI
Atributos de los Sistemas y

Aplicaciones basados en Web
INGENIERIA WEB UNIDAD 1
INGENERA WEB
Primeros das de la World Wide Web

Los Sitios Web consistan poco mas de un conjunto de archivos de hipertexto ligados que presentaban informacin mediante texto y grficos limitados.
Conforme el tiempo pas, el HTML aument al desarrollar herramientas (por ejemplo XML, Java) que permitieron a los ingenieros Web ofrecer capacidades de clculo junto con informacin.
Nacieron los sistemas y aplicaciones basados en web (se les referir de manera colectiva como WebApps).
INGENERA WEB
En la actualidad las WebApps han evolucionado en sofisticadas herramientas de computacin que no slo proporcionan funcin por si mismas al usuario final, sino que tambin se han integrado con bases de datos corporativas y aplicaciones de negocios
INGENERA WEB
En la gran mayora de las WebApps se encuentran los siguientes atributos:

Intensidad de red Concurrencia Carga impredecible Desempeo
Disponibilidad
Gobernada por los datos
Sensibilidad al contenido
Evolucin continua
Inmediatez
Seguridad
Esttica
INGENERA WEB
Intensidad de Red
Una WebApp reside en una red y debe satisfacer las necesidades de una variada comunidad de clientes. Una WebApp puede residir en la Internet (y en consecuencia, permitir una comunicacin mundial abierta) Alternativamente, una aplicacin puede colocarse en una Intranet (lo que implementa la comunicacin en una organizacin) o en una Extranet (comunicacin inter-red)
INGENERA WEB
concurrencia
Un gran nmero de usuarios puede tener acceso a la WebApp al mismo tiempo. En muchos casos, los patrones de uso entre los usuarios finales variarn enormemente.
INGENERA WEB
Carga impredecible
El nmero de usuarios de la WebApp puede variar en rdenes de magnitud de da con da.
Un da, por ejemplo el lunes pueden mostrarse 100 usuarios, el martes pueden usar el sistema 10 000.
INGENERA WEB
Desempeo
Si un usuario de WebApp debe esperar demasiado (para ingresar, para procesamiento en el lado del servidor, para formateo y despliegue en el lado del cliente) puede decidir irse a cualquier otra parte
INGENERA WEB
Disponibilidad
Aunque la expectativa de una disponibilidad del total es poco razonable, los usuarios de las WebApps populares con frecuencia demandan acceso sobre una base de 24/7/365 Los usuarios en Australia o Asia pueden demandar acceso durante momentos cuando las tradicionales aplicaciones de software domstico en Norteamrica pueden estar fuera de lnea por mantenimiento.
INGENERA WEB
Gobernada por los datos

La funcin primordial de muchas WebApps es usar hipermedia para presentar contenido de texto, grficos, audio y video al usuario final.
Adems, por lo general, las WebApps se utilizan para tener acceso a informacin que existe en bases de datos que originalmente no eran parte integral del ambiente basado en web (por ejemplo, comercio electrnico o aplicaciones financieras)
INGENERA WEB
Sensibilidad al contenido
La calidad y naturaleza esttica del contenido sigue siendo un importante determinante de la calidad de una WebApp
INGENERA WEB
Evolucin continua
A diferencia del software de aplicacin convencional, que evoluciona a lo largo de una serie de planeadas liberaciones espaciadas cronolgicamente, las aplicaciones Web evolucionan de manera continua.
No es raro que algunas WebApps (especficamente su contenido) se actualicen sobre una agenda minuto a minuto, o que el contenido sea calculado de manera independiente para cada solicitud.
INGENERA WEB
Inmediatez
Aunque la inmediatez la apremiante necesidad de poner software en el mercado rpidamente- es una caracterstica de muchos dominios de aplicacin, las WebApps con frecuencia muestran un tiempo para comercializar que puede ser cuestin de unos cuantos das o semanas.
Los ingenieros Web deben aplicar mtodos de planeacin, anlisis, diseo, implementacin y puesta a prueba que han sido adaptados a los apretados tiempos requeridos para el desarrollo de WebApps
INGENERA WEB
Seguridad
Puesto que las WebApps estn disponibles mediante el acceso a la red, es difcil, si no imposible, limitar la poblacin de usuarios finales que pueden tener acceso a la aplicacin. Con la finalidad de proteger el contenido confidencial y ofrecer modos seguros de transmisin de datos, se deben implementar fuertes medidas de seguridad a lo largo de la infraestructura que sustenta una WebApp y dentro de la aplicacin de la misma.
INGENERA WEB
Esttica
Una parte innegable de la apariencia de una WebApp es su presentacin y la disposicin de sus elementos
Cuando una aplicacin se disea para comercializar o vender productos o ideas, la esttica puede tener tanto que ver con el xito como el diseo tcnico
INGENERA WEB
En el trabajo IWEB es usual encontrar las siguientes categoras de aplicaciones
INGENERA WEB
Informativo
se proporciona contenido de slo lectura con navegacin y enlaces simples

un usuario descarga informacin del servidor apropiado
Descarga
INGENERA WEB
Personalizable
el usuario personaliza el contenido segn sus necesidades especficas
Interaccin
la comunicacin entre una comunidad de usuarios ocurre por medio de cuartos de charla, tableros de anuncios o mensajera instantnea
INGENERA WEB
Entrada del usuario
la entrada con base en formularios es el principal mecanismo para las necesidades de comunicacin
Orientada a transacciones
el usuario hace una solicitud (por ejemplo, realiza un pedido)que ejecuta la WebApp
INGENERA WEB
Orientada a servicios Portal
la aplicacin proporciona un servicio al usuario; por ejemplo, lo asesora en la determinacin del pago de una hipoteca
la aplicacin canaliza al usuario hacia otro contenido o servicios web fuera del dominio del portal de la aplicacin
INGENERA WEB
Acceso a una base de datos
el usuario consulta una gran base de datos y extrae informacin el usuario consulta una coleccin de grandes bases de datos y extrae informacin
Almacn de datos
INGENERA WEB
Tarea GLOSARIO en la Plataforma Moodle
Comercio electrnico o e-commerce Negocios electrnicos o E-bussines Intranet, internet y extranet Pgina web, Sitio web y Portal web
INGENERA WEB
Atributos de CALIDAD en una WebApp

INGENERA WEB
Atributos de Calidad
Todas las personas que hayan navegado alguna vez por la Web o hayan utilizado una intranet de una compaa pueden opinar sobre lo que hace una buena WebApp. Los puntos de vista individuales varan enormemente.
Algunos usuarios disfrutan con grficos llamativos, en cambio otros solo quieren un texto sencillo.
Algunos exigen informacin copiosa, otros desean una presentacin abreviada. En efecto, la percepcin de lo bueno por parte del usuario (y como consecuencia, la aceptacin o no aceptacin resultante de la WebApp) podra ser ms importante que cualquier discusin tcnica sobre la calidad de la WebApp.
Pero cmo se percibe la calidad de la WebApp?
Qu atributos deben de exhibirse ante los ojos de los usuarios para lograr lo bueno y al mismo tiempo exhibir las caractersticas tcnicas de calidad que permitan a un ingeniero corregir, adaptar, mejorar y soportar la aplicacin a largo plazo?
INGENERA WEB
En realidad, todas las caractersticas generales de la calidad del software se aplican tambin a las WebApps.
Sin embargo, las caractersticas ms relevantes -usabilidad, fiabilidad, eficiencia y capacidad de mantenimiento- proporcionan una base til para evaluar la calidad de los sistemas basados en Web.
INGENERA WEB
INGENERA WEB
Estratos de la Ingeniera Web

INGENERA WEB
El desarrollo de sistemas y aplicaciones basados en Web incorpora modelos de proceso especializados, mtodos de ingeniera del software adaptados a las caractersticas del desarrollo de WebApps y un conjunto de importantes tecnologas habilitadoras.
INGENERA WEB
Los procesos, mtodos y tecnologas (herramientas) proporcionan un enfoque en estratos de la IWEB que es conceptualmente idntico a los estratos de la ingeniera de software
INGENERA WEB
INGENERA WEB
PROCESO IWEB
INGENERA WEB
INGENERA WEB
Proceso de Ingeniera Web

Pressman sugiere un proceso de ingeniera web compuesto por las siguientes fases:
INGENERA WEB
INGENERA WEB
Planteamiento y formulacin
Identificamos los objetivos de nuestra aplicacin, y delimitamos el alcance de la primera iteracin.
INGENERA WEB
INGENERA WEB
Planificacin
Una vez planteado el problema,
Recordemos que en la planeacin iterativa solamente se detalla la iteracin actual,
y las iteraciones subsecuentes slo se plantean de forma general.
podremo s estimar costos,
riesgos
esfuerzo durante el desarrollo
INGENERA WEB
INGENERA WEB
Anlisis
los requerimientos tcnicos, grficos, y de contenido, que incorporaremos en la iteracin.
Durante esta etapa establecemos
INGENERA WEB
Anlisis
Los conceptos y principios que se trataron para el anlisis de los requisitos del software se aplican sin revisin en la actividad de anlisis de ingeniera Web. Para crear un modelo de anlisis completo para la WebApp se elabora el mbito definido durante la actividad de formulacin.
Durante la Iweb se realizan cuatro tipos de anlisis diferentes:
INGENERA WEB
Anlisis del contenido Anlisis de la interaccin Anlisis funcional
Anlisis de la configuracin
INGENERA WEB
Anlisis del contenido
INGENERA WEB
Anlisis del contenido

Para identificar y describir cada uno de los objetos de datos que se van a utilizar dentro de la WebApp se puede utilizar el modelado de datos.
Se trata de la identificacin del espectro completo de contenido que se va a proporcionar.
En el contenido se incluyen datos de texto, grficos, imgenes, vdeo y sonido.
INGENERA WEB
Anlisis de la Interaccin
INGENERA WEB
Anlisis de la interaccin
Se trata de la descripcin detallada de la interaccin del usuario y la WebApp.
Para proporcionar descripciones detalladas de esta interaccin se pueden desarrollar casos prcticos.
INGENERA WEB
Anlisis Funcional
INGENERA WEB
Anlisis funcional
Los escenarios de utilizacin (casos de uso) creados como parte del anlisis de interaccin definen las operaciones que se aplicarn en el contenido de la WebApp e implicarn otras funciones de procesamiento.
Aqu se realiza una descripcin detallada de todas las funciones y operaciones.
INGENERA WEB
Anlisis de la Configuracin
INGENERA WEB
Anlisis de la configuracin
Se efecta una descripcin detallada del entorno y de la infraestructura en donde reside la WebApp.
La WebApp puede residir en Internet, en una intranet o en una Extranet. Adems, se deber identificar la infraestructura (es decir, la infraestructura de los componentes y el grado de utilizacin de la base de datos para generar el contenido) de la WebApp.
INGENERA WEB
Aun cuando se recomienda una especificacin detallada de los requisitos para WebApps grandes y complejas, tales documentos no son los usuales. Se puede decir que la continua evolucin de los requisitos de la WebApp puede hacer que cualquier documento se quede obsoleto antes de finalizarse.
Aunque se puede decir que esto sucede de verdad, es necesario definir un modelo de anlisis que pueda funcionar como fundamento de la siguiente actividad de diseo.
Como mnimo, la informacin recogida durante las cuatro tareas de anlisis anteriores deber ser revisada, modificada a peticin, y organizada para formar un documento que pueda pasarse a los diseadores de WebApps.
INGENERA WEB
INGENERA WEB
Ingeniera
La actividad de ingeniera incorpora dos grupos de tareas que se realizan en paralelo:
el diseo del contenido y la produccin, se enfocan en el diseo, produccin y adquisicin del contenido de texto, grfico y video que se vayan a integrar en la aplicacin.
Estas tareas son realizadas por personal no tcnico. Por otro lado, estn el diseo arquitectnico, de navegacin e interfaz, el cual lidia con los aspectos tcnicos.
INGENERA WEB
Diseo del contenido
INGENERA WEB
Diseo para aplicaciones basada en web

La naturaleza de inmediatez de las aplicaciones basadas en Web unida a la presin de evolucionar continuamente obliga a que un ingeniero establezca un diseo que resuelva el problema comercial inmediato, mientras que al mismo tiempo obliga a definir una arquitectura de aplicacin que tenga la habilidad de evolucionar rpidamente con el tiempo.
El problema, desde luego, es que resolver (rpidamente) el problema inmediato puede dar como resultado compromisos que afectan a la habilidad que tiene la aplicacin de evolucionar con el paso del tiempo.
INGENERA WEB
Con objeto de realizar un diseo eficaz basado en Web, el ingeniero deber trabajar reutilizando cuatro elementos tcnicos:
Principios y mtodos de diseo Reglas de oro Configuraciones de diseo Plantillas

Principios y mtodos de diseo

Es importante destacar que los conceptos y principios del diseo se aplican a todas las WebApps.
La modularidad eficaz (exhibida con una cohesin alta y con un acoplamiento bajo), la elaboracin paso a paso, y cualquier otra heurstica de diseo del software conducir a sistemas y aplicaciones basados en Web ms fciles de adaptar, mejorar, probar y utilizar.
INGENERA WEB
Cuando se crean aplicaciones Web se pueden reutilizar los mtodos de diseo que se utilizan para los sistemas orientados a objetos.
La hipermedia define objetos que interactan mediante un protocolo de comunicacin algo similar a la mensajera. De hecho, la notacin de diagramas propuesta por UML puede adaptarse y utilizarse durante las actividades de diseo de las WebApps.
Adems, se han propuesto otros hipermedios de mtodos de diseo
INGENERA WEB
Reglas de oro
Las aplicaciones hipermedia interactivas (WebApps) llevan construyndose ya hace una dcada.
Durante ese tiempo, los diseadores han desarrollado un conjunto de heursticas de diseo (reglas de oro) que se podrn volver a aplicar durante el diseo de aplicaciones nuevas.
INGENERA WEB
Configuraciones de diseo
Las configuraciones de diseo son un enfoque genrico para resolver pequeos problemas que se pueden adaptar a una variedad ms amplia de problemas especficos. En el contexto de las WebApps, las configuraciones de diseo se pueden aplicar no solo a los elementos funcionales de una aplicacin, sino tambin a los documentos, grficos y esttica general de un sitio Web.
INGENERA WEB
Plantillas
Las plantillas se pueden utilizar para proporcionar un marco de trabajo esquemtico de cualquier configuracin de diseo o documento a utilizar dentro de una WebApp.
Nanard y Kahn describen este elemento de diseo reutilizable de la siguiente manera:
INGENERA WEB
INGENERA WEB
Una vez que se ha especificado una plantilla, cualquier parte de una estructura hipermedia que se acopla a esta plantilla se podr generar o actualizar automticamente llamando solamente a la plantilla con datos relevantes [para dar cuerpo al esquema]. La utilizacin de plantillas constructivas depende implcitamente del contenido separado de los documentos hipermedia, de la especificacin y de su presentacin:
los datos fuente se organizan en la estructura del hipertexto tal y como se especifica en la plantilla
INGENERA WEB
Diseo Arquitectnico
INGENERA WEB
Diseo arquitectnico
El diseo arquitectnico para los sistemas y aplicaciones basados en Web se centra en la definicin de la estructura global hipermedia para la WebApp, y en la aplicacin de las configuraciones de diseo y plantillas constructivas para popularizar la estructura (y lograr la reutilizacin).
Una actividad paralela, llamada diseo del contenido, deriva la estructura y el formato detallados del contenido de la informacin que se presentar como parte de la WebApp.
INGENERA WEB
Estructuras de las WebApps

La estructura arquitectnica global va unida a las metas establecidas para una WebApp, al contenido que se va a presentar, a los usuarios que la visitarn y a la filosofa de navegacin establecidos. Cuando el encargado de la arquitectura va a realizar el diseo de una WebApp tpica puede elegir entre cuatro fuentes diferentes.
INGENERA WEB
Las estructuras lineales

Aparecen cuando es comn la sucesin predecible de interacciones (con alguna variacin o diversificacin).
Un ejemplo clsico podra ser la presentacin de un manual de usuario en la que las pginas de informacin se presentan con grficos relacionados, vdeos cortos o sonido solo despus de haber presentado un prerrequisito.
La sucesin de presentacin del contenido queda predefinida y se puede decir que, generalmente, es lineal.
INGENERA WEB
A medida que el contenido y el procesamiento crecen en complicacin, el flujo puramente lineal que se muestra a la derecha da como resultado estructuras lineales ms sofisticadas en las que se puede invocar el contenido alternativo, o en donde tiene lugar una desviacin para adquirir un contenido complementario
INGENERA WEB
INGENERA WEB
Las estructuras reticulares

Son una opcin arquitectnica que puede aplicarse cuando el contenido de la WebApp puede ser organizado categricamente en dos dimensiones (o ms). Por ejemplo, consideremos una situacin en la que un sitio de comercio electrnico vende palos de golf. La dimensin horizontal de la retcula representa el tipo de palo en venta (por ejemplo, maderas, hierros, wedges, putters). La dimensin vertical representa la oferta proporcionada por los fabricantes de palos de golf.
INGENERA WEB
De aqu que un usuario pueda navegar por la retcula horizontalmente para encontrar la columna de los putters, y recorrer la columna para examinar las ofertas proporcionadas por los vendedores de putters.
Esta arquitectura WebApp es de utilidad solo cuando se encuentra un contenido muy regular.
INGENERA WEB
INGENERA WEB
Las estructuras jerrquicas
Son sin duda la arquitectura WebApp ms comn.
A diferencia de la divisin de jerarquas de software, que fomentan el flujo de control solo a lo largo de las ramas verticales de la jerarqua, se podr disear una estructura jerrquica de la WebApp para posibilitar (por medio de la ramificacin de hipertexto) el flujo de control en horizontal atravesando las ramas verticales de la estructura.
INGENERA WEB
Por tanto, el contenido presentado en la rama del extremo izquierdo de la jerarqua puede tener enlaces de hipertexto que lleven al contenido que existe en medio de la rama derecha de la estructura.
Sin embargo, debera de destacarse que aunque dicha rama permita una navegacin rpida por el contenido de la WebApp, puede originar tambin confusin por parte del usuario.
INGENERA WEB
INGENERA WEB
Una estructura en red o de web pura

se asemeja en muchos aspectos a la arquitectura en evolucin para los sistemas orientados a objetos. Los componentes arquitectnicos (en este caso las pginas Web) se disean de forma que pueden pasar el control (mediante enlaces de hipertexto) a otros componentes del sistema. Este enfoque permite una flexibilidad de navegacin considerable, aun cuando puede resultar confuso para el usuario.
INGENERA WEB
INGENERA WEB
Patrones de diseo
Los patrones de diseo son un buen mtodo para resolver pequeos problemas que pueden adaptarse a una variedad mucho ms amplia de problemas especficos. En el contexto de los sistemas y aplicaciones basados en Web, los patrones de diseo pueden aplicarse en el nivel jerrquico, nivel de componentes y nivel de hipertexto (de navegacin).
INGENERA WEB
Cuando dentro de una WebApp se requiere la funcionalidad del proceso de datos, pueden aplicarse los patrones de diseos arquitectnicos a nivel de componentes.
Los patrones de diseo a nivel de hipertexto se centran en el diseo de las caractersticas de navegacin que permiten al usuario moverse por el contenido de la WebApp fcilmente.
Entre muchos de los patrones de diseo de hipertexto propuestos se encuentran los siguientes:
INGENERA WEB
Ciclo:
una configuracin que devuelve al usuario al nodo de contenido visitado anteriormente.
Anillo de Web:
una configuracin que implementa un gran ciclo que enlaza hipertextos enteros viajando por un tema.
Contorno:
un patrn que aparece cuando varios ciclos inciden en otro, permitiendo navegar por rutas definidas por los ciclos.
INGENERA WEB
Contrapunto:
un patrn que aade comentarios de hipertexto interrumpiendo la narrativa del contenido para proporcionar ms informacin o ms indagacin.
Mundo de espejo:
el contenido se presenta utilizando diferentes hilos narrativos, cada uno con un punto de vista o perspectiva diferente. Por ejemplo, el contenido que describe una computadora personal podra permitir al usuario seleccionar una narrativa tcnica o no tcnica que describa la mquina.
INGENERA WEB
Tamiz:
una configuracin que va guiando al usuario a travs de una serie de opciones (decisiones) con el fin de llevar al usuario a un contenido especfico e indicado por la sucesin de opciones elegidas o decisiones tomadas.
Vecindario:
una configuracin que abarca un marco de navegacin uniforme por todas las pginas Web para permitir que un usuario tenga una gua de navegacin consecuente independientemente de la localizacin de la WebApp.
INGENERA WEB
Diseo de navegacin
INGENERA WEB
Diseo de navegacin
Una vez establecida una arquitectura de WebApp, una vez identificados los componentes (pginas, guiones applets y otras funciones de proceso) de la arquitectura, el diseador deber definir las rutas de navegacin que permitan al usuario acceder al contenido y a los servicios de la WebApp.
INGENERA WEB
Para que el diseador pueda llevarlo a cabo, debe

(1) identificar la semntica de la navegacin para diferentes usuarios del sitio; y (2) definir la mecnica (sintaxis) para lograr la navegacin.
Generalmente una WebApp grande tendr una variedad de roles de usuarios diferentes.
INGENERA WEB
Por ejemplo, los roles podran ser el de
visitante, cliente registrado o cliente privilegiado.
Cada uno de estos roles se pueden asociar a
diferentes niveles de acceso al contenido y de servicios diferentes.
Un visitante puede tener mientras que un cliente registrado puede acceso slo a un contenido tener acceso a una variedad mucho ms limitado, amplia de informacin y de servicios.
La semntica de la navegacin de cada uno de estos roles
seran diferentes.
INGENERA WEB
El diseador de WebApps crea una unidad semntica de navegacin (USN) para cada una de las metas asociadas a cada uno de los roles de usuario.
Por ejemplo, un cliente registrado puede tener seis metas diferentes, todas ellas con un acceso a informacin y servicios diferentes.
Para cada meta se crea una USN.
INGENERA WEB
Gnaho y Larcher describen la USN de la siguiente manera:

La estructura de una USN se compone de un conjunto de subestructuras de navegacin
que llamarnos formas de navegacin [WoN (Ways of navigating)]. Una WoN representa la mejor forma de navegacin o ruta para que usuarios con ciertos perfiles logren su meta o submeta deseada.
Por tanto, el concepto de WoN

se asocia al concepto de Perfil de Usuario.
La estructura de una WoN se compone de un conjunto de nodos de navegacin (NN) relevantes conectados a enlaces de navegacin,
entre los que algunas veces se incluyen las USNs.

Eso significa que las USNs pueden agregarse para formar una USN de nivel superior,
o anidarse en cualquier nivel de profundidad.

Durante las etapas iniciales del diseo de navegacin, para determinar una o ms WoNs para cada meta de usuario, se evaluar la estructura de la WebApp (arquitectura y componentes).
Como se ha destacado anteriormente, una WoN identifica los nodos de navegacin (por ejemplo, pginas Web), y entonces los enlaces que hacen posible la navegacin entre ellos.
La WoN entonces se organiza en USNs
INGENERA WEB
A medida que avanza el diseo, se va identificando la mecnica de cada enlace de navegacin.
Entre otras muchas opciones se encuentran los enlaces basados en texto, iconos, botones, interruptores y metforas grficas.
INGENERA WEB
El diseador deber elegir los enlaces de navegacin adecuados para el contenido y consecuentes con la heurstica que conduce al diseo de una interfaz de alta calidad.
Adems de elegir la mecnica de navegacin, el diseador tambin deber establecer las convenciones y ayudas adecuadas.
Por ejemplo, los iconos y los enlaces grficos debern tener un aspecto clickable (capacidad de accederse) con los bordes biselados, y dar as una imagen en tres dimensiones.
INGENERA WEB
La realimentacin visual o de sonido se deber disear para proporcionar al usuario una indicacin de que se ha elegido una opcin de navegacin.
Para la navegacin basada en texto, se deber utilizar el color que indica los enlaces de navegacin y proporcionar una indicacin de los enlaces por los que se ha navegado.
Estas son solo unas pocas convenciones de las docenas que hacen que la navegacin por la red sea agradable.
Adems de las convenciones, en este punto tambin se debern disear ayudas de navegacin tales como mapas de sitios, tablas de contenidos, mecanismos de bsqueda y servicios dinmicos de ayuda
INGENERA WEB
Diseo de interfaz
INGENERA WEB
Diseo de interfaz
La interfaz de usuario de una WebApp es la primera impresin. Independientemente del valor del contenido, la sofisticacin de las capacidades, los servicios de procesamiento y el beneficio global de la WebApp en s, una interfaz con un diseo pobre decepcionar al usuario potencial y podr de hecho hacer que el usuario se vaya a cualquier otro sitio.
INGENERA WEB
Dado el gran volumen de WebApps que compiten virtualmente en todas las reas temticas, la interfaz debe arrastrar inmediatamente al usuario potencial.
Nielsen y Wagner sugieren unas cuantas lneas generales y sencillas en el rediseo de una WebApp:
INGENERA WEB
Probabilidad de que los errores del servidor, incluso los ms pequeos, hagan que el usuario abandone el sitio Web y busque informacin y servicios en algn otro sitio. La velocidad de lectura del monitor de una computadora es aproximadamente un 25 por 100 ms lento que leer una copia impresa.
Por tanto, no hay que obligar al usuario a leer cantidades voluminosas de texto, particularmente cuando el texto explica la operacin de la WebApp o ayuda a navegar por la red.
INGENERA WEB
Evite los smbolos bajo construccin levantan expectacin y provocan un enlace innecesario que seguramente sea decepcionante.
Los usuarios prefieren no tener que recorrer la pantalla.
Dentro de las dimensiones normales de una ventana del navegador se deber incluir informacin importante.
INGENERA WEB
Los mens de navegacin y las barras de cabecera se debern disear consecuentemente y debern estar disponibles en todas las pginas a las que el usuario tenga acceso.
El diseo no deber depender de las funciones del navegador para ayudar en la navegacin.
La esttica nunca deber sustituir la funcionalidad.
INGENERA WEB
Por ejemplo, un botn sencillo podra ser una opcin de navegacin mejor que una imagen o icono estticamente agradables, pero vagos cuya intencin no es muy clara.
Las opciones de navegacin debern ser obvias, incluso para el usuario casual.
El usuario deber buscar la pantalla para determinar cmo enlazar con otro contenido o servicio.
No tiene que ser necesariamente deslumbrante, pero deber estar siempre bien estructurada y ergonmica.
Una interfaz bien diseada mejora la percepcin del contenido o de los servicios del usuario que proporciona el sitio Web.
INGENERA WEB
INGENERA WEB
Generacin de pginas y pruebas

Se prueba que el contenido dinmico se genere correctamente, utilizando las plantillas, interfaces y contenidos diseados en la fase de ingeniera. Posteriormente se realizan las pruebas pertinentes, que dependern del tipo de aplicacin y requerimientos no funcionales (por ejemplo, pruebas de desempeo, etctera).
INGENERA WEB
Pruebas de las aplicaciones basadas en web
INGENERA WEB
Pruebas de las aplicaciones basadas en web
El enfoque de las pruebas de las WebApps adopta los principios bsicos de todas las pruebas del software y aplica estrategias y tcticas que ya han sido recomendadas para los sistemas orientados a objetos.
Este enfoque se resume en los pasos siguientes:
INGENERA WEB
El modelo de contenido de la WebApp es revisado para descubrir errores.

Esta actividad de prueba se asemeja en muchos aspectos a la de un corrector ortogrfico de un documento escrito. De hecho, un sitio Web grande tendr la capacidad de construir un listado de los servicios de correctores profesionales para descubrir errores tipogrficos, errores gramaticales, errores en la consistencia del contenido, errores en representaciones grficas y de referencias cruzadas.
INGENERA WEB
2. El modelo de diseo para la WebApp es revisado para descubrir errores de navegacin.

Los casos prcticos derivados como parte de la actividad de anlisis permiten que un ingeniero Web ejercite cada escenario de utilizacin frente al diseo arquitectnico y de navegacin. En esencia, estas pruebas no ejecutables ayudan a descubrir errores en la navegacin (por ejemplo, un caso en donde el usuario no pueda leer un nodo de navegacin). Adems, los enlaces de navegacin son revisados para asegurar su correspondencia con los especificados en cada USN del rol de usuario.
INGENERA WEB
3. Se aplican pruebas de unidad a los componentes de proceso seleccionados y las pginas Web.
Cuando lo que se tiene en consideracin es el tema de las WebApps el concepto de unidad cambia. Cada una de las pginas Web encapsular el contenido, los enlaces de navegacin y los elementos de procesamiento (formularios, guiones, applets). No siempre es posible o prctico comprobar cada una de las caractersticas individualmente. En muchos casos, la unidad comprobable ms pequea es la pgina Web. A diferencia de la comprobacin de unidades de software convencional, que tiende a centrarse en el detalle algortmico de un mdulo y los datos que fluyen por la interfaz del mdulo, la comprobacin por pginas se controla mediante el contenido, proceso y enlaces encapsulados por la pgina Web.
INGENERA WEB
4. Se construye la arquitectura, se realizan las pruebas de integracin.

La estrategia para la prueba de integracin depende de la arquitectura que se haya elegido para la WebApp. Si la WebApp se ha diseado con una estructura jerrquica lineal, reticular o sencilla, es posible integrar pginas Web de una manera muy similar a como se integran los mdulos del software convencional. Sin embargo, si se utiliza una jerarqua mezclada o una arquitectura de red (Web), la prueba de integracin es similar al enfoque utilizado para los sistemas OO. La comprobacin basada en hilos se puede utilizar para integrar un conjunto de pginas Web (se puede utilizar una USN para definir el conjunto adecuado) que se requiere para responder a un suceso de usuario. Cada hilo se integra y se prueba individualmente. La prueba de regresin se aplica para asegurar que no haya efectos secundarios. La comprobacin de agrupamientos integra un conjunto de pginas colaborativas (determinadas examinando los casos prcticos y la USN). Los casos de prueba se derivan para descubrir errores en las colaboraciones.
INGENERA WEB
5. La WebApp ensamblada se prueba para conseguir una funcionalidad global y un contenido.

Al igual que la validacin convencional, la validacin de los sistemas y aplicaciones basados en Web se centra en acciones visibles del usuario y en salidas reconocibles para el usuario que procedan del sistema. Para ayudar en la derivacin de las pruebas de validacin, las pruebas debern basarse en casos prcticos. El caso prctico proporciona un escenario con una probabilidad alta de descubrir errores en los requisitos de interaccin del usuario
INGENERA WEB
6. La WebApp se implementa en una variedad de configuraciones diferentes de entornos y comprobar as la compatibilidad con cada configuracin.
Se crea una matriz de referencias cruzadas que define todos los sistemas operativos probables, plataformas de hardware para navegadores y protocolos de comunicacin. Entonces se llevan a cabo pruebas para descubrir los errores asociados con todas y cada una de las configuraciones posibles
INGENERA WEB
7. La WebApp se comprueba con una poblacin de usuarios finales controlada y monitorizada. Se selecciona un grupo de usuarios que abarque todos los roles posibles de usuarios.
La WebApp se pone en prctica con estos usuarios y se evalan los resultados de su interaccin con el sistema para ver los errores de contenido y de navegacin, los intereses en usabilidad, compatibilidad, fiabilidad y rendimiento de la WebApp. Dado que muchas WebApps estn en constante evolucin, el proceso de comprobacin es una actividad continua, dirigida por un personal de apoyo a la Web que utiliza pruebas de regresin derivadas de pruebas desarrolladas cuando se cre la WebApp.
INGENERA WEB
Problemas de gestin
Dada la inmediatez de las WebApps, sera razonable preguntarse:

necesito realmente invertir tiempo esforzndome con la WebApp?
no debera dejarse que la WebApp evolucionara de forma natural, con poca o ninguna gestin explcita?
Muchos diseadores de Webs optaran por gestionar poco o nada, pero eso no hace que estn en lo cierto.
La ingeniera Web es una actividad tcnica complicada.
INGENERA WEB
Hay muchas personas implicadas, y a menudo trabajando en paralelo.

La combinacin de tareas tcnicas y no tcnicas que deben de tener lugar (a tiempo y dentro del presupuesto) para producir una WebApp de alta calidad representa un reto para cualquier grupo de profesionales.
Con el fin de evitar cualquier confusin, frustracin y fallo, se deber poner en accin una planificacin, tener en cuenta los riesgos, establecer y rastrear una planificacin temporal y definir los controles.
Estas son las actividades clave que constituyen lo que se conoce como gestin de proyectos.
INGENERA WEB
INGENERA WEB
Evaluacin del cliente
Al final de cada iteracin se debe realizar una evaluacin con el cliente, para validar el avance y determinar los cambios o mejoras en caso de ser necesarios, que se aplicarn en las siguientes iteraciones.
INGENERA WEB
No reinventar la rueda
INGENERA WEB
Una regla de oro en el desarrollo de cualquier tipo de aplicacin es: no reinventar la rueda.
Tal vez algo que agregaramos al proceso sugerido por Pressmann, sera incorporar actividades especficas para evaluar cules de los componentes que ya existen se pueden reutilizar.
INGENERA WEB
Esto es porqu en el ambiente web existen muchos frameworks y engines

que se pueden adaptar fcilmente a nuestras necesidades.
Por ejemplo: prcticamente todos los websites y portales modernos

utilizan un CMS (Content Management System).
As que antes de lanzarnos a desarrollar desde cero,

echemos un vistazo a los elementos existentes tanto dentro como fuera de nuestra organizacin.
INGENERA WEB

UNIDAD 1 Fundamentos de La IWeb

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

UNIDAD 1 Fundamentos de La IWeb

Uploaded by

Copyright:

Available Formats

INSTITUTO TECNOLGICO DE CIUDAD VALLES

PRESENTA: MTI. ROSA IMELDA GARCA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

Pueden imaginar un mundo sin la Web?

El crecimiento catico de la tecnologa tiene su origen en otra era:

los primeros das del software

MTI ROSA IMELDA GARCIA CHI

La actitud prevaleciente pareca ser:

Atributos de los Sistemas y

INGENIERIA WEB UNIDAD 1

MTI ROSA IMELDA GARCIA CHI

Primeros das de la World Wide Web

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

En la gran mayora de las WebApps se encuentran los siguientes atributos:

Gobernada por los datos

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

El nmero de usuarios de la WebApp puede variar en rdenes de magnitud de da con da.

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

Gobernada por los datos

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

En el trabajo IWEB es usual encontrar las siguientes categoras de aplicaciones

MTI ROSA IMELDA GARCIA CHI

se proporciona contenido de slo lectura con navegacin y enlaces simples

MTI ROSA IMELDA GARCIA CHI

el usuario personaliza el contenido segn sus necesidades especficas

MTI ROSA IMELDA GARCIA CHI

Entrada del usuario

MTI ROSA IMELDA GARCIA CHI

Orientada a servicios Portal

MTI ROSA IMELDA GARCIA CHI

Acceso a una base de datos

MTI ROSA IMELDA GARCIA CHI

Tarea GLOSARIO en la Plataforma Moodle

MTI ROSA IMELDA GARCIA CHI

Atributos de CALIDAD en una WebApp

MTI ROSA IMELDA GARCIA CHI

Pero cmo se percibe la calidad de la WebApp?

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

Estratos de la Ingeniera Web

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

Proceso de Ingeniera Web

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

MTI ROSA IMELDA GARCIA CHI

podremo s estimar costos,