preparados, listos, ajax!

24
desconferencia Donostia-San Sebastián 15 de septiembre de 2006 Virginia Aguirre ¡Preparados, listos… AJAX!

Upload: virginia-aguirre

Post on 21-May-2015

533 views

Category:

Technology


0 download

DESCRIPTION

Presentación sobre Ajax y modelos de interacción de una Desconferencia - 2006 (Cadius)

TRANSCRIPT

Page 1: Preparados, listos, Ajax!

desconferencia Donostia-San Sebastián

15 de septiembre de 2006

Virginia Aguirre

¡Preparados, listos… AJAX!

Page 2: Preparados, listos, Ajax!

AJAX, acrónimo de Asynchronous JavaScript And XML

(JavaScript y XML asíncronos).

Término acuñado por Jesse James Garret en el artículo Ajax: A New Approach to Web

Applications (AJAX un nuevo acercamiento a las aplicaciones Web)

¿Qué no es?

­ No es una tecnología.

­ No es un lenguaje de programación.

¿Qué es?

Es una técnica de desarrollo web para crear aplicaciones interactivas que se ejecutan en

el cliente (navegador del usuario) y mantienen comunicación asíncrona con el servidor en

segundo plano.

¿Qué es “Asincronía”?

Hace referencia al suceso que no tiene lugar en total correspondencia temporal con otro

suceso.

¿Qué es y qué no es AJAX? Breve introducción desconferencia Donostia

Page 3: Preparados, listos, Ajax!

¿Qué más es?

Es un término que describe un nuevo acercamiento a usar un conjunto de tecnologías

existentes juntas:

­ XHTML (o HTML) y (CSS) para presentación basada en estándares de datos

­ Document Object Model (DOM) para mostrar e interactuar dinámicamente con la

información presentada.

­ El objeto XMLHttpRequest para la recuperación y envío de datos de modo asíncrono

con el servidor.

­ XML y XSLT para intercambiar y manipular datos con el servidor web

­ Javascript (implementaciones ECMAScript) como nexo de unión.

¿Qué es y qué no es AJAX? Breve introducción desconferencia Donostia

Page 4: Preparados, listos, Ajax!

¿Y todo esto qué significa?

Esto hace posible realizar cambios sobre la misma página sin necesidad de

recargarla.

Lo que equivale en teoría a un aumento de:

– La interactividad entre el usuario y la interfaz.

– La velocidad de respuesta de la página.

– La oportunidad de desarrollar interfaces más fáciles de usar.

Es decir:

Aplicaciones más dinámicas, ágiles e intuitivas que:

­ Suponen una mejora importante de la experiencia del usuario.

­ Permiten simular el comportamiento de aplicaciones de escritorio en la web.

¿Qué es y qué no es AJAX? Breve introducción desconferencia Donostia

Page 5: Preparados, listos, Ajax!

¡Peeeeeeeeeero!...

AJAX también implica…

desconferencia Donostia

Page 6: Preparados, listos, Ajax!

1. La aparición de nuevos patrones de interacción desconocidos hasta

el momento por el usuario en internet (fusión con las aplicaciones de

escritorio).

2. Necesidad de establecer nuevas formas de retroalimentación para

asegurar la visibilidad del estado del sistema.

3. Ruptura de algunos “estándares” conocidos por el usuario.

=

Principales retos que debemos afrontar

desconferencia Donostia

Page 7: Preparados, listos, Ajax!

¿Y esto es malo?

desconferencia Donostia

Page 8: Preparados, listos, Ajax!

NO

desconferencia Donostia

Page 9: Preparados, listos, Ajax!

¿Qué está pasando? Contextualizando…

­ Verlo en un contexto global auténtico cambio social y de la web (Web2.0, RIA (Rich

Internet Application).

­ Malas aplicaciones (esto ya paso con DHTML, flash, etc..):

Las tecnologías y plataformas de desarrollo no son malas, es el uso que se hace de ellas lo

que determina que un producto lo sea.

­ No hay estándares definidos CAOS necesidad de estandarización

(componentes, iconos, patrones de interacción. Software).

Ejemplo de páginas de inicio personalizadas:

- muy numerosas.

- cada una resuelve los problemas de interacción de una manera diferente.

- cada una usa iconos diferentes.

No podemos pedirle al usuario que tenga que aprender con cada aplicación.

­ No hay que confundir pequeñas funcionalidades llamativas fáciles de resolver con

intentos de crear interfaces enteras en Ajax emulando aplicaciones de escritorio

(mayor reto).

desconferencia Donostia ¿Qué está pasando? Contextualizando…

Page 10: Preparados, listos, Ajax!

Estamos redefiniendo la web, evolucionando,

mejorando y creando nuevas soluciones

adaptadas a las nuevas circunstancias y los retos

que estas plantean.

desconferencia Donostia ¿Qué está pasando?

Page 11: Preparados, listos, Ajax!

¿Y de qué van esos retos?

Algunos ejemplos…

desconferencia Donostia

Page 12: Preparados, listos, Ajax!

1. Necesidad de establecer nuevas formas de

retroalimentación para asegurar la visibilidad del estado del

sistema:

Ya no hay refresco completo (retroalimentación tradicional) de la página sino refrescos

parciales.

Necesidad de incorporar señales que sean percibidas por el usuario

+

Mayor necesidad de una correcta retroalimentación

Retos: Nuevas formas de retroalimentación desconferencia Donostia

Page 13: Preparados, listos, Ajax!

Capas informativas del progreso de la acción (no siempre están claras)

desconferencia Donostia Retos: Nuevas formas de retroalimentación

Page 14: Preparados, listos, Ajax!

Cuadros de dialogo que informan al usuario de lo que ocurre (software)

desconferencia Donostia Retos: Nuevas formas de retroalimentación

Page 15: Preparados, listos, Ajax!

2. Aparición de nuevos patrones de interacción desconocidos

hasta el momento por el usuario en internet (fusión con las

aplicaciones de escritorio):

­ Suponen un aprendizaje para el usuario controlar la curva de aprendizaje.

­ Si están mal resueltas/enfocadas problemas de usabilidad.

desconferencia Donostia Retos: Nuevos patrones de interacción

Page 16: Preparados, listos, Ajax!

Cajas que se arrastran, capas/opciones que se despliegan, etc. (netvibes, página personalizada de google, etc.).

desconferencia Donostia Retos: Nuevos patrones de interacción

Page 17: Preparados, listos, Ajax!

Doble click para acceder a una información (windows live mail).

desconferencia Donostia Retos: Nuevos patrones de interacción

Page 18: Preparados, listos, Ajax!

Capas (tipo ventanas modales) que se superponen a la página y la inhabilitan (flickr)

desconferencia Donostia Retos: Nuevos patrones de interacción

Page 19: Preparados, listos, Ajax!

Iconos cuya funcionalidad no identificas hasta que hayas pinchado en ellos produciendo muchas veces

efectos inesperados. (protopage.com)

desconferencia Donostia Retos: Nuevos patrones de interacción

Page 20: Preparados, listos, Ajax!

3. Ruptura de algunos “estándares” conocidos por el usuario:

­ El botón de atrás del navegador deja de funcionar en muchos casos (windows live mail)

­ URLS que no pueden enviarse o guardarse en favoritos.

Además… cuidado con:

­ Usar AJAX por ser “AJAX”

AJAX es una herramienta, no un juguete ni una moda.

Muchas de las implementaciones AJAX que podemos encontrarnos no son

necesarias para mejorar la usabilidad o la experiencia del usuario.

­ Tiempos de espera excesivos

Incluir demasiado código consumo de ancho de banda y procesador.

desconferencia Donostia Retos: Ruptura de estándares

Page 21: Preparados, listos, Ajax!

¿Y la accesibilidad?

¿Y la accesibilidad ? desconferencia Donostia

Page 22: Preparados, listos, Ajax!

AJAX plantea graves problemas de accesibilidad:

­ Por el uso de javascript (gmail posee una versión básica, flickr no funciona)

­ Capas de información (globos) que no aparecen asociados a su contenido si se

desactivan los estilos.

­ Necesidad en muchos casos de no tener ningún tipo de discapacidad motriz

para poder interactuar con la interfaz.

­ Personas mayores (movilidad, aprendizaje, etc.)

¿Qué soluciones existen?

desconferencia Donostia ¿Y la accesibilidad ?

Page 23: Preparados, listos, Ajax!

¿Lo debatimos?

­Ajax y accesibilidad: ¿Cómo se harían por ejemplo Flickr o Writely accesibles?¿Vuelta

a los dobles desarrollos? ¿Se debería intentar también adaptar las ayudas técnicas a las

nuevas circunstancias?

­ Windows live: un intento de crear aplicaciones web emulando aplicaciones de

escritorio, más allá de las pequeñas funcionalidades que no nos gustan. ¿un intento por

intentar definir estándares?

¿Lo debatimos? desconferencia Donostia

Page 24: Preparados, listos, Ajax!

Referencias Wikipedia

http://es.wikipedia.org/wiki/AJAX

¿Qué es Ajax? Definición de Ajax – Más adelante

http://www.masadelante.com/faq-ajax.htm

Ajax: A New Approach to Web Applications – Jesse James Garret

http://www.adaptivepath.com/publications/essays/archives/000385.php

Ajax Mistakes - Alex Bosworth's Weblog

http://www.sourcelabs.com/blogs/ajb/2005/05/ajax_mistakes.html

Ajax: El Nuevo Abordaje De Interfaz De Desarrollo De Diseño Web Del Que Todos Hablan – Robin Good

http://www.masternewmedia.org/es/2005/07/28/ajax_el_nuevo_abordaje_de.htm

AJAX y Usabilidad –-Juan Carlos García - Úsalo

http://usalo.es/71/ajax-y-usabilidad/

Puntos a tener en cuenta cuando uses AJAX - Manuel Cebrian – Maestros del web

http://www.maestrosdelweb.com/editorial/puntosajax/

AJAX o el fin del clic y espera – Luis Villa – Alzado.org

http://www.alzado.org/articulo.php?id_art=457

Usabilidad con AJAX Jesús Carreras Plaza – Biguel.com

http://www.biguel.com/?page_id=90

desconferencia Donostia Referencias