¿Qué es el Diseño Responsive o adaptativo?

Posted febrero 17, 2014

El diseño web adaptativo, también conocido con su denominación en inglés “responsive”, es una técnica de maquetado que le permite a los sitios web visualizarse correctamente en diferentes dispositivos electrónicos, adaptándose al tamaño de las pantallas de cada uno de ellos.

El diseño adaptativo nace con la necesidad de cubrir el mercado de usuarios de dispositivos móviles, el cual es un fenómeno con tendencia creciente, contando actualmente con más de la mitad de los usuarios que navegan por la internet.

¿Cómo funciona?

Básicamente, el diseño responsive actúa mediante adaptaciones en la hoja de estilo (stytlesheet) con extensión .css, que contiene todos los parámetros de colores, tamaños de bloques, ubicación de los elementos y demás variantes de diseño de un sitio.

Cada pantalla debe contar con su propias adaptaciones de hoja de estilo, las cuales se mostrarán (o no) a través de una llamada en el código HTML de cada página web, de acuerdo al navegador que se detecte en el momento. Es decir, si el sitio se está cargando en un iPhone 5, el sitio detectará el navegador (y el tamaño de la pantalla) a usarse y aplicará la hoja de estilo que nosotros indicamos que corresponde a dichos parámetros.

¿Cuáles son las ventajas?

Primero y principal: la experiencia del usuario. Esto está más que claro.

Una buena experiencia del usuario trae como consecuencia la obtención de todos (o casi todos) los objetivos que nos hemos planteados para con el sitio web en cuestión: conversiones, leads (contactos), viralidad en redes sociales, navegación a través de las páginas, retorno de las visitas, etc. Lo que sea que nos hayamos planteado que queremos conseguir con nuestro website, está íntimamente ligado a que si el usuario se siente a gusto o no con lo que le estamos ofreciendo.

Por otra parte, no podemos dejar de mencionar la importancia del diseño responsive en el posicionamiento en motores de búsqueda (SEO). Este es un parámetro muy tenido en cuenta por los robots de Google a la hora de posicionar una web por encima de otra de la competencia, ya que no solo ofrece una mejor experiencia a los internautas (como mencionábamos) sino que también hace que el sitio se cargue más rápidamente en dispositivos móviles, cumpliendo también con otra buena práctica del SEO: la “velocidad de carga”.