Cuando hablamos de diseño responsive nos referimos a la adaptación de un diseño para su correcta visualización en todo tipo de pantallas, es decir, no sólo las clásicas pantallas de ordenador y portátil, sino también dispositivos móviles como smartphones y tablets. Esto es importante si tenemos en cuenta que cada vez más gente accede a internet a través de sus dispositivos móviles y que éstos, les permiten estar conectados cada vez más tiempo y desde cualquier lugar.
Adaptación automática
Hoy en día existen herramientas que nos permiten establecer una adaptación automática de los elementos del diseño estableciendo los breakpoints, que son algo así como las dimensiones límite de pantalla a partir de las cuales se detecta e identifica un dispositivo como un ordenador, tablet o smartphone. Esta adaptación automática permitirá al usuario visualizar correctamente todos y cada uno de los elementos de la página e interactuar con ella de la misma manera que si estuviera viéndola en un ordenador de sobremesa u ordenador portátil.
No obstante, la adaptación a dispositivos móviles no debe ser sólo física. El reducido tamaño de pantalla de los dispositivos móviles hace que lo que sería un recorrido breve a lo largo de una página se convierta en 5 minutos haciendo scroll con nuestro dedo. O que funcionalidades como un zoom automático o un banner emergente impidan o dificulten al usuario continuar su recorrido por nuestra página. O que determinados titulares de texto o fotografías aparezcan cortados donde no nos interesa…
Adaptación del diseño a dispositivos móviles
Tenemos que ponernos en el lugar del usuario. Nuestra página no sólo debe ser operativa para dispositivos móviles, sino también cómoda y usable. Debemos replantearnos la maqueta: reduciendo tamaños de texto, ajustando márgenes, sustituyendo composiciones de varias imágenes por un único slider con desplazamiento lateral, replantearnos el orden de aparición de los contenidos, fijar menús o incluir botones para desplazarse verticalmente hasta la parte superior de la página, etc.
En esta adaptación el sentido común y la experiencia del usuario juegan el papel protagonista. A veces basta con unos pocos ajustes para que nuestra página funcione a nivel de usabilidad en dispositivos móviles. Pero otras veces debemos adaptar tantos elementos y funcionalidades que es como diseñar tres páginas dentro de una.
¿Cómo saber si mi página está adaptada para dispositivos móviles?
Existe una utilidad de Google Chrome muy interesante. Si abres tu página con este navegador y sobre ella haces click con el botón derecho de tu ratón y luego pulsas “Inspeccionar” se te abrirá un panel a tu derecha. Verás que en la parte superior de ese panel hay un icono con forma de tablet y móvil; si lo pulsas se mostrará en la parte superior de tu página, justo debajo de la barra del navegador, un selector con distintos tamaños de pantalla que te permitirá ver de forma simulada cómo se visualizaría tu página en un ordenador, tablet o móvil de diferentes medidas. Incluso tiene una opción para añadir medidas personalizadas (Edit). Esta simulación nos permitirá ver cualquier tipo de fallo técnico o de diseño que pueda estar afectando a la navegación de nuestros usuarios desde cualquier dispositivo móvil.
Si quieres que te ayudemos a hacer tu página no sólo visible, sino también práctica para tus usuarios, accedan desde el dispositivo que accedan, contáctanos sin compromiso. Somos expertos en diseño web y podemos darte una solución en el menor tiempo posible.