Recién leo en Hongkiat una nota con 10 tips para mejorar la usabilidad en web móvil que vale la pena tomar en cuenta

1. Diseña en base a la resolución de pantalla.
2. Divide las páginas web en pequeñas partes.
3. Simplifica el diseño.
4. Siempre deja la opción de “Ver el sitio web completo”.
5. Posiciona bien los elementos de navegación según la audiencia y el dispositivo.
6. Usa enlaces de texto, en vez de imágenes (para reducir el peso de la página web).
7. Diferencia el enlace seleccionado del resto de enlaces.
8. Balance los enlaces según la página que se muestra. No intentes mostrar todos los enlaces en una página.
9. Reduce el ingreso de texto, en su lugar busca usar ingreso de opción multiple o autocompletado.
10. No uses pop-ups ni páginas que se refresquen automáticamente.

Pueden ver la explicación y ejemplos de cada tip en el artículo original: Mobile Web Design: 10 Tips To Better Usability (inglés).

—
Fotografía por John Larsson, liberada bajo licencia Creative Commons by.

A la fecha creo que es la información más completa que he encontrado sobre Guatemala y web móvil, aunque nunca se sabe

Solo como aclaración, el reporte es de Junio del 2009.

Los 10 sitios web móviles más vistos en Guatemala

1. www.google.com
2. hi5.com
3. live.com
4. youtube.com
5. facebook.com
6. hotmail.com
7. wikipedia.org
8. yahoo.com
9. cnn.com
10. msn.com

Los móviles más populares en Guatemala

1. Nokia 5610
   
2. Nokia 5310
   
3. Nokia 2680S2B
   
4. Sony Ericsson K850i
   
5. Nokia E71
   
6. Nokia 6300
   
7. Sony Ericsson K550i
   
8. Sony Ericsson W380
   
9. Sony Ericsson W880i
   
10. Sony Ericsson W200i
    

Otros números interesantes de la web móvil en Guatemala

• Aumento de páginas vistas desde Junio 2008: 4914.6%
• Aumento de usuarios únicos desde Junio 2008: 1023.3%
• Páginas vistas por usuario: 199

El reporte completo, en inglés, lo encuentras en el sitio oficial de Opera: State of the mobile web (Junio 09)

El reporte es bastante completo y les recomiendo que lo vean completo, pero antes los dejo con los puntos más interesantes:

• Los 10 países que más utilizan Opera Mini en Norte América, Centroamérica y el Caribe son: Estados unidos, México, Canadá, Costa Rica, Jamaica, República Dominicana, Honduras, Martinica, Guadalupe y Guatemala.
• En Norte América, Centroamérica y el Caribe Martinica lidera el crecimiento de usuarios únicos con 2746.1%, mientras que aumento el porcentaje de páginas vistas a 9804.8% respecto al mes anterior.
• En el número de páginas vistas por usuario el primer puesto lo ocupa Jamaica con 357 páginas vistas por usuario, lo sigue Costa Rica con 322 y en tercer puesto Guadalupe con 308.
• Blackberry es el móvil más popular en Norte América, mientras que en Centroamérica y el Caribe es dominado por Sony Ericcsson.
• Google es el sitio web más visitado en Norte América, Centroamérica y el Caribe, excepto en Costa Rica en donde el sitio web más visitado es Hi5.
• La red social más popular en Norte América es Facebook, mientras que en Centroamérica y el Caribe domina Hi5.

El reporte completo, en inglés, lo encuentras en la página oficial de Opera: Opera: State of the web mobile (junio 2009)

Sin más que decir los dejo con algunas de ellas:

• Los consumidores aman tanto a sus móviles que los investigadores descubrieron que cuando ellos abandonan su teléfono por un día sienten cosquilleo en la pierna como cuando reciben una llamada.
  Stephen Upstone, AdInfuse.
• Las redes sociales esta dirigiendo su crecimiento. Una investigación de la IAB de este año mostró que las actualizaciones en redes sociales desde móviles aumento 25% del total de los que actualizan. Las personas de 16 a 24 años son los mayores fans de las redes sociales en móviles, con el 44% diciendo que actualizan desde el móvil, comparado con el 17% de la gente mayor de 55 años que lo hace.
  Amy Kean, IAB.
• Ofrecen interacción inmediata. Los teléfonos móviles permiten a la gente interactuar inmediatamente con la publicidad. Al ver un anuncio ellos pueden escribir un SMS, llamar o descargar contenido instantáneamente. Esto maximiza la efectividad en comparación a otros medios, por ejemplo los mensajes cortos como “Envía Saludo al 1525…”.
  Rachel Wright Business Development Director, Phonevalley.
• Mucho por ofrecer. La publicidad en móviles es mucho más que banners anunciando contenido en Internet; hay un amplio campo de formatos que pueden ser utilizados como campañas, desde los enlaces de texto SMS en una pantalla estatica hasta vídeos en aplicaciones o sitios web móviles.
  Jeremy Copp, CEO, Rapid Mobile Media.
• Locura por las aplicaciones. Los usuarios de iPhone han descargado más de un billón de aplicaciones en todo el mundo desde su lanzamiento. Las aplicaciones no se limitan al iPhone; los anunciantes pueden crear aplicaciones útiles para la mayoría de teléfonos en el mercado.
  David Fieldhouse, Mobile Manager, MediaCom.
• Crecimiento inteligente. En los últimos 18 meses [al momento de publicar el artículo] el número de usuarios de Smartphones(iPhone, Nokia N96, T-Mobile G1, etc) en el Reino Unido creció de 3.6 millones de suscriptores  a 6.3 millones, un incremento del 73%, y esos usuarios los usan tres veces más para buscar noticias e informaciónque los que no usan Smartphones (Datos de Comscore/MMetrics).
  Tim Hussain, Head of Mobile Advertising, Sky.
• Esta fuera de nuestras manos. Si tú no estas seguro si tu marca debe estar en móviles, los consumidores ya hicieron la elección por ti. Más de 4 millones de consumidores ya usan sus móviles para buscar información de productos y servicios, y el volumen de las búsquedas creció 4 veces más rápido que las búsquedas online (no en móvil).
  Jon Mew, Head of Mobile, IAB.
• Te hace crecer. Del objetivo al punto de venta. Ningún otro medio permite tal precisión, en el lugar haciendo búsquedas locales y en tiendas utilizando campañas de publicidad via Bluetooth, tú puedes hacer crecer a tus clientes en donde quiera que ellos estén, y ofrecerles publicidad relevante y atractiva.
  Paul Lyonette, Head of Mobile Advertising, Microsoft.
• A los consumidores les gusta la publicidad. El estudio Orange Exposure mostró, que 70% de usuarios de móviles encontraron innovadores los formatos de publicidad. En un anuncio para juegos de prueba el 89% dijo que les gustaba o les daba igual los anuncios mostrados en el portal Orange World, y 88% dijo que era feliz recibiendo publicidad a cambio de contenido gratis o con descuentos.
  Alex Kozloff, Media Research Manager, Orange.

Creo que estas frases demuestran el interesante panorama que ofrecen los móviles, especialmente de cara a acercar marcas con clientes y mejorar la experiencia de compra.

Original | 10 things you absolutely have to know about mobile advertising

Mobile Drupal

El mes pasado presentaron durante el Drupal Camp en Colorado (EEUU) los puntos esenciales para crear sitios web para móviles en Drupal, aquí una traducción y resumen de los puntos más interesantes, por supuesto al final esta la presentación completa por si no queres perderte nada.

Problemas y dificultades

Fragmentación de móviles

• Millones de móviles diferentes
• Diferentes sistemas operativos
• Diferentes capacidades
  • Resolución, soporte de javascript, css, xhtml, video, etc

Usabilidad: Crear una experiencia fácil y divertida

• El contenido debe ser fácil de encontrarse
• Reducir el scroll (no usar scroll horizontal)
• Hacer enlaces faciles de usar (no demasiado pequeños)
• Usar una forma de navegación sencilla que sea fácil de encontrar.

Optimización de la descarga

• Las conexiones de internet no siempre son optimas (entre 50kb/s – 1.8 Mbit/s)
• No permitas que tu visitante espere, no lo hagas descargar contenido que él no va a usar.

Brindar contenido relevante para los usuarios móviles

• Entiende qué es lo que ellos buscan (piensa y planea bien)
• No es fácil (especialmente para el cliente)

Acerca del diseño

• No márgenes ajustados
• No floats
• No grandes fuentes
• Reduce el uso de tablas (o reduce el número de columnas)
• Haz un bloque de enlaces para ver, como
  • Comentarios recientes
  • Temas más recientes del foro
• Elimina el bloque de contenido de la portada
• Cambia el bloque de inicio de sesión (login) por un enlace.
• La navegación usando combobox (dropdown list) funciona bien.
• Elimina “Quién esta en línea” (no es relevante)
• Tu puedes hacer cosas atractivas para iPhone, Android, etc.

Sobre los módulos móviles para Drupal

[Aclaración: Las extensiones en Drupal son llamadas módulos]

• Muchos intentos en la comunidad (de Drupal)
• Los módulos están enfocados en
  • Ofrecer temas móviles (por ejemplo iUI, mobile theme, etc)
  • Cambio automático de temas
  • Pagos a través del móvil
• No hay muchos ejemplos
• No ofrecen estrategias a largo plazo
• Un vistazo a los módulos móviles para Drupal en An overview of Mobile modules for Drupal
  

Algunos módulos móviles para Drupal

• Mobile Tools
  
• Siruna
  
• WURFL
  
• Planeados (por el autor):
  • Modulo de redimensionamiento de imágenes
  • Solución para convertir vídeo (basado en Media Mover)
  • Ofrecer más temas móviles

4 pasos para el desarrollo de web móvil en Drupal

Luego la presentación se enfoca cada uno de los cuatro pasos para desarrollar para web móvil en Drupal:

1. Detección del dispositivo (Móvil, PC de escritorio, PSP, etc)
2. Switching, o Cambio (para asegurarte de que el visitante tenga la mejor versión del sitio web)
3. Funcionalidad + Contenido (Que la funcionalidad y el contenido sean relevantes para el dispositivo)
4. Theming, o el diseño del tema (diagramación, tamaño de las imágenes, navegación, el uso de tablas, etc)

Podría adentrar un poco más al tema pero te recomiendo que mejor veas la presentación que amplia más estos cuatro pasos.

Siruna presentation Mobile Drupal @ Drupalcamp Colorado Jun09

Artículo original: Slides presentation on Mobile Drupal @ drupal camp colorado

iPhone Transit Planner por illustir (cc-by)

Esta semana pude leer un artículo en el blog de Pablasso llamado ¿Cómo debe ser el Internet para móviles? que es acerca de cómo WAP y WAP2 han quedado obsoletos con la llegada del iPhone de parte de Apple, y como él acertadamente menciona, ahora no hay tantas limitaciones de memoria o software como antes. Hasta aquí puedo darle la razón, con Apple y Android soportando HTML5 ¿quién quiere usar WAP?

Por otro lado termina el artículo con un par de comentarios en los que no estoy de acuerdo, vamos por partes:

Pablasso: En mi mundo ideal los móviles deberían de adaptarse a mostrar los contenidos lo más fielmente posible, y si no tienen la pantalla adecuada, entonces proveer aplicaciones para obtener esos contenidos por otros medios, como puede ser RSS

Es un error grave pensar que la web debe ser igual todo el tiempo y en todo lugar, especialmente  en el campo de los móviles.

Web móvil va más allá de adaptar al navegador, importan las capacidades del dispositivo así como también importa el contexto (lugar, hora, tarea, etc) en donde recibe la información, y para apoyar esto citó a la guía breve de web móvil de la W3C:

W3C: Es importante tener en cuenta que existen grandes diferencias entre usuarios móviles y usuarios fijos, como son los diferentes tipos de contenido que manejan, las capacidades de los dispositivos que utilizan (pantallas pequeñas) y el contexto en el cual el usuario recibe el contenido (por ejemplo, en el autobús).

Mostrar en el móvil exactamente lo mismo que en la PC no es siempre lo mejor, aunque también es cierto que un buen navegador, como Safari Mobile, puede ayudar mucho a navegar sobre esas webs no optimizadas para móviles y crear una mejor experiencia web que WAP o WAP2.

iPhone junto al iPod Touch son buenos dispositivos con un excelente navegador pero están muy lejos de competir contra una PC. En un día normal de navegación he llegado a bloquear Safari Mobile hasta 3 veces, no puedo cargar más de 2 webs “normales” (no adaptadas a móviles) y menos usar Flash.

De nuevo, la web móvil no es acerca de un navegador, hay que considera rendimiento (hardware), compatibilidad (software), velocidad de transferencia (conexión) y costo (de conexión, del móvil, etc.).

Pablasso: A menos que sea punto clave para tu negocio, yo no me preocuparía en ofrecer una versión web para móviles con navegadores inferiores al iPhone.

Tengo que aceptar estoy de acuerdo, si no es clave para tu negocio no debes preocuparte por desarrollarlo, porque para todo hay mercado y es bueno enfocarte en el tuyo. Por ejemplo, si el 90% de las visitas desde móviles provienen de iPhone ¿qué sentido tendría invertir tiempo y dinero en desarrollar una web WAP?

Sin embargo, no hay que olvidar que el enfoque de la web es lograr el mayor alcance posible, independientemente del medio, el dispositivo e incluso de limitaciones físicas. De allí la importancia de apegarse a estándares y no desarrollar solo para uno.

Más información sobre la web móvil

• Introducción a la web móvil.
• One web. Un artículo explicando cómo funciona el concepto de web única.
• Alzado escribe un buen artículo sobre Cómo diseñar para la web móvil. Una aproximación práctica. Nada complicado, solo un buen acercamiento a lo que la web móvil involucra.

Sin embargo, medir el tráfico de móviles en tu web sigue siendo necesario, y luego de la pregunta de Miquel acerca cómo puede medir el tráfico móvil en su web busqué un poco y encontré estas opciones:

• Mobilytics. Sin conocerlo mucho (todavía ) me atrevo a decir que Moblytics es a la web móvil lo que Google Analytics es a la web. Es una herramienta de analíticas web diseñada para móviles, con 3 versiones diferentes, una gratuita (menos de 100,000 pageviews) un básica ($79 mensual) y una professional ($149 mensual). Puedes revisar todas las características en la web oficial.
• Amethon Mobile Analytics. Una de las opciones más “profesionales”, con muy buenas referencias según pude leer, y con bastantes características. Como es de esperarse es una herramienta de pago. Puedes encontrar más información en la web oficial o en su documento de presentación (PDF, Inglés)
• Google Analytics for Mobile (Inglés). En los foros de MobiForge trabajaron en una solución, sin javascript y basada en DeviceAtlas, para enviar datos a Google Analytics a través de PHP, y qué de esta forma trabaje con móviles. También puedes revisar este otro tema sobre Google Analytics sin Javascript (Inglés). Por supuesto es una opción mucho más complicada aunque permite manejar todo con Google Analytics, en caso de que ya lo usemos.

Actualización:

• Mobile Analytics / AdMob. Una herramienta que a simple vista se ve muy similar a Mobilytics, lo cual no es malo, espero probarlas pronto. Gracias a urruti por el aviso.

Escuchar acerca de estadísticas en la web móvil es algo extraño, es una herramienta necesaria pero pocas veces mencionada.

Unas semanas atrás conocí Percent Mobile qué apareció precisamente como una herramienta de estadísticas web enfocada en móviles. La herramienta es gratuita pero esta bajo beta privada (necesitas invitación), por suerte llegue rápido y conseguí uno de los 500 códigos que regalo Percent Mobile para los lectores de TechCrunch.

El proceso para instalarlo es simple, te registras, agregas el código de Percent Mobile en tu sitio web, si usas versión móvil (o plugins para WordPress como Mobile Pack) también lo incluyes en el tema para que funcione.

Percent Mobile en detalle

Percent Mobile es un servicio bastante sencillo, una sola página con información muy visual (iconos, gráficas y demás).

Información general

Es el núcleo de Percent Mobile es la primera fila de información, las información básica: Tráfico desde móviles (porcentaje %), número de dispositivos diferentes, redes (telefónicas), países y acceso por WiFi

Ecosistema de móviles

Un listado de los móviles que más visitan tu sitio web dividos por porcentaje.

Marcas de móviles

Es un top 5 de las marcas de móviles que visitan tu web

Dimensiones de pantalla

Proveedores de servicio (telefónicas)

Países

¿Es útil Percent Mobile?

Como sistema de estadísticas para manejar una campaña de marketing no es la mejor opción, es limitado y muy básico en general. Olvida reportes personalizados, detalles como “tiempo promedio en la página” o referrers por ejemplo, datos esenciales en este caso.

Desde otro punto de vista Percent Mobile es una herramienta bastante amigable, muestra la información necesaria para que un blogger conozca a sus “visitantes móviles” sin complicarse en reportes o información innecesaria. Y precisamente pienso que este público al que esta enfocado Percent Mobile, para lo cuál es un servicio útil.

Quizás lo único que se extraña en Percent Mobile es la división por tiempo, en otras palabras un historial. Es imposible creer que no lo incluyan siendo tan necesario, porque luego de un tiempo sabes que tienes 32% (ejemplo) de visitas desde móvil, pero no sabes cuantas fueron recientes, o de hace 4 meses. Una falta casi imperdonable

Por si te interesa, la empresa que creo Percent Mobile, TipTags, también ofrece otro servicio de métricas para web móvil que por lo visto es mucho más completo y profesional, aunque un poco “caro”.

¿Sabes cuantas visitas tienes desde moviles?

• Little Springs Design (inglés). Uno de los mejores blogs de diseño para web móvil que sigo, muy buenos artículos de diseño y buenas practicas.
• Desarrollando para el HTC Magic (Android) por aNieto2k. Una lista de enlaces recomendados para desarrollar para Android.
• @Urruti en Twitter. Según su bio trabaja desarrollando aplicaciones para móviles y comparte enlaces interesantes sobre el tema.
• Web móvil en Friendfeed. Un grupo en donde compartimos enlaces sobre la web móvil para comentarlos.
• INQ Mobile. Por si aún no conoces este móvil no te lo puedes perder, esta orientado en la “web social”, 2.0 o como quieras llamarle. Incluye apps. para muchas redes sociales, incluyendo Facebook, MySpace, Skype y Windows Live Messenger.

Apps para iPhone

• Twitterific (2.0) lanza su nueva versión, altamente recomendada si twitteas desde el iPhone o iPod Touch. Incluye manejo de multiples cuentas, bonita interfaz y muchas extras que lo han hecho mi app. favorita para Twittear. Aprovecha para agregarme: @webdebolsillo o si prefieres mi cuenta personal es @diciembre7 (en donde casi no escribo de móviles).
• Tap Defense [App Store] también se únio esta semana a las actualizaciones, este juego es bastante sencillo pero muy entretenido, ahora incluye muchos más modos de juego, nuevas pantallas, sonidos mejorados y nuevos gráficos.

WordPress Mobile Pack se instala fácil  y los resultados son impresionantemente buenos, de un blog normal no apto para móviles puedes llegar a una puntuación de 5/5 en ready.mobi, de 97/100 en el validador de la W3C para móviles (resultados de webdebolsillo.com) y sin necesidad de enredarte en problemas técnicos. Esto es mucho decir porque no es tan sencillo de lograr.

Por otro lado WordPress Mobile Pack no es un plugin atractivo para cualquier bloggero, porque desde el punto de vista de resultados y estándares esta muy bien pero del lado del visitante suele ser un desastre. Un diseño desordenado, confuso y feo que no mejora la experiencia desde el punto de vista visual. Claro, lo importante del blog es el contenido pero como visitante y bloggero también se agradece un diseño agradable y fácil de usar.

Otro punto en contra, al menos para blogs en español, es el idioma. El tema por defecto esta en inglés y aunque no sea complicado no se ve bien mezclar ambos idiomas. Más adelante trabajaré en una traducción así que esperen noticias.

Rendimiento de WordPress Mobile Pack

Por curiosidad se me ocurrió hacer pruebas para conocer la diferencia de peso entre la versión estándar de WordPress, la versión de WordPress Mobile Pack y la de MobilePress.

El peso lo medí usando Firebug (net) en Firefox junto a la extensión User-Agent Switcher para simular la visita desde un móvil. Use 4 tipos de páginas diferentes: portada, un tema con imagen grande, un tema corto y un tema extenso.

La mejora de peso con WordPress Mobile Pack (WMP) es bastante notable, con ahorro de más de la mitad en la mayoría de páginas, seguido de MobilePress sin javascript, siempre y cuando no se incluyan imágenes. En este aspecto el acierto de WMP es el redimensionamiento de imágenes, que por defecto reduce las imágenes a 124x124px, o en caso de integrarse con DeviceAtlas las ajusta al dispositivo.

El mayor fallo de MobilePress es el javascript, que a pesar de ser una versión reducida de jQuery, sigue agregando 55 kb a cada página.

Fallas

Como toda aplicación recién lanzada WordPress Mobile Pack aún tiene fallas, que aunque son pocas y no criticas me parece importante mencionarlas. También me parece justo mencionar que el equipo de desarrollo sigue mejorando el plugin y han estado actualizando (la última actualización fue hace 6 días aproximadamente).

• [Error] Al utilizar la opción Remove Media las imágenes pueden fallar porque el plugin elimina el atributo src de la etiqueta img (imagen). Desactivando la opción se soluciona.
• [Usabilidad] Los enlaces en menús o listas son pequeños y están muy cerca, lo que aumenta los fallos al presionar un enlace desde una pantalla táctil.
• [Apariencia] La apariencia es muy desordenada y demasiado genérica. Como una primera versión esta bien pero a largo plazo es buena idea mejorarla. Incluso MobilePress cuenta con un diseño más ordenado, sin mencionar a WPTouch que tiene un diseño muy bueno para iPhone.
• [Compatibilidad] Como mencione en el tema anterior, WordPress Mobile Pack no es compatible con MobilePress porque fallan ambos, ni con WPhone porque WMP reemplaza la funcionalidad de WPhone. Con WPTouch es compatible pero este reemplaza el diseño de WMP, y al desactivar la versión móvil WMP se activa, en otras palabras siempre estará una versión móvil.

En resumen

Wordpres Mobile Pack es la mejor opción actualmente si buscas un blog compatible con cualquier móvil, evitándole cargos altos y esperas largas a tus visitantes, por otro lado sacrificas el diseño y la personalidad de tu blog. No se compara con WPTouch en diseño para iPhone por ejemplo, sin embargo, no tienen el mismo enfoque, Wordpres Mobile Pack intenta cumplir todos los estándares posibles y adaptar la experiencia para muchos móviles, mientras que WPTouch se enfoca en mejorar la experiencia solo para iPhone/iPod Touch aprovechando todas las características que estos ofrecen.