Guía: Cómo Preparar Tu Sitio Web Para Las Visitas Móviles

Actualmente el tráfico de navegación web puede separarse en dos aguas, los que visitan un sitio web desde una PC tradicional y los que llegan desde los dispositivos móviles, entiéndase celulares, tablets, televisores y otros dispositivos no tradicionales.

Si vemos las estadísticas a fondo, las visitas móviles ganan terreno a paso agigantado a las visitas de escritorio. La amplia diversidad de dispositivos, tanto en precios, tamaños, sistemas operativos y especificaciones técnicas, aunado a la aparición de sistemas operativos abiertos como Android, han creado un tsunami de visitas que no vienen desde los dispositivos tradicionales y que en muchos casos no solo igualan sino que superan ampliamente a estas últimas. Es por ello que todo administrador/diseñador/desarrollador de un dispositivo web debe prepararse en el remoto caso que esa ola móvil aún no haya llegado a su puerta. Debe añadir la capacidad de su sitio web para responder a estos nuevos visitantes y para ello hay varias formas de hacerlo.


Una de ellas, la más tradicional es crear una versión móvil del sitio, diferente a la versión web. Esto nos permite trabajar ambos diseños de forma separada e independiente, lo cual puede redundar en tiempos de carga más cortos para la versión móvil, al evitar scripts de detección de dispositivos (puesto que en la versión móvil ya sabemos que nos visitarán desde un dispositivo móvil) y teniendo en cambio una URL dedicada para ello (un subdominio, por ejemplo: m.misitio.com). Ejemplos de ello tenemos en sitios como Facebook y Casino.com. La desventaja de esta técnica es que puede requerir duplicar esfuerzos de desarrollo al tener dos versiones en vez de una sola, pero es la técnica adecuada si entre tus visitantes cuentas con un porcentaje significativo de usuarios con teléfonos que pueden navegar pero con capacidades limitadas de memoria o con velocidades de conexión en redes muy lentas (en países del 3er mundo).

Otra forma de aproximarse a una solución ideal es la técnica denominada Responsive Web Design (RWD), que en español se conoce como Diseño Web Responsivo, Adaptable o Flexible. En mi caso personal prefiero esta última definición, Diseño Web Flexible.

El Diseño Web Flexible consiste en añadir al sitio web la capacidad de responder al dispositivo que lo contiene, una propiedad similar a la del agua, la cual toma la forma del recipiente donde la depositemos, por poner un ejemplo de la naturaleza. En nuestro caso significa que nuestro sitio se adaptará al tipo de dispositivo desde donde nos visitan, modificando formas, tamaños, colores, menúes y posiciones de los distintos elementos que lo conforman, de tal forma que se muestre siempre la mejor versión de acuerdo a dicho dispositivo. Esto con el fin de mejorar la usabilidad y capacidad de interacción del usuario con el sitio web, considerando que al estar desde un dispositivo móvil la navegación debe ser rápida e intuitiva (más de lo normal), la información fácil de conseguir y mostrada en un formato de agradable lectura, pensando siempre en que el usuario suele estar en situación de movilidad (en el carro, en la calle, en un centro comercial, en el trabajo) y que ello implica menos capacidad de atención al dispositivo móvil o el uso con una sola mano. Inclusive, bajo este enfoque se pueden enriquecer los resultados de las búsquedas dentro de nuestro sitio web, agregando información relevante como mapas y acceso rápido al marcado de los números telefónicos de contacto que solemos colocar en un sitio web.

Al trabajar con RWD, trabajaremos en base a varios diseños correspondientes a los dispositivos que nos visitan y al momento de cargar el sitio, se determina qué tipo de dispositivo ejecuta nuestra página (teléfono, tablet, PC, TV y otros) y vía una combinación de Javascript y CSS la página mutará, adaptándose al dispositivo previamente detectado. Esto trae como beneficio inmediato una mejor respuesta al usuario por medio de un diseño adaptable que provee una mejor interfaz (UI) y una mejor interacción del usuario (UX), aumentando la usabilidad de nuestro sitio web, requisito indispensable para la retención del visitante, para aumentar el tiempo que nos visita y sobre todo, para aumentar el enganche (engagement) del usuario con nuestro sitio, lo cual según estudios aumenta su disposición a interactuar con el sitio e incluso ha aumentado el porcentaje de ventas de sitios como Amazon.

Es importante resaltar que el RWD en sí mismo no es un producto ni una solución de software empaquetada, es la unión de varias técnicas que van a permitir agregar inteligencia a nuestro sitio para que sepa desde qué dispositivos nos visitan y actuar en consecuencia. Es de vital importancia en el desarrollo web móvil moderno y aunque no es la única manera de actuar ante los visitantes móviles, sí que es la más aceptada y la más difundida por la industria del desarrollo web.

Sitios de ventas como Amazon, eBay, AliExpress y Best Buy, de entretenimiento como Netflix, o nuestra comunidad Android Venezuela cuentan ya con Responsive Web Design o Diseño Flexible, de tal forma de aumentar la satisfacción de nuestros visitantes por medio de una experiencia de visita placentera que les permita conseguir rápidamente lo que buscan, enterarse de lo último en noticias tecnológicas, interactuar fácilmente con otros usuarios y lograr los objetivos de su visita sin problema alguno.

Like
Like Love Haha Wow Sad Angry

José Rojas

Geek. Full Stack Web Developer. Android Developer.
Ingeniero en Informática. Msc. en Ingeniería de Software.
Trabajo con Linux, Android, Python, Ruby on Rails, Node, React.
Experto en Wordpress. Creador de Android Venezuela

  • Rafael Ernesto Sanchez

    Buen articulo, claro y sencillo de entender para gente interesada en el tema pero que no maneja el maquetado y programación web. Me he encontrado con clientes que preguntan que si yo uso el programa de “Responsive web design”. Incluso un cliente en una oportunidad pensaba que eso se compraba con el hosting y que automáticamente la pagina tendría la característica de “responsive”

    • Muchas gracias por tu comentario. Clientes como ese hay muchos, hay que orientarlos para que puedan adoptar la mejor solución a sus necesidades. Un saludo amigo

Nuestras Redes

Síguenos en donde quieras!

Recibe nuestras noticias por correo (cero spam)

Ofertas en Amazon

GearBest

Síguenos

Mantente al día. Opina. Pide ayuda.
Saluda. Queremos escucharte

Más en Android, Guias
No vas a creerlo: Android 7.1 Nougat corriendo en un Nokia Lumia 520

Que Android corre en muchas plataformas diferentes ya lo sabes. Pero esto quizás te sorprenda tanto como a nosotros. Ejecutarse...

Cerrar