jQuery Mobile: liberada la versión Alpha 1

jQuery MobilejQuery Mobile (liberada el 16 de octubre) es la versión del framework jQuery para smartphones y tabletas táctiles.

Se trata de un sistema de interfaz de usuario unificada para todas las plataformas de dispositivos móviles más comunes y construida sobre jQuery.

El código está diseñado para ser funcional en todos los navegadores móviles con soporte de HTML y está basado en el principio de la mejora progresiva (teniendo una página web se le añaden capas adicionales JavaScript con las funcionalidad). Su peso es muy pequeño, la versión alfa tiene un tamaño de tan sólo 12KB y el CSS solo 6KB.

jQuery MobilejQuery MobilejQuery Mobile

El sistema incluye layouts (listas, paneles de detalle, superposiciones) y un conjunto de controles de formulario y widgets de interfaz de usuario (deslizadores, pestañas).

Para la personalización de la apariencia de la interfaz de usuario se utilizan selectores CSS3 como “text-shadow”, “box-shadows” y degradados.

HTML5 y CSS3

jQuery Mobile las principales funcionalidades de HTML 5 y CSS 3, lo cual limita sus capacidades a los navegadores con soporte para estos estándares. En los dispositivos que no los soporte seguirá funcionando, aunque sin los efectos de transición, degradados, etc.

Compatibilidad de jQuery Mobile con los navegadores de dispositivos móviles

Para esta versión han logrado una importante integración con la mayoría de los navegadores de dispositivos móviles, aunque, por tratarse de una versión alfa, existen errores en algunas plataformas. En la siguiente imagen tenéis la tabla de compatibilidades con las distintas plataformas:

Plataformas soportadas por jQuery Mobile

Plataformas soportadas por jQuery Mobile

Los códigos de color indican:

  • A Alta calidad. El navegador tiene capacidad, como mínimo, para utilizar media queries (requerimiento de jQuery Mobile). Estos navegadores serán el principal objetivo de las pruebas a fin de dotarles de las mayores capacidades con jQuery Mobile.
  • B Calidad media. Se trata de navegadores con las capacidades necesarias pero que, según los desarrolladores, no tienen cuota de mercado suficiente para justificar pruebas intensivas. Si se aplicarán correcciones al código en caso de un mal funcionamiento en alguno de ellos.
  • C Baja Calidad. El navegador no cuenta con la capacidad de utilizar media queries.
  • En pruebas. Estos navegadores se están probando.

En este documento tenéis información sobre el proceso de pruebas realizado:

Accesibilidad

Todos los componentes jQuery Mobile están dentro de las directivas ARIA para accesibilidad de aplicaciones enriquecidas, lo que significa, entre otras cosas, que permiten la navegación mediante el teclado y su utilización mediante lectores de pantalla.

Demos y documentación

En este enlace tenéis demostraciones y documentación sobre jQuery Mobile 1.0a1.

En él podéis encontrar información sobre:

  • Diseño de la interfaz
  • Encabezados y pies
  • Controles de formularios
  • Controles para diálogos
  • Listas
  • Eventos
  • Transiciones

Descargas

Se provee de versiones alojadas en sistemas CDN para que sean incluidas directamente en el código de nuestro desarrollo. Por una parte, podemos enlazar con los archivos JavaScript y CSS descomprimidos para entornos en los que estemos desarrollando o probando aplicaciones, y ficheros comprimidos (gzip) y miniaturizado para entornos de producción. Los enlaces a los ficheros alojados son:

JavaScript:

CSS:

Para incluir estos ficheros en el código simplemente hay que enlazarlos copiando este código:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

En el caso de que deseemos descargar los ficheros a nuestro servidor, este es el enlace al fichero comprimido en Zip:

Probablemente esta versión, como no podía ser de otra forma al tratarse de un alpha, estará un poco “verde”, pero, desde nuestro punto de vista, nos abre un montón de posibilidades. Tendremos que ir probándola, ¿no?

diseño web, herramientas, javascript

Trackbacks/Pingbacks

  1. Bitacoras.com - 11 noviembre 2010

    Información Bitacoras.com…

    Valora en Bitacoras.com: jQuery Mobile (liberada el 16 de octubre) es la versión del framework jQuery para smartphones y tabletas táctiles. Se trata de un sistema de interfaz de usuario unificada para todas las plataformas de dispositivos móviles ……

Compression Plugin made by Cork Tiles