Revolución móvil, HTML 5 y responsive design

La revoluciónmóvil

2012

Computadoras

Celulares

Tabletas

Ecosistemas

Nuevas herramientas

El mundo de las aplicaciones

¿Qué son?

Multi plataforma

Planeta

1

Mundo Apple/IosApp Store

iPhoneiPod

iPod Touch

iPad

iOS 6.1

Planeta

2

Mundo google/androidGoogle Play

Samsung GalaxyHTC

Motorola

Google Nexus

AndroidJelly Bean 4.2

Planeta

3

Mundo BLACKBERRYBlackberry World

Blackberry TorchBlackberry CurveBlackberry Bold

Blackberry Z10

Planeta

4

Mundo microsoftWindows Phone store

Nokia LumiaSamsungHTCHuawei

Modos adaptables

El nuevorey

34% del tráfico total del FT viene de móviles

15-20% de las nuevas suscripciones se venden desde un celular

12% de las ganancias x publicidad del FT proviene de móviles

“The audience is clearly moving to mobile, and we need to be where the audience is.

Saboresy colores

Chau plug ins!!

Video y multimediaGráficosSonidoInteractividadVelocidadOffline

Vs

Y/O

El mundo de ozOtros ejemplosAppleChrome20things…

Yendo de la cama al living

Uno para todos todos para uno

Ventajas responsive design

SEO. Sólo hay una web (HTML + CSS), URL es única para todos los dispositivos. Se evitan redirecciones de unas versiones a otras  

UX. User eXperience.  El usuario accede al mismo website con independencia del dispositivo que utilice. Coherencia.

Integridad. Sólo hay una estructura HTML y una única hoja de estilo CSS para todos los dispositivos. 

Costes. Requiere más tiempo de desarrollo y es más cara, pero implica menos mantenimiento (hay que revisar 1 hoja de estilo).

Adaptaciones móviles

Mobile

Desktop en smartphone

Los sitios web mobile-friendly “convierten a los usuarios en clientes”

What Users Want Most from Mobile Sites Today (Google, setiembre 2012)

61% “Si no encuentro rápido lo que estaba buscando en un sitio móvil, me voy a otro”

50% “Si la web de mi negocio favorito no tiene salida móvil, lo usaría menos o lo cambiaría por otro”.

Pensar y crear en clave de móviles

Contenido demasiado limitadoDominios múltiples. Pop-ups. Videos que no se pueden verRedireccionamiento falllido.Tiempo de carga  PageSpeed

jQuery

UnderscorejPlayer

HTML5 videojQuery Reel

jQuery address

http://www.thinkwithgoogle.com/mobileplanet/es/