WebScan Aplicación Web para la Navegación mediante Barrido Eric Noam Rodriguez Suazo.

Presentación del tema: "WebScan Aplicación Web para la Navegación mediante Barrido Eric Noam Rodriguez Suazo."— Transcripción de la presentación:

1 WebScan Aplicación Web para la Navegación mediante Barrido Eric Noam Rodriguez Suazo

2 Antecedente (I) Emulador de teclado. Emulador de ratón. Acceso a las aplicaciones de Windows. Acceso a Internet en distintos SO. WebCrawler y AWAKE.

3 Antecedente (II) Usan un mecanismo alternativo de entrada: un pulsador binario. Proporcionan un método alternativo de selección a través del barrido de sus elementos. Esta entrada es transparente al sistema ya que éste no puede distinguir entre una entrada estándar y una emulada.

4 Antecedente (III) La idea principal detrás de este concepto es proporcionar una Interfaz Gráfica de Usuario (GUI) en la cual todos sus elementos son seleccionados o enfocados uno a uno de modo que, cuando el elemento deseado es iluminado (destacado), todo lo que el usuario debe hacer es accionar el pulsador.

5 WebCrawler y AWAKE

6 Desventajas de los Navegadores Alternativos (I) La mayoría no soportan lenguajes basados en guiones. JavaScript VBScript A medida aparecen nuevas versiones de estos lenguajes, más difícil es mantenerlos actualizados. Los desarrolladores de los navegadores estándar desarrollan sus propias versiones.

7 Desventajas de los Navegadores Alternativos (II) Lo mismo sucede con los objetos incrustados. Flash Applets Java No incluyen las características de accesibilidad que presentan los navegadores estándar (ó hace falta desarrollarlas). Sticky Keys Filter Keys Alto Contraste

8 Desventajas de los Navegadores Alternativos (III) Problemas con elementos complejos del HTML. Marcos CSS Re-direccionamientos Interfaz para la transferencia serial del pulsador.

9 Demandas Proveer acceso a Internet a personas con impedimentos físicos severos. Personas que no pueden o que tienen dificultades operando un ratón o un teclado. Resolver el problema de interacción humano- ordenador: Utiliza un pulsador binario como dispositivo de entrada y utiliza el barrido como método de selección. Facilita la navegación a través de enlaces, extrayéndolos y presentándolos de forma accesible para ser barridos. Ser multi-plataforma y multi-navegador. Que sea extensible y adaptable.

10 Enfoque Propuesto En lugar de desarrollar un navegador, independiente, aprovechar las características estándar de accesibilidad de los navegadores comunes, así como sus motores de interpretación HTML, CSS, JavaScript, etc., de modo que solo sea necesario implantar el comportamiento de barrido y la utilización del pulsador sobre estos.

11 ¿Cómo? Haciendo uso de la tecnología Java que permiten crear Aplicaciones Web de gran flexibilidad. Concretamente: JSP y Servlets. Además, algunas de las operaciones se llevan a cabo mediante el uso de JavaScript y las Hojas de Estilo en Cascada.

12 ¿Que son las Aplicaciones Web? Son aplicaciones comunes con la simple excepción de que estas corren dentro de un Servidor Web. Utilizan la Web como mecanismo de transmisión de información entre la aplicación y el usuario. El navegador Web constituye su interfaz primaria de usuario. Los navegadores son el estándar de facto y multiplataforma para acceder a la información en la Web.

13 Páginas de Servidor Java (JSP) Tecnología basada en Java para desarrollar contenido Web dinámico. HTML tradicional (estático) junto con código Java que corre en el servidor. Interactúan con los Servlets.

14 Java Servlets Los Servlets son pequeñas aplicaciones Java que le añaden funcionalidades dinámicas a los servidores Web. Dado que operan dentro del dominio del servidor: no necesitan que el navegador utilizado soporte Java. Son portables: Distintos Sistemas Operativos Distintos Servidores Web

15 Desarrollo Se divide en 3 módulos: Modulo de Navegación: responsable de la navegación a través de la Web. Se ocupa de la recuperación y manipulación de documentos Web. Modulo de Formularios: responsable de la interacción con formularios HTML, permitiendo que el usuario los rellene. También recuerda valores previamente introducidos para que estos sean utilizados automáticamente la próxima vez que se necesiten. Modulo de Teclado: consiste básicamente en un teclado virtual que se activa cuando el usuario necesite introducir URLs o cualquier texto en la Web.

16 Arquitectura Separación de intereses basada en MVC Modelo: se ocupa de la lógica y los datos. Vista: se ocupa de la salida ó presentación. Control: se ocupa de la entrada por parte del usuario. En WebScan: El Modelo corresponde a los Servlets y demás clases de Java. La Vista corresponde a los JSP y CSS. El Control corresponde a JavaScript. Como la interfaz reacciona a las acciones del usuario.

17 Recuperación de Páginas Web 1. El usuario se conecta con el servidor de WebScan y peticiona un documento. 2. WebScan peticiona dicho documento al servidor correspondiente. 3. Se recupera el documento. En este punto dicho documento existe en la memoria de nuestro servidor. 4. WebScan reformatea el documento recuperado. 5. Se envía al cliente junto con el código necesario para el barrido, scrolling, etc.

18 Modelo – La Unidad de Procesamiento El ControllerServlet recibe la URL del documento deseado en forma de parámetro. Accede a la data recuperando dicho documento. Manipula el documento para que este sea accesible. Añade Scripts y CSS. Links relativos a absolutos. Reformatea los enlaces de hipertexto. Las clases son reusables y extensibles.

19 Vista – La Presentación (I) JSPs basadas en roles. Representan un componente de la aplicación. Cada Rol tiene una funcionalidad. Barra de Navegación. Barra de Controles. Controles de StepScan. Ventana de Contenidos. Configuración. Favoritos. Utiliza marcos para presentar sus componentes. Estos representan el estado de WebScan.

20 Vista – La Presentación (II) CSS juega un rol importante en la separación entre Lógica y Presentación. Define propiedades del diseño como color y posicionamiento. Se puede cambiar el aspecto de la aplicación sin necesidad de tocar ni los Servlets ni los JSPs ni el código JavaScript. Junto con JavaScript, permite que nuevos elementos sean añadidos/removidos sin que sea necesario tocar código Java, CSS, etc.

21 Control – JavaScript Permite la interacción con el usuario ya que hace posible el barrido. Determina el Flujo de Control de la aplicación. Controla que elemento es barrido actualmente. Controla que elemento será barrido después. Desplazamiento a través de la página.

22 ¿Porque utilizar JavaScript? Memoria de Estado. Los Scripts funcionan desde que se carga la página hasta que esta se cierra. Modelo de Objetos de Documento (DOM). Permite guardar todos los elementos HTML de determinado tipo en un array y modificar sus propiedades. Esto permite barrer los enlaces y los elementos del UI de forma dinámica. Distribución de Recursos. Tolerancia a Fallos.

23 Diseño a Prueba de Errores Desplazamiento No escucha peticiones de desplazamiento hasta que termine la que ha comenzado. Barrido Previene que 2 peticiones de barrido sobre un mismo elemento se activen simultáneamente. Salir de Secuencia Permite salir de una secuencia de barrido a la cual se ha entrado por error. Botón de Emergencia Detiene todas las peticiones de barrido. Solo se puede acceder con el ratón.

24 Ventajas del Enfoque Propuesto -Usabilidad -Motores de Interpretación -Otras Características Importantes

25 Usabilidad Puede ser utilizado por usuarios con distintos niveles de funcionalidad. Provee acceso a todos sus elementos de forma cómoda agrupándolos en roles. Provee acceso a todos los enlaces de un documento dentro de su propio contexto. No hace falta programar una interfaz entre el SO y el pulsador.

26 Motores de Interpretación La interpretación de HTML, JavaScript, etc. se deja a los desarrolladores de los navegadores. Lo mismo sucede con los objetos incrustados. Según nuevas tecnologías sean adoptadas en los navegadores, estas estarán disponibles a WebScan sin ningún esfuerzo por parte de sus desarrolladores.

27 Otras Características Importantes Cuenta con las características de accesibilidad del navegador sobre el que corre. Las actualizaciones se hacen en el servidor, por lo que estarán disponibles a todos los usuarios automáticamente. Multi-plataforma y Multi-navegador. Arquitectura Flexible Permite la utilización de distintas clases para barrer distintos elementos de un documento. Permite interactuar con distintos Servlets/JSPs para aumentar su repertorio de funciones.

28 Conclusiones WebScan libera al usuario de tener que trabajar forzosamente en SU ordenador. No requiere gran soporte técnico. Puede ser un apoyo a Universidades y centros de formación con conexión permanente a Internet. Permiten a estudiantes con impedimentos físicos combinar clases presénciales con los recursos disponibles a través de Internet.

29 Trabajo Futuro WebScan debe permanecer conectado a Internet. La opción de bajar un documento para verlo off- line seria una gran mejora. Mejorar el control de las Ventanas Emergentes. Distinguir entre las solicitadas y las no-solicitadas. Analizar Scripts externos. Implementar la edición y manejo de Favoritos. Al encontrar código HTML inapropiado o abusado, WebScan lo ignora. Una posible mejora es el uso de la heurística en etiquetas incompletas o incorrectas.

30 ¡Gracias por su atención!