Responsive Web y Mobile Web

A día de hoy es fundamental que las páginas web sean cómodamente accesibles desde cualquier dispositivo, ya que una parte importante del tráfico llegará desde teléfonos móviles o tabletas y el usuario debería seguir siendo capaz de visualizar sin problemas el contenido.

En general, hay dos métodos para conseguir esto: responsive web o mobile web. Con web mobile la idea es crear una web distinta, específicamente diseñada para dispositivos móviles, de la que se mostrará en el ordenador. La idea de la web responsive es en cambio simplemente adaptar el contenido al tamaño de la pantalla del dispositivo.

Mobile Web

Crear una web independiente para teléfonos tiene obvias ventajas a nivel de diseño: ya que es más específico permitirá una mejor experiencia para el usuario. A nivel de SEO, el consenso es que la mobile web es ligeramente mejor; aunque tanto la web responsive como la mobile pasan el GoogleMobile-Friendly Test, el tener copias de las páginas para la versión móvil cuyo contenido varía ligeramente podría beneficiar el posicionamiento.

El tener un diseño distinto garantiza usabilidad y mejoras en la experiencia en general, como a la hora de cargar contenido (lo que también espositivo para el posicionamiento), pero supone más mantenimiento y, al existir sobre una carpeta distinta del dominio (mobile.) requerirá un script de redirección.

Responsive Web

La otra opción es hacer la web responsive, la opción más cómoda para sitios más pequeños y con menos subdirectorios. Puede ser complicado de implementar, ya que habrá encajar imágenes para pantallas muy distintas, tener en cuenta que no se podrán cargar tantos recursos (tipografías …) como se usarían en una web normal a fin de no ralentizar la navegación; y pese a conseguir un código correcto adecuado a las directrices de Google este será más lento.

La parte positiva es que la web responsive mantiene la misma dirección, así que es más sencillo que la versión mobile; y también supone mucho menos mantenimiento.

Conclusión

Al final, la opción que elijas dependerá de tus necesidades. Si la web original tiene poco texto, productos o información responive ahorra efectivamente mucho tiempo y esfuerzo.

Sin embargo, si la página original es muy compleja o tiene mucha información en el teléfono se visualizaría abarrotada de información y difícil de navegar; en cuyo caso la mejor solución sería crear un web mobile.

También hay que valorar desde dónde llega el tráfico a la web. En general provendrá mayoritariamente del ordenador, pero a partir de un 30 - 35% es recomendable comprobar cuál de las opciones anteriores se adaptan mejor a los planes y necesidades del sitio e implementar la opción elegida.

Hay que tener en cuenta que, pese a esta distinción, es recomendable que la web ser responsive, no sólo para poder adaptarse a otros dispositivos por llegar, sino para evitar perder legibilidad si se cambia el tamaño de la ventana en el ordenador, por ejemplo.

5 maneras de optimizar tu diseño web móvil

Con la creciente influencia de la tecnología móvil en el mundo del diseño web y el comercio electrónico, es una buena idea centrarse en tener un gran diseño móvil para tu sitio. El diseño de escritorio de tu web puede verse y funcionar de manera correcta en un ordenador portátil o de escritorio, pero en una interfaz móvil, puede no ir tan bien. Para aumentar la eficacia de tu sitio, es vital crear una nueva versión de tu página principal optimizada para dispositivos móviles. Aquí hay cinco maneras de hacer que el diseño móvil de tu página web luzca y funcione bien.

1. Hazlo sencillo

La clave para un gran diseño móvil y su máxima facilidad de uso es una apariencia simple y limpia. Con una vida útil de la batería reducida, pantallas más pequeñas y menos opciones de energía, un sitio móvil con menos cosas que cargar hará más por los visitantes de tu sitio. Además, un diseño limpio puede verse mejor en los diferentes tipos de plataformas móviles que los usuarios pueden estar operando, como Android o Apple.

2. Usa el mismo contenido de tu web

Tu diseño móvil será una mejor inversión si también tiene contenido que refleja tu sitio web regular. La idea es servir a diferentes tipos de usuarios que pueden estar ingresando a tu sitio únicamente a través de un dispositivo móvil. Con más gente pasando tiempo en los dispositivos móviles que en los ordenadores de escritorio o portátiles, la experiencia del visitante debe ser similar en todos los dispositivos. De esta manera, tus usuarios móviles no perderán las características del sitio web ni su funcionalidad.

3. Céntrate en la experiencia del usuario

El enfoque principal debe estar en la experiencia de usuario. Esto significa que debes optimizar la navegación para hacerla simple y de fácil acceso desde una pantalla más pequeña. El tiempo de carga no debe ser demasiado largo, de lo contrario, tus visitantes podrían frustrarse e ir al sitio web de un competidor. Limita el uso de texto u otros tipos de entrada en tu diseño móvil para ofrecer a los potenciales clientes una experiencia más fluida.

4. Selecciona una fuente móvil agradable

Con tu diseño móvil, la fuente importa más de lo que piensas. Muchos diseñadores web expertos recomiendan una fuente sans serif para una mejor legibilidad. También debes considerar el tamaño de la fuente y cómo se mostrará en varios tipos de pantallas. Una fuente demasiado pequeña puede ser imposible de leer para la mayoría de los usuarios.

5. Prueba el diseño una vez hecho

Por encima de todo, tiene sentido pasar mucho tiempo probando tu diseño y viendo cómo funciona en tiempo real. Puedes contratar servicios de pruebas profesionales o navegar tú mismo por tu web utilizando una variedad de dispositivos móviles y de escritorio. Haz pruebas usando una tableta de tamaño estándar y un teléfono inteligente más pequeño para ver si los puntos importantes son visibles y fáciles de navegar.

Tener la versión móvil de tu sitio web bien configurada es una gran forma de abrir la accesibilidad de tu presencia en línea. Asegúrate de centrarte en seguir algunas reglas de diseño para dar a tu sitio móvil el mejor potencial para el éxito o pide ayuda a profesionales en Diseño web.