Tecnologas

Captulo II

Arquitectura de la informacin.

I. Fundamentos de la arquitectura de la informacin.

La seleccin de una arquitectura es determinante y esta influye de manera positiva o negativa en la aplicacin Web desarrollada, considere los siguientes elementos:

Una arquitectura describe una estructura: Acorde a (Bassetal.1998), la arquitectura de software consiste en la descomposicin de las estructuras en componentes, interfaces y relaciones. En este se describen tanto aspectos estticos como dinmicos de un sistema de software, es por ello que puede ser considerado como un plano constructivo de un sistema de software. La arquitectura representa la transicin entre el anlisis e implementacin: Cuando se crea una arquitectura de software, se separan los requerimientos funcionales y los requerimientos de calidad en componentes de software as como sus relaciones e interfaces en un enfoque interactivo.

La siguiente grafica muestra los elementos a ser considerados en una arquitectura de software:

Con estas consideraciones se puede afirmar que una arquitectura de software describe un diseo recurrente a un problema de software en un contexto especfico. La arquitectura describe los componentes participantes, sus responsabilidades, relaciones entre los componentes. Los patrones de diseo posibilitan la reutilizacin de conocimiento de diseo de software consolidado. Las arquitecturas de software se pueden considerar desde las siguientes perspectivas:

Tecnologas

En capas : Sistemas de software que son estructurados en mltiples capas bajo el principio de separacin de los concernientes Aspectos relacionados a los Datos:

Estructurados

Bases de datos relacionales

XML No- Estructurados

Contenidos multimedia

Imgenes, audio, video En particular considere las caractersticas de las aplicaciones Web:

Las aplicaciones Web son ms demandantes que sistemas de software o Evolucin, desempeo, seguridad, crecimiento, disponibilidad

Existe una clara distincin entre infraestructura Web y la arquitectura de la aplicacin Web

Plataformas: o Diversas plataformas como: J2EE, .NET , Apache o Problemas

La utilizacin de diversas plataformas incrementa la complejidad No se tiene uniformidad Inmadurez

Componentes de una arquitectura Web genrica

Cliente: Generalmente un navegador que es controlado por un usuario que utiliza la aplicacin Web

Firewall: Una pieza de software que regula las comunicaciones entre redes inseguras y seguras. Estas comunicaciones son filtradas a travs de reglas de acceso

Proxy: Un proxy es regularmente usado para almacenar pginas Web en cache. Servidor Web: Un servidor Web es una pieza de software que soporta diferentes protocolos

tales como HTTP, HTTPS, etc., para procesar las peticiones de los clientes. Servidor de Base de Datos: Este servidor normalmente proporciona datos en forma

estructurada como son las tablas. Servidores de Multimedia: Este componente es utilizado bsicamente para el envi de

informacin no estructurada como audio o video). Servidor de manejador de contenido: Similar a el servidor de base de datos, un servidor de

manejador de contenido mantiene contenidos que provee a una aplicacin, generalmente en formato XML.

Servidor de aplicacin: Un servidor de aplicaciones mantiene la funcionalidad requerida por diferentes aplicaciones.

Aplicacin legada: Una aplicacin legada es una aplicacin antigua la cual requiere ser integrada como un componente interno o externo

Estos elementos pueden ser observados en la siguiente grafica:

Tecnologas

Una vez mencionados los elementos que estn presentes en una arquitectura genrica, ahora es pertinente considerar diversas arquitecturas de software que son aplicables a aplicaciones Web. Arquitectura 2 Capas Una arquitectura 2 capas provee una estructura de organizacin de diferentes componentes que estn presentes en una arquitectura de una aplicacin. En la siguiente grafica se separan los concernientes a servicios, paginas dinmicas, paginas estticas, lgica de negocio de la aplicacin en mdulos distintos.

Tecnologas

Arquitectura N- Capas Sistemas de software 3 capas frecuentemente son encontrados en aplicaciones Web, en ellos estn presentes las capas:

Capa de Presentacin: En esta se encarga de la interaccin con el usuario y utiliza a la capa de Lgica de Negocio

Capa de Lgica de Negocio: En esta capa reside la lgica principal de la aplicacin, es decir, la funcionalidad que provee el sistema est contenido en esta capa.

Capa de Acceso a Datos: Esta capa es la responsable del acceso a los repositorios de informacin ya sean locales o remotos

Considere la siguiente grafica:

Tecnologas

Como puede observarse, una arquitectura provee una estructura de organizacin de los componentes que estn presentes en una aplicacin Web, estos a su vez estn sujetos a principios tales como la no replicacin de la funcionalidad en otro componente.

Tecnologas

En la grafica anterior puede observarse el modelo Modelo Vista- Controlador MVC esta arquitectura provee mucha versatilidad debido a que propone un modelo nico que resuelve la funcionalidad de la aplicacin, un controlador que sirve de intermediario entre la vista y el modelo y la vista o vistas que se ofrecen al usuario basados que a diferentes tipos de usuario se le provee diferente tipo de informacin, es decir diferentes vistas.

Un elemento adicional en el desarrollo de aplicaciones Web, es el propsito para el cual estas van a ser utilizadas, si son aplicaciones con un alto trfico de informacin en necesario considerar arquitecturas de software orientadas a los datos tales como:

Arquitecturas orientadas al manejo de documentos

Arquitecturas enfocadas a la multimedia

Arquitecturas para el manejo de documentos

Tecnologas

Arquitecturas enfocadas a la Multimedia

Una vez analizadas estas diferentes arquitecturas de software enfocadas a aplicaciones Web, permite realizar la toma de decisiones acerca de las caractersticas y organizacin de las aplicaciones Web.

II. Usabilidad.

Tecnologas

La usabilidad ha tomado recientemente un papel primordial en las aplicaciones de software, todo esto debido a que existen ciertas actividades que hacen necesario replantearse el papel de las interfaces graficas en las aplicaciones, considere lo siguiente:

20% del tiempo de trabajo de las personas en computadoras es utilizado realizando tareas improductivas por ejemplo: resolviendo problemas de impresin

Los usuarios ocupan 16 minutos en promedio ingresando y saliendo de sistemas cada da.

Esto, claramente no es del inters de las organizaciones tener personal con horas de trabajo desperdiciadas.

Estos problemas son ms serios cuando se trata de aplicaciones Web, comercio electrnico, sistemas de distribucin global

Servicios pblicos an siguen utilizndose sobre canales convencionales en lugar de Internet debido al aspecto de la confidencialidad en servicios en lneas o la poca claridad con que presentan la informacin y hace que los usuarios no los utilicen.

Es necesario conocer cules son las necesidades y requerimientos. La Usabilidad ofrece un repertorio extenso de mtodos para satisfacer estas demandas.

Con estas consideraciones en pertinente considerar una definicin del trmino usabilidad:

Usabilidad: El grado en que un producto puede ser utilizado por determinados usuarios dentro de un contexto de uso especfico para lograr objetivos especficos con efectividad, eficiencia y satisfactoriamente

III Estructura de la informacin. Para hacer una buena presentacin Web lo ideal es crear un boceto inicial de la estructura. Con esto solo se procura una presentacin agradable y facilitar la tarea de navegar sino que tambin facilita el mantenimiento de futuras revisiones y modificaciones. Definidos los objetivos, se debe organizar el contenido por temas o secciones, que se ajusten a ellos, reuniendo la informacin relacionad bajo el mismo contexto. Es conveniente que los temas sean razonablemente cortos y si fuera necesario divida en subtemas o agruparlos bajo un encabezado de tema algo ms general, segn sea la necesidad. La estructura de un conjunto de pginas web es muy importante, ya que una buena estructura permitir al lector visualizar todos los contenidos de una manera fcil y clara, mientras que un

Tecnologas

conjunto de pginas web con una mala estructura producir en el lector una sensacin de estar perdido, no encontrar rpidamente lo que busca y terminar por abandonar el sitio. Antes de crear un conjunto de pginas web de debe tener una idea clara de cmo va a ser la estructura de dichas pginas, es conveniente hacer algn esquema sencillo, para la mayora de los casos una hoja de papel y un lapicero bastar, pero si el emplazamiento va a albergar un gran nmero de pginas es recomendable usar algn tipo de programa que permita manejar estructuras de tipo grafo. La estructura depende del contenido, No es lo mismo crear una estructura de navegacin para un sitio que desea publicar informacin al estilo de un libro cuya estructura estar formada por captulos, este tipo de informacin se adapta bastante bien a una estructura lineal como jerrquica. Mientras que un sitio donde se expone un tutorial o un tour es ms apropiada una estructura de tipo lineal. Jerrquica

La estructura jerrquica, es la tpica estructura de rbol, en el que la raz es la hoja de bienvenida, esta hoja se puede tambin sustituir por la hoja de contenido, en la que se exponen las diferentes secciones que contendr nuestro sitio. La seleccin de una seccin nos conduce asimismo a una lista de subtemas que pueden o no dividirse.

Este tipo de organizacin permite al lector conocer en qu lugar de la estructura se encuentra, adems de saber que, con forme se adentra en la estructura obtiene informacin ms especfica y que la informacin ms general se encuentra en los niveles superiores.

Lineal

La estructura lineal es la ms simple de todas, la manera de recorrerla es la misma que si estuvisemos leyendo un libro, de manera que estando en una pgina, podemos ir a la siguiente pgina o a la anterior.

Esta estructura es muy til cuando queremos que el lector siga un camino fijo y guiado, adems impedimos que se distraiga con enlaces a otras pginas. Por otra parte podemos causar a lector la sensacin de estar encerrado si el camino es muy largo o poco interesante.

Tecnologas

Este tipo de estructura sera vlido para tutoriales de aprendizaje o tours de visita guiada.

Lineal con jerarqua

Este tipo de estructura es una mezcla de la dos anteriores, los temas y subtemas estn organizados de una forma jerrquica, pero uno puede leer todo el contenido de una forma lineal si se desea.

Esto permite tener el contenido organizado jerrquicamente y simultneamente poder acceder a toda la informacin de una manera lineal como si estuvisemos leyendo un libro. Esta gua sigue bsicamente este tipo de estructura.

Red

La estructura de red es una organizacin en la que aparentemente no hay ningn orden establecido, las pginas pueden apuntarse unas a otras sin ningn orden aparente.

Este tipo de organizacin es la ms libre, pero tambin es la ms peligrosa ya que si no se informa al lector de en dnde se encuentra, puede perderse o puede no encontrar lo que anda buscando o no llegar a ver lo que le queremos mostrar. Por eso es muy recomendable asociar la estructura de las pginas con alguna estructura conocida, como por ejemplo la de una ciudad.

IV Patrones de diseo web.

Tecnologas

Los patrones de diseo (design patterns) son la base para la bsqueda de soluciones a problemas comunes en el desarrollo de software y otros mbitos referentes al diseo de interaccin o interfaces. Un patrn de diseo es una solucin a un problema de diseo. Para que una solucin sea considerada un patrn debe poseer ciertas caractersticas. Una de ellas es que debe haber comprobado su efectividad resolviendo problemas similares en ocasiones anteriores. Otra es que debe ser reusable, lo que significa que es aplicable a diferentes problemas de diseo en distintas circunstancias. Los patrones de diseo son un conjunto de prcticas de ptimo diseo que se utilizan para abordar problemas recurrentes en la programacin orientada a objetos. El concepto de patrones de diseo fue el resultado de un trabajo realizado por un grupo de 4 personas (Erich Gamma, Richard Helm, Ralph Johnson y John Vlissides, conocidos como "la pandilla de los cuatro") que se public en 1995 en un libro titulado "Patrones de diseo: Elementos de software orientado a objetos reutilizables" en el que se esbozaban 23 patrones de diseo. Un patrn de diseo puede considerarse como un documento que define una estructura de clases que aborda una situacin particular. Los patrones de diseo se dividen en tres grupos principales:

Patrones de creacin: Patrn de Fbrica Abstracta, Patrn Constructor, Patrn del Mtodo de Fabricacin, Patrn Prototipo, Patrn de Instancia nica (Singleton).

Patrones estructurales: Patrn Adaptador, Patrn Puente, Patrn Compuesto, Patrn Decorador, Patrn de Fachada, Patrn de Peso Mosca, Patrn Apoderado.

Patrones funcionales: Patrn de Cadena de Responsabilidad, Patrn de Comando, Patrn Intrprete, Patrn Iterador, Patrn Mediador, Patrn Memento, Patrn Observador, Patrn de Estado, Patrn de Estrategia, Patrn del Mtodo Plantilla, Patrn Visitante.

Algunos patrones son: Strategy Pattern .- El patrn de estrategia es un patrn de diseo de comportamiento que nos permite decidir que curso de accin debera tener un programa, basado en un contexto especfico en tiempo de ejecucin. El programa encapsula dos algoritmos diferentes dentro de dos clases y decide, en tiempo de ejecucin, que estrategia debe seguir. Adapter Pattern, El patrn adaptador es un patrn de diseo estructural que nos permite reutilizar una clase con una interfaz diferente, lo que permite ser utilizada por un sistema que utiliza diferentes mtodos de llamada. Esto tambin nos permite cambiar algunos campos que estn siendo recibidos de la clase cliente, convirtindolos en algo compatible con las funciones adaptadas. Otro trmino para hacer referencia a una clase adaptador es un wrapper o contenedor, lo que bsicamente nos permite envolver (wrapp) acciones en una clase y reusar estas acciones en las situaciones adecuadas. Factory Method Pattern. El patrn mtodo de fbrica es un patrn de diseo creacional que hace exactamente lo siguiente: Es una clase que acta como una fbrica de instancias de objetos. El principal objetivo de este patrn es encapsular el procedimiento creacional que diferentes clases pueden tener, en una slo funcin. Al proporcionar el contexto adecuado al mtodo de fbrica, ste ser capaz de devolver el objeto correcto. Decorator Pattern. El patrn decorador es un patrn de diseo estructural que nos permite aadir comportamientos nuevos, o adicionales, a un objeto en tiempo de ejecucin, dependiendo de la situacin.

Tecnologas

El objetivo es hacerlo de tal manera que las funciones extendidas se puedan aplicar a un caso concreto y, al mismo tiempo, mantener la posibilidad de crear una instancia original que no tienen las nuevas funciones. Tambin permite combinar mltiples decoradores a una instancia, por lo que no hay que trabajar con un decorador para cada instancia. Este patrn es una alternativa a la subclase, la cual crea una clase que hereda funcionalidad de una clase padre. A diferencia de la subclase, que aade el comportamiento en tiempo de compilacin, este patrn nos permite agregar un nuevo comportamiento en tiempo de ejecucin, si la situacin as lo requiere. Singleton Pattern El patrn instancia nica es un patrn de diseo creacional que se asegura de tener una sola instancia de una clase particular durante su tiempo de ejecucin, y proporciona un punto de acceso global a ella. Esto permite configurar un punto de coordinacin para otros objetos que utilicen la instancia singleton; asimismo, las variables singleton siempre sern las mismas y estarn disponibles para todos los dems objetos de la aplicacin, que las llamen. Model-View-Controller design pattern, Patrn MVC (Modelo-Vista-Controlador): es un estilo de arquitectura de software que separa los datos de una aplicacin, la interfaz de usuario, y la lgica de control en tres componentes distintos. El estilo de llamada y retorno MVC (segn CMU), se ve frecuentemente en aplicaciones web, donde la vista es la pgina HTML y el cdigo que provee de datos dinmicos a la pgina. El modelo es el Sistema de Gestin de Base de Datos y la Lgica de negocio, y el controlador es el responsable de recibir los eventos de entrada desde la vista. Proviene del principio de que dos aplicaciones se pueden dividir en tres reas separadas:

Modelo: Esta es la representacin especfica de la informacin con la cual el sistema opera. En resumen, el modelo se limita a lo relativo de la vista y su controlador facilitando las presentaciones visuales complejas. El sistema tambin puede operar con ms datos no relativos a la presentacin, haciendo uso integrado de otras lgicas de negocio y de datos afines con el sistema modelado.

Vista: Este presenta el modelo en un formato adecuado para interactuar, usualmente la interfaz de usuario.

Controlador: Este responde a eventos, usualmente acciones del usuario, e invoca peticiones al modelo y, probablemente, a la vista.

Muchos sistemas informticos utilizan un Sistema de Gestin de Base de Datos para gestionar los datos: en lneas generales del MVC corresponde al modelo. La unin entre capa de presentacin y capa de negocio conocido en el paradigma de la Programacin por capas representara la integracin entre Vista y su correspondiente Controlador de eventos y acceso a datos, MVC no pretende discriminar entre capa de negocio y capa de presentacin pero si pretende separar la capa visual grfica de su correspondiente programacin y acceso a datos, algo que mejora el desarrollo y mantenimiento de la Vista y el Controlador en paralelo, ya que ambos cumplen ciclos de vida muy distintos entre s.

Tecnologas

Bibliografa

Java 2 Interfaces grficas y aplicaciones para internet (2da. Edicin), Ceballos, Francisco Javier, AlfaOmega Ra-Ma

The web designers Idea Book: The Ultimate Guide, Mcneil, Patrick, FW Publications Inc. Principios de seguridad en el comercio electrnico (1era Edicin), Puentes Cairo, Juan

Francisco. AlfaOmega Ra-Ma

Web Applications Design Patters (Interactive Technologies. 1st Ed.), Vora, P. Morgan Kaufmann.

Modelado de datos http://ict.udlap.mx/people/carlos/is341/bases02.html Fecha de consulta: Julio 2010

Temas Web http://www.maestrosdelweb.com/temas/ Fecha de consulta: Julio 2010

Funcionalidad en el diseo web, de origen digital http://es-la.facebook.com/notes/origen-digital/funcionalidad-en-el-diseno-web/134683479876234 Fecha de consulta: Julio 2010

Cmo y Qu Probar en un sitio Web http://www.guiaweb.gob.cl/guia/capitulos/cuatro/queprobar.htm Fecha de consulta: Julio 2010

Diseo de interfaz Interfaz no es slo lo que se ve en la pantalla http://albertolacalle.com/diseno-interfaz.htm

Fecha de consulta: Julio 2010

Diseo de Interfaces de Usuario Usables: Una Gua Rpida para Desarrolladores de Software Libre y de Cdigo Abierto http://mundogeek.net/traducciones/interfaces-usuario-usables/gui.html Fecha de consulta: Julio 2010