Desarrollo web móvil… ¿Por dónde empezar?

Desarrollo web móvil de proyectos En primer lugar, siendo conscientes del peso e importancia del concepto de movilidad en los tiempos actuales.

Mobile is King, aunque ya hemos dado los primeros pasos que nos adentrarán, en unos años, en la era post-Smartphone. El Futuro en realidad pertenece al Wearable Computing.

Ni te asustes ni te adelantes. Como todo en esta vida y en los negocios, has de ir etapa por etapa. Y todavía queda todo por hacer en la era del móvil.

¿Por qué tengo que invertir en desarrollo móvil?

Porque tus usuarios están ahí. Mira las estadísticas de tu web. Me atrevo a aventurar que sobre el 30% de todo tu tráfico ya viene vía dispositivos móviles.

Para el 2014, el tráfico generado en Internet por dispositivos móviles superará al tráfico generado por PCs.

Más del 55% de accesos a Facebook son vía móvil (las Redes Sociales, nacidas en la era del PC, son en realidad el primer producto nativo para móviles)

El 88% de los usuarios ha realizado una búsqueda local con su smartphone, y el 86% de esos usuarios ha realizado alguna acción como resultado de esa búsqueda.

¿Sigues sin convencerte? Esto seguro que lo hace. En el mundo, hay más móviles que cepillos de dientes.

Quiero desarrollar para móviles… ¿Móvil o App?

Deberías invertir en ambos. Eso sí, los recursos son limitados y has de priorizar.

Ten esto siempre en mente:

Web móvil para las masas. Aplicación móvil para tu cliente fiel.

Empieza por una web adaptada a móviles. Tendrá más audiencia y visitas que la app móvil.

Una app ha de dar algo más. Utilizar de forma nativa el hardware del teléfono. Dar un valor añadido y exclusivo que no puede encontrarse en la web. Y lo has de hacer al menos para plataforma Android y iPhone (sí, pongo primero Android ya que 9 de cada 10 activaciones de teléfonos en España son Android).

Por tanto, por su complejidad y particularidad, una estrategia de desarrollo de aplicaciones móviles merece otro post.

Web móvil. ¿Por dónde empiezo?

Tienes tres opciones. Todas son válidas y según contexto:

Web dedicada y exclusiva a móviles. Tienen este formato; m.misitioweb.com. URL y HTML son distintos en ambas páginas

Web con mismo HTML y URL. Es el famoso Responsive Design, lo que recomienda Google

Misma URL, distinto HTML. Mantienes la misma URL pero sirves un HTML (y CSS) distinto. Se conoce como Dynamic Serving.

Recomiendo descartar el desarrollo de web con dominios .mobi (mi sitio web.mobi). Es un dominio reservado para teléfonos tradicionales pero que, salvo alguna campaña de Mobile Marketing basada en SMS, no merecen la pena gastar recursos en web adaptadas a móviles cuyos usuarios no navegan por móvil.

1 Web dedicada y exclusiva a móviles

Ha sido el estándar hasta hace prácticamente un año hasta que Google se decantó por el Responsive Design desde hace apenas un año (2012).

Aun así no es una mala opción. La mayoría de profesionales del desarrollo móvil la recomienda. Con una web dedicada a móvil puedes jugar con el “contexto”, mostrando la información que mejor se adapta al usuario según el momento.

Ventajas:

Web pensada y dedicada para móviles. En general, carga y navegación más rápida

Uso del “contexto”. Según dónde esté el usuario o cómo acceda puedo personalizar el desarrollo para conseguir una acción

Puedes adaptar más fácilmente el contenido de tus secciones a un usuario que leerá mucho menos texto que cuando está con el PC, o que no será capaz de rellenar un formulario largo.

Desventajas

Doble de trabajo. Has de mantener un desarrollo paralelo a tu site

Más carga de SEO móvil. Has de implementar las etiquetas switchboard para evitar la penalización de tu site por duplicación, configurar los ficheros robots.txt y sitemap.xml etc.

Estos desarrollos al final acaban en ser versiones minis de la web de escritorio, llevando al usuario a frustrarse y a elegir ver la versión original de la web.

2 Web con mismo HTML y URL. Responsive Design

Para mí es lo ideal cuando se diseña o rediseña un sitio de cero. Si no se diseña desde cero el trabajo será mayor e implicará algún cambio en la web, pero también es, en general, la mejor opción.

Mostrar la misma URL y HTML significa que todos los elementos de la web se reajustan en ancho y altura adaptándose al tamaño de tu pantalla.

Al contrario que con el desarrollo para PC, en general el scroll en una pantalla móvil no ha de asustarte. El usuario está habituado a hacer scroll vertical en el móvil.

Las principales ventajas del desarrollo en Responsive Design son:

Un solo site para múltiples aparatos (PC, móvil y Tablet). Una vez desarrollado, casi te puedes olvidar de la optimización en cada dispositivo incluso cuando creas nuevos contenidos

Mucho más fácil y económico de manejar. El SEO se simplifica, te aprovechas de tu posicionamiento actual y no has de mantener dos páginas distintas con el mismo objetivo o contenido

Opción recomendada por Google. No es ninguna tontería y, aunque Google no penaliza los sites desarrollados exclusivamente para móviles, se decanta por el Responsive.

La principal desventaja parece clara. No personalizas el contenido y contexto móvil al usuario. Le sirves exactamente lo mismo esté en su casa, en la parada del autobús o dentro de tu negocio.

3 Dynamic Serving. Misma URL, distinto HTML

La considero una modalidad del Responsive Design. Sirves la misma URL pero cambias el HTML. Te sirve para ocultar o mostrar ciertos elementos que, según el contexto, no tienen sentido en móvil o en la versión escritorio.

Te permite un poco más de personalización y hacer uso del contexto del usuario. Puedo jugar, como negocio, a enseñar el número de teléfono de mi negocio o un botón de cómo llegar siempre visible en la cabecera de mi web móvil que, en una navegación por escritorio, no tiene sentido.