|

AsxJax: Ajax accesible

ByLuis

AsxJax es un framework que permite añadir accesibilidad a los desarrollos web que utilicen Ajax, así usuarios que utilicen screenreaders u otros dispositivos similares podrán disfrutar de las características que ofrece la web 2.0.

AxsJAX añade accesibilidad según lo definido por la W3C ARIA, siendo necesarios los siguientes requisitos:

  • Un navegador como Firefox 2.0 que soporte la W3C ARIA.
  • Tecnologías que respondan correctamente a las mejoras de accesibilidad añadidas por la W3C ARIA.
  • Alguna de las mejoras añadidas por AxsJAX dependen del soporte para las live regions, una característica que permite a las tecnologías como los screen readers tratar correctamente con actualizaciones asíncronas de partes de la página web.

El framework AxsJAX puede añadir accesibilidad a aplicaciones Web 2.0 existentes mediante las siguientes técnicas:

  • Como un bookmarklet.
  • Usando Greasemonkey.
  • Usando Fire Vox.

AsxJax

Similar Posts

jQuery Graceful Websocket: plugin jQuery para websockets

ByLuis

jQuery Graceful Websocket es un plugin jQuery que nos permite comunicarnos con el servidor usando websockets de HTML5. El problema es que tan solo Chrome permite los websokets (creo que Firefox los tiene desactivados por defecto por temas de seguridad), además se necesita que el servidor los pueda tratar, por lo que este plugin permite una alternativa mediante Ajax transparente al desarrollador.

// Si el servidor no admite websockets sustituye el ws:// por http://
var ws = $.gracefulWebSocket("ws://127.0.0.1:8080/");
// Envía datos al servidor. 
// Si el servidor no admite websockets lo envía mediante POST
ws.send("message to server");
// Recibe datos del servidor
// Si el servidor no admite websockets hace un polling mediante GET
ws.onmessage = function (event) {
   var messageFromServer = event.data;   
};

WebSocket plugin for jQuery with graceful degradation

Recursos AJAX para principiantes

ByLuis

Una lista interesante para los que quieren empezar a aprender y a crear aplicaciones con AJAX, lástima que sean todas en inglés:

Y otro recurso que no está en la lista que a nosotros nos ha sido muy pedagógico: AJAX Tutorial, decenas de tutoriales. Unos sencillos con instrucciones paso por paso y otros más complejos.

AJAX Resources for Beginners

Vía / Digg

|

Weebly: crea tu web de forma rápida con Ajax

ByLuis

weebly.pngWeebly nos ofrece la posibilidad de crear páginas web de forma rápida, sencilla y online. Mediante el uso de Ajax y gracias al drag&drop, podemos crearnos nuestro sitio web en pocos minutos.
Entre las características que ofrece encontramos: uso del drag&drop para la generación de páginas, variedad de temas para elegir, subdominios personalizados, posibilidad de exportar a un fichero zip y numerosos tipos de contenido.
weebly2.png
Para los desarrolladores que esté interesados, quizás les guste saber que además de las opciones anteriores, también ofrece lo siguiente: uso personalizado de Ajax (drag&drop, efectos), subida de ficheros mediante Ajax, integración de un botón que nos permite ir atrás/adelante en el sistema de ventanas y diseño de elementos potente.
Demo:

Weebly
Vía / Ajaxian

|

5 efectos CSS accesibles

ByLuis

El tema de la accesibilidad es algo que a veces se deja de lado cuando se quiere conseguir un diseño más dinámico. Pero si se busca bien, se podrá encontrar ejemplos de diseños CSS que sean accesibles.

Estos son 5 muy buenos ejemplos de ello:

  • Enlaces externos: modificas el texto “(enlace externo)” incluyéndolo en un span y después lo que haces es modificar el estilo para que muestre un icono (diferente dependiendo de si es linked, visited o hover) y el texto lo haces desaparecer de la parte visible de la pantalla.Enlaces externos
  • Sigue leyendo: el texto “Sigue leyendo sobre …” se modifica, haciendo que solo aparezca “Sigue leyendo” y el resto del texto aparece como un popup mediante posición absoluta y jugando con el hover.Sigue leyendo
  • Texto variable: al igual que ya contamos en Sentido Web, usando distintas hojas de estilo y accediendo a ellas mediante Javascript.Tamaño de texto
  • Pestañas con imágenes: se crea un menú de pestañas con listas no ordenadas y se cambia el estilo para que no tengan formato de bloque, los enlaces están formados por imágenes y estas cambian según el hover.Pestañas
  • Formularios: dos buenos ejemplos de formularios, uno de ellos muy bien tabulado y otro en tres columnas.Formularios

5 Accessible and pretty CSS tips

Vía / dzone

|

¿XMLHttpRequest nativo en IE7 o no?

ByLuis

IEUno de los anuncios que más esperamos del nuevo IE7 es que el objeto XMLHttpRequest (XHR) iba a ser nativo y no será necesario el uso de ActiveX. Tan solo es necesario crear una nueva instancia de este objeto new XMLHttpRequest() y seguirá funcionando si se desactivan las ActiveX.
Aunque ciertas dudas salen debido a algunos aspectos que han encontrado: xhr.prototype falla, parece ser que la creación dinámica de miembros del objeto falla, y la posibilidad de poder desactivar el objeto XHR. Estas dos cosas hacen sospechar que el objeto sea del todo nativo o no, o al menos que podamos contar con él como contamos con otros elementos HTML.
IE7 XMLHttpRequest – Native or Not?
Vía / aNieto2K

| | |

Personaliza los radio y los checkbox

ByLuis

Muchas veces los diseños no suelen ir de acuerdo con el aspecto de los radio y los checkbox que nos ofrecen los navegadores.
Crear controles que sustituyan los ya existentes puede darnos problemas de accesibilidad, salvo en este caso (bueno, y supongo que en otros), ya que lo que hace este script es aprovechar la funcionalidad de las etiquetas label para que el funcionamiento recaiga sobre estas etiquetas y no sobre las checkbox o los radio.
radiocheckbox.png
El script buscará los inputs radio y checkbox y los ocultará y cambiará el estilo de las label asociadas para que el funcionamiento sea el mismo.
ARC – Adam’s Radio/Checkbox customisation
Vía / Infected-FX