SlideShare una empresa de Scribd logo
1 de 23
Descargar para leer sin conexión
Inteligencia en Movimiento
Promesas y desafíos de las plataformas móviles




                                    Ricardo Barra, Noviembre 2009
                                  info@placerdigital.net | @Chuqui
Acerca de mí
●   15 años sumergido
●   DOS, Usenet, Mosaic (Netscape), NetMeeting
●   Blog desde el 2003, Twitter desde el 2007
●   Diseño
●   Programación
●   Comunicaciones
●   Marketing
●   Profe
Mobile Web – la promesa
Luego de frustrados intentos por traer la Web a los dispositivos
portátiles (WAP 1.0), hay que precisar que la Mobile Web tiene
muchas ventajas...
✔   Va contigo
✔   La audiencia es gigantesca
✔   No necesita cables
✔   Se puede operar con una mano
✔   Especial proyección en países como Chile
Mobile Web – cifras y stats
El año 2007 el número de usuarios con teléfonos con navegador, superó a
    la cantidad de autos (800 millones), PCs (850 millones), usuarios de
   Internet convencional (1,1 billones), e incluso la cantidad de TVs (1,5
                                  billones)
Mobile Web – cifras y stats
Usuarios activos han crecido 30% cada año entre el 2006 y 2010
Mobile Web – cifras y stats
    Aumento del tráfico mensual desde junio del 2008




Causas:
- Llegada de los smartphones. Hace 1 año, el 20% del tráfico.
- Redes sociales y microblogging
Mobile Web – más stats
✔Según Nokia, existen cerca de 2 billones de celulares con
Internet circulando en el mundo

✔Sólo usando Opera Mini, en marzo del 2008 hubo más de
2,4 billones de páginas vistas

✔ Más de un 13% de los estadounidenses accede a sus sitios
favoritos solamente desde el móvil

✔En India hay 4 veces más usuarios
de Internet Móvil que
usando PC
Mobile Web – desafíos
✔   Tamaño de la pantalla

✔   Input

✔   Ancho de banda, intermitencia y $$$

✔   Objetivos del usuario

✔   Limitaciones de los dispositivos
Mobile Web – desafíos
Resolución...
* Resolución típica de un PC: 1024x768


* Celular normal: 200x200: 20x menor


* Smart phone: 320x480: 5x menor


* Próximos dispositivos a 800x600
Mobile Web – desafíos
Resolución...
* 30 a 90 veces más pequeño


* generalmente vertical


* teclados virtuales ocupan mucho espacio
Mobile Web – desafíos
Ejemplo...
Mobile Web – desafíos
En un móvil...
* Scroll y zoom

* Navegación oculta contenido

* Pesa mucho
Mobile Web – desafíos
Input...
* Tipear en un móvil es lento y difícil


* No hay mouse


* Campos vs. etiquetas
Mobile Web – desafíos
Red...
* Ancho de banda muy limitado


* Alto nivel de intermitencia


* Costoso
Mobile Web – desafíos
El propio usuario...
* Baja curva de atención

* Busca un solo objetivo

* Puede estar moviéndose


Limitaciones del dispositivo...
* Soporte de colores                   * Vida de la batería

* CSS                                  * Procesador y almacenaje

* Cookies                              * Actualizaciones

* Javascript y plugins (Flash, Java)
Mobile Web – soluciones
✔   Evitar las tablas (y las anidadas)

✔   Evitar imágenes muy anchas

✔   Layout líquido / elástico

✔   Organización vertical, en una columna

✔   Mucho uso de listas

✔   Usar teclas de acceso o access keys

✔   Priorizar

✔   Optimizarlo todo (especialmente imágenes)
Mobile Web – soluciones
✔   No usar imágenes de fondo

✔   No popups (nunca)

✔   No mapas de imagen

✔   Sí Flash, pero con alternativas

✔   Pensar en la accesibilidad (alt en imágenes)

✔   Sólo usar GIF, JPEG y (PNG)

✔   CSS diferenciadas

✔   No usar Frames (nunca)
Mobile Web – soluciones
✔   Mejoras progresivas (progressive enhancement)

✔   Respetar estándares (siempre). W3C y MWI son mis amigos

✔   Testear

✔   Re-testear

✔   Volver a testear

✔   Requetecontra-testear!!!
coherente
a
t
r
a
c
t
i
v
o
s
i
m
p
l
e
funcional
Gracias!

                    Ricardo Barra, Noviembre 2009
                  info@placerdigital.net | @Chuqui

Más contenido relacionado

Destacado

Municipio chacao ((((plan de desarrollo urbano local))))),70 paginas
Municipio chacao ((((plan de desarrollo urbano local))))),70 paginasMunicipio chacao ((((plan de desarrollo urbano local))))),70 paginas
Municipio chacao ((((plan de desarrollo urbano local))))),70 paginas
martinserrano
 
Barcelona Bicing: Next steps
Barcelona Bicing: Next stepsBarcelona Bicing: Next steps
Barcelona Bicing: Next steps
Roc Boronat
 
El sector Media a Barcelona i Catalunya
El sector Media a Barcelona i CatalunyaEl sector Media a Barcelona i Catalunya
El sector Media a Barcelona i Catalunya
Barcelona Business
 
Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
Ventajas y desventajas sobre el transporte transporte tradicional y el mio. Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
Valentina Ipiales
 
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
Vicente Luis Benito Molina
 
Estratificación, movilidad social y educación
Estratificación, movilidad social y educaciónEstratificación, movilidad social y educación
Estratificación, movilidad social y educación
Johana Mejía
 

Destacado (20)

Trabajo practico medina
Trabajo practico   medinaTrabajo practico   medina
Trabajo practico medina
 
05 movilidad urbana-consultrans
05 movilidad urbana-consultrans05 movilidad urbana-consultrans
05 movilidad urbana-consultrans
 
Movilidad y Social Media
Movilidad y Social MediaMovilidad y Social Media
Movilidad y Social Media
 
El impacto de las apps en la movilidad
El impacto de las apps en la movilidadEl impacto de las apps en la movilidad
El impacto de las apps en la movilidad
 
Municipio chacao ((((plan de desarrollo urbano local))))),70 paginas
Municipio chacao ((((plan de desarrollo urbano local))))),70 paginasMunicipio chacao ((((plan de desarrollo urbano local))))),70 paginas
Municipio chacao ((((plan de desarrollo urbano local))))),70 paginas
 
Movilidad Sostenible, Segura y Humana: transformando la movilidad en nuestra ...
Movilidad Sostenible, Segura y Humana: transformando la movilidad en nuestra ...Movilidad Sostenible, Segura y Humana: transformando la movilidad en nuestra ...
Movilidad Sostenible, Segura y Humana: transformando la movilidad en nuestra ...
 
Barcelona Bicing: Next steps
Barcelona Bicing: Next stepsBarcelona Bicing: Next steps
Barcelona Bicing: Next steps
 
Pla Mobilitat Urbana 2013-2018
Pla Mobilitat Urbana 2013-2018Pla Mobilitat Urbana 2013-2018
Pla Mobilitat Urbana 2013-2018
 
La movilidad sostenible, segura y saludable - Unidad Didáctica de Movilidad S...
La movilidad sostenible, segura y saludable - Unidad Didáctica de Movilidad S...La movilidad sostenible, segura y saludable - Unidad Didáctica de Movilidad S...
La movilidad sostenible, segura y saludable - Unidad Didáctica de Movilidad S...
 
Urbanismo y-movilidad-sostenible
Urbanismo y-movilidad-sostenibleUrbanismo y-movilidad-sostenible
Urbanismo y-movilidad-sostenible
 
El sector Media a Barcelona i Catalunya
El sector Media a Barcelona i CatalunyaEl sector Media a Barcelona i Catalunya
El sector Media a Barcelona i Catalunya
 
Elementos en la gestión de la movilidad urbana
Elementos en la gestión de la movilidad urbanaElementos en la gestión de la movilidad urbana
Elementos en la gestión de la movilidad urbana
 
Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
Ventajas y desventajas sobre el transporte transporte tradicional y el mio. Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
Ventajas y desventajas sobre el transporte transporte tradicional y el mio.
 
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
Propuesta Movilidad Urbana Sostenible Plan Territorial Suroeste Metropolitano...
 
Estrategia smart city ajuntament bcn - la-salle_bcn
Estrategia smart city   ajuntament bcn - la-salle_bcnEstrategia smart city   ajuntament bcn - la-salle_bcn
Estrategia smart city ajuntament bcn - la-salle_bcn
 
Urbanismo y movilidad para una economía de crisis y un mundo post-carbono
Urbanismo y movilidad para una economía de crisis y un mundo post-carbonoUrbanismo y movilidad para una economía de crisis y un mundo post-carbono
Urbanismo y movilidad para una economía de crisis y un mundo post-carbono
 
L'estratègia Smart City de l'Ajuntament de Barcelona
L'estratègia Smart City de l'Ajuntament de BarcelonaL'estratègia Smart City de l'Ajuntament de Barcelona
L'estratègia Smart City de l'Ajuntament de Barcelona
 
Cultura digital y herramientas al servicio del líder político
Cultura digital y herramientas al servicio del líder políticoCultura digital y herramientas al servicio del líder político
Cultura digital y herramientas al servicio del líder político
 
Estratificación, movilidad social y educación
Estratificación, movilidad social y educaciónEstratificación, movilidad social y educación
Estratificación, movilidad social y educación
 
Bicing
BicingBicing
Bicing
 

Similar a Mobile Web

Dispostivos Móviles - Jerson Suaza
Dispostivos Móviles - Jerson SuazaDispostivos Móviles - Jerson Suaza
Dispostivos Móviles - Jerson Suaza
Biblioteca EPM
 
Intermedia
IntermediaIntermedia
Intermedia
ojopiojo
 
Contenido web en múltiples pantallas
Contenido web en múltiples pantallasContenido web en múltiples pantallas
Contenido web en múltiples pantallas
Edgar Parada
 
Facilitando el desarrollo web móvil, frameworks
Facilitando el desarrollo web móvil, frameworksFacilitando el desarrollo web móvil, frameworks
Facilitando el desarrollo web móvil, frameworks
PideCurso
 

Similar a Mobile Web (20)

Web móvil ¿inclusiva y accesible?
Web móvil ¿inclusiva y accesible?Web móvil ¿inclusiva y accesible?
Web móvil ¿inclusiva y accesible?
 
Web móvil: ¿inclusiva y accesible?
Web móvil: ¿inclusiva y accesible?Web móvil: ¿inclusiva y accesible?
Web móvil: ¿inclusiva y accesible?
 
Aplicaciones moviles en mozilla
Aplicaciones moviles en mozillaAplicaciones moviles en mozilla
Aplicaciones moviles en mozilla
 
Desarrollo de aplicaciones web móviles
Desarrollo de aplicaciones web móvilesDesarrollo de aplicaciones web móviles
Desarrollo de aplicaciones web móviles
 
Dispostivos Móviles - Jerson Suaza
Dispostivos Móviles - Jerson SuazaDispostivos Móviles - Jerson Suaza
Dispostivos Móviles - Jerson Suaza
 
¿Cómo empezamos nuestra primera mobile app?
¿Cómo empezamos nuestra primera mobile app?¿Cómo empezamos nuestra primera mobile app?
¿Cómo empezamos nuestra primera mobile app?
 
Desarrollo de aplicaciones web móviles
Desarrollo de aplicaciones web móvilesDesarrollo de aplicaciones web móviles
Desarrollo de aplicaciones web móviles
 
Barcamp Mobile Web
Barcamp Mobile WebBarcamp Mobile Web
Barcamp Mobile Web
 
Intermedia
IntermediaIntermedia
Intermedia
 
Cross Platform Frameworks
Cross Platform FrameworksCross Platform Frameworks
Cross Platform Frameworks
 
Html5+ccs3+js
Html5+ccs3+jsHtml5+ccs3+js
Html5+ccs3+js
 
INTRODUCCION A ANDROID
INTRODUCCION A ANDROIDINTRODUCCION A ANDROID
INTRODUCCION A ANDROID
 
Contenido web en múltiples pantallas
Contenido web en múltiples pantallasContenido web en múltiples pantallas
Contenido web en múltiples pantallas
 
Introducción a la web móvil
Introducción a la web móvilIntroducción a la web móvil
Introducción a la web móvil
 
Internet Móvil
Internet MóvilInternet Móvil
Internet Móvil
 
Responsive Web Design, ventaja, inconvenientes y recomendaciones
Responsive Web Design, ventaja, inconvenientes y recomendacionesResponsive Web Design, ventaja, inconvenientes y recomendaciones
Responsive Web Design, ventaja, inconvenientes y recomendaciones
 
MoviWeb: Plataforma para Soportar el Acceso a Sitios Web desde Dispositivos M...
MoviWeb: Plataforma para Soportar el Acceso a Sitios Web desde Dispositivos M...MoviWeb: Plataforma para Soportar el Acceso a Sitios Web desde Dispositivos M...
MoviWeb: Plataforma para Soportar el Acceso a Sitios Web desde Dispositivos M...
 
Facilitando el desarrollo web móvil, frameworks
Facilitando el desarrollo web móvil, frameworksFacilitando el desarrollo web móvil, frameworks
Facilitando el desarrollo web móvil, frameworks
 
Mobile Primero en Playa Valley 2011
Mobile Primero en Playa Valley 2011Mobile Primero en Playa Valley 2011
Mobile Primero en Playa Valley 2011
 
Joomla mobile
Joomla mobileJoomla mobile
Joomla mobile
 

Más de Observatorio de Comunicaciones Digitales

Más de Observatorio de Comunicaciones Digitales (20)

Ranking Digital 2011
Ranking Digital 2011Ranking Digital 2011
Ranking Digital 2011
 
Presentación CEPAL Ránking Digital 2011
Presentación CEPAL Ránking Digital 2011Presentación CEPAL Ránking Digital 2011
Presentación CEPAL Ránking Digital 2011
 
Presentación Alicia Bañuelos UDLP
Presentación Alicia Bañuelos UDLPPresentación Alicia Bañuelos UDLP
Presentación Alicia Bañuelos UDLP
 
Mike Alagna
Mike AlagnaMike Alagna
Mike Alagna
 
Mario cimoli
Mario cimoliMario cimoli
Mario cimoli
 
Janice bruno
Janice brunoJanice bruno
Janice bruno
 
Unplugged Estrategias En Movimiento
Unplugged Estrategias En  MovimientoUnplugged Estrategias En  Movimiento
Unplugged Estrategias En Movimiento
 
Chile Tvn
Chile TvnChile Tvn
Chile Tvn
 
Resultados Ranking Comunas Digitales 2009
Resultados Ranking Comunas Digitales 2009Resultados Ranking Comunas Digitales 2009
Resultados Ranking Comunas Digitales 2009
 
Conectividad Digital en Calbuco
Conectividad Digital en CalbucoConectividad Digital en Calbuco
Conectividad Digital en Calbuco
 
Infraestructura Digital para la Competitividad y la Innovación
Infraestructura Digital para la Competitividad y la InnovaciónInfraestructura Digital para la Competitividad y la Innovación
Infraestructura Digital para la Competitividad y la Innovación
 
Gestión del conocimiento en los municipios
Gestión del conocimiento en los municipiosGestión del conocimiento en los municipios
Gestión del conocimiento en los municipios
 
Ventanilla de Trámites Municipales
Ventanilla de Trámites MunicipalesVentanilla de Trámites Municipales
Ventanilla de Trámites Municipales
 
El impacto de la digitalización de comunas en Argentina
El impacto de la digitalización de comunas en ArgentinaEl impacto de la digitalización de comunas en Argentina
El impacto de la digitalización de comunas en Argentina
 
Cómo las TI pueden beneficiar a una comunidad
Cómo las TI pueden beneficiar a una comunidadCómo las TI pueden beneficiar a una comunidad
Cómo las TI pueden beneficiar a una comunidad
 
Brechas digitales
Brechas digitalesBrechas digitales
Brechas digitales
 
Comunidad Virtual para la Educación
Comunidad Virtual para la EducaciónComunidad Virtual para la Educación
Comunidad Virtual para la Educación
 
Conectivismo por Wikieduca
Conectivismo por WikieducaConectivismo por Wikieduca
Conectivismo por Wikieduca
 
Tecnología Educativa, Mas allá de Google el buscador
Tecnología Educativa, Mas allá de Google el buscadorTecnología Educativa, Mas allá de Google el buscador
Tecnología Educativa, Mas allá de Google el buscador
 
Nuevo Rol Del Docente En La Era
Nuevo Rol Del Docente En La EraNuevo Rol Del Docente En La Era
Nuevo Rol Del Docente En La Era
 

Último

Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Fernando Solis
 
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACIONRESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
amelia poma
 

Último (20)

CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptxCONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
 
PINTURA DEL RENACIMIENTO EN ESPAÑA (SIGLO XVI).ppt
PINTURA DEL RENACIMIENTO EN ESPAÑA (SIGLO XVI).pptPINTURA DEL RENACIMIENTO EN ESPAÑA (SIGLO XVI).ppt
PINTURA DEL RENACIMIENTO EN ESPAÑA (SIGLO XVI).ppt
 
Lecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigosLecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigos
 
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIASISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
 
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
 
Linea del tiempo - Filosofos Cristianos.docx
Linea del tiempo - Filosofos Cristianos.docxLinea del tiempo - Filosofos Cristianos.docx
Linea del tiempo - Filosofos Cristianos.docx
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPCTRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
 
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
 
AEC 2. Aventura en el Antiguo Egipto.pptx
AEC 2. Aventura en el Antiguo Egipto.pptxAEC 2. Aventura en el Antiguo Egipto.pptx
AEC 2. Aventura en el Antiguo Egipto.pptx
 
Usos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicasUsos y desusos de la inteligencia artificial en revistas científicas
Usos y desusos de la inteligencia artificial en revistas científicas
 
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACIONRESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
RESOLUCIÓN VICEMINISTERIAL 00048 - 2024 EVALUACION
 
Tema 11. Dinámica de la hidrosfera 2024
Tema 11.  Dinámica de la hidrosfera 2024Tema 11.  Dinámica de la hidrosfera 2024
Tema 11. Dinámica de la hidrosfera 2024
 
Novena de Pentecostés con textos de san Juan Eudes
Novena de Pentecostés con textos de san Juan EudesNovena de Pentecostés con textos de san Juan Eudes
Novena de Pentecostés con textos de san Juan Eudes
 
Supuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docxSupuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docx
 
PP_Comunicacion en Salud: Objetivación de signos y síntomas
PP_Comunicacion en Salud: Objetivación de signos y síntomasPP_Comunicacion en Salud: Objetivación de signos y síntomas
PP_Comunicacion en Salud: Objetivación de signos y síntomas
 
Factores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdfFactores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdf
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 2º de la ESO
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 

Mobile Web

  • 1. Inteligencia en Movimiento Promesas y desafíos de las plataformas móviles                   Ricardo Barra, Noviembre 2009 info@placerdigital.net | @Chuqui
  • 2. Acerca de mí ● 15 años sumergido ● DOS, Usenet, Mosaic (Netscape), NetMeeting ● Blog desde el 2003, Twitter desde el 2007 ● Diseño ● Programación ● Comunicaciones ● Marketing ● Profe
  • 3. Mobile Web – la promesa Luego de frustrados intentos por traer la Web a los dispositivos portátiles (WAP 1.0), hay que precisar que la Mobile Web tiene muchas ventajas... ✔ Va contigo ✔ La audiencia es gigantesca ✔ No necesita cables ✔ Se puede operar con una mano ✔ Especial proyección en países como Chile
  • 4. Mobile Web – cifras y stats El año 2007 el número de usuarios con teléfonos con navegador, superó a la cantidad de autos (800 millones), PCs (850 millones), usuarios de Internet convencional (1,1 billones), e incluso la cantidad de TVs (1,5 billones)
  • 5. Mobile Web – cifras y stats Usuarios activos han crecido 30% cada año entre el 2006 y 2010
  • 6. Mobile Web – cifras y stats Aumento del tráfico mensual desde junio del 2008 Causas: - Llegada de los smartphones. Hace 1 año, el 20% del tráfico. - Redes sociales y microblogging
  • 7. Mobile Web – más stats ✔Según Nokia, existen cerca de 2 billones de celulares con Internet circulando en el mundo ✔Sólo usando Opera Mini, en marzo del 2008 hubo más de 2,4 billones de páginas vistas ✔ Más de un 13% de los estadounidenses accede a sus sitios favoritos solamente desde el móvil ✔En India hay 4 veces más usuarios de Internet Móvil que usando PC
  • 8. Mobile Web – desafíos ✔ Tamaño de la pantalla ✔ Input ✔ Ancho de banda, intermitencia y $$$ ✔ Objetivos del usuario ✔ Limitaciones de los dispositivos
  • 9. Mobile Web – desafíos Resolución... * Resolución típica de un PC: 1024x768 * Celular normal: 200x200: 20x menor * Smart phone: 320x480: 5x menor * Próximos dispositivos a 800x600
  • 10. Mobile Web – desafíos Resolución... * 30 a 90 veces más pequeño * generalmente vertical * teclados virtuales ocupan mucho espacio
  • 11. Mobile Web – desafíos Ejemplo...
  • 12. Mobile Web – desafíos En un móvil... * Scroll y zoom * Navegación oculta contenido * Pesa mucho
  • 13. Mobile Web – desafíos Input... * Tipear en un móvil es lento y difícil * No hay mouse * Campos vs. etiquetas
  • 14. Mobile Web – desafíos Red... * Ancho de banda muy limitado * Alto nivel de intermitencia * Costoso
  • 15. Mobile Web – desafíos El propio usuario... * Baja curva de atención * Busca un solo objetivo * Puede estar moviéndose Limitaciones del dispositivo... * Soporte de colores * Vida de la batería * CSS * Procesador y almacenaje * Cookies * Actualizaciones * Javascript y plugins (Flash, Java)
  • 16. Mobile Web – soluciones ✔ Evitar las tablas (y las anidadas) ✔ Evitar imágenes muy anchas ✔ Layout líquido / elástico ✔ Organización vertical, en una columna ✔ Mucho uso de listas ✔ Usar teclas de acceso o access keys ✔ Priorizar ✔ Optimizarlo todo (especialmente imágenes)
  • 17. Mobile Web – soluciones ✔ No usar imágenes de fondo ✔ No popups (nunca) ✔ No mapas de imagen ✔ Sí Flash, pero con alternativas ✔ Pensar en la accesibilidad (alt en imágenes) ✔ Sólo usar GIF, JPEG y (PNG) ✔ CSS diferenciadas ✔ No usar Frames (nunca)
  • 18. Mobile Web – soluciones ✔ Mejoras progresivas (progressive enhancement) ✔ Respetar estándares (siempre). W3C y MWI son mis amigos ✔ Testear ✔ Re-testear ✔ Volver a testear ✔ Requetecontra-testear!!!