Moda, Tendencias, Estilos. Compras y experiencias en la red

¿Qué es un diseño web responsive?


El diseño web responsive equivale a la capacidad que tiene un sitio web de adaptarse a la pantalla de distintos dispositivos y que su contenido siga siendo legible y funcional. Esto equivale a que no importa cuanto se reduzca el ancho o alto de la pantalla en la que se visualiza el sitio, el tamaño de las imágenes, de la letra los menús y la interfaz van a seguir permitiéndole al usuario la mejor experiencia posible.

De cierta forma busca hacer que el contenido de la interfaz, sea fluido y no estático, y que de esta forma responda a las necesidades del usuario.

OJO: un sitio web responsive no es lo mismo que una web para móviles, el sitio web responsive es un solo sitio que puede adaptarse a cualquier dispositivo, mientras que el sitio web para móviles se diseña desde cero pensando principalmente en un dispositivo móvil.

Para lograr que nuestro sitio web sea responsive primero hay que añadir esta característica al documento HMTL, mediante la etiqueta <meta> anidada al <head> del documento:

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head/>

Este elemento especifica que el documento tiene la capacidad “viewport”, lo que le indica a los navegadores que es un sitio capaz de adaptarse al tamaño de la pantalla.

Para mejorar la respuesta de un sitio responsive también es importante diseñar tomando en cuenta medidas relativas para imágenes, textos, bloques, etc. O usar Media Queries.

Recursos para entender el Web Responsive.

Relacionado