Conceptos básicos para entender el diseño responsive

El desarrollo de páginas web ha evolucionado mucho en los últimos años, sobre todo desde la aparición y consolidación de dispositivos móviles (tabletas y smartphones) con diferentes tamaños de pantalla. Este hecho ha provocado que sea obligatorio para cualquier web ser visible en cualquiera de estos dispositivos, algo que aún, por sorprendente que parezca, hay muchas empresas que no cumplen.

El diseño que permite que una página web se vea bien en cualquier dispositivo se llama responsive, y lo que hace básicamente es reestructurarse para adaptarse a las dimensiones de la pantalla en cuestión. No debe confundirse, algo muy frecuente, una web responsive con una web adaptativa, ya que ésta última está creada con unos tamaños predefinidos, no proporcionales.

Profundizando un poco más en el diseño responsive, hay una serie de elementos fundamentales que lo caracterizan, y que vamos a repasar a continuación:

– Existen las llamadas unidades relativas, que nos permiten, a la hora de diseñar una página web, definir el % del espacio que va a ocupar un determinado elemento.

– La adaptación del contenido al tamaño de la pantalla se consigue con los llamados puntos de interrupción, que hacen que el contenido se muestre a una columna, por ejemplo, cuando se ve desde un smartphone.

– Este concepto guarda relación con lo que se conoce en diseño web como flujo, que hace que los contenidos se desplacen hacia abajo sin llegar a superponerse, permitiendo así su lectura.

– En un diseño responsive puedes determinar un ancho máximo de seguridad que no podrá superar un elemento para que no se deforme. Aunque indiques que ocupe el 100% de la pantalla, nunca superará ese máximo de seguridad.

– Por último, hay que hablar de los elementos anidados, es decir, elementos que unimos para que se comporten como uno solo a la hora de adaptarse a los diferentes tamaños.

Como es evidente, WordPress ofrece entre sus plantillas una gran variedad con diseño responsive, por lo que resulta mucho más fácil su configuración a partir de los elementos que hemos señalado. ¿A pesar de eso tienes dudas? Pues no te lo pienses y contacta con nosotros.