Web BizarroWeb Bizarro

Suscríbete a nuestro Newsletter

X

Únete a nuestra lista de correos para recibir semanalmente actualizaciones de nuestro contenido.

#Infografía para crear sitios con responsive

#Infografía para crear sitios con responsive 19.AUG.13

Gianfranco Lemmo
Fundador WebBizarro

El diseño web adaptativo o adaptable (en inglés, Responsive Web Design) es una técnica de diseño y desarrollo web que mediante el uso de estructuras e imágenes fluidas, así como de media-queries en la hoja de estilo CSS, consigue adaptar el sitio web al entorno del usuario.

El diseñador y autor norteamericano Ethan Marcotte creó y difundió esta técnica a partir de una serie de artículos en A List Apart, una publicación en línea especializada en diseño y desarrollo web, idea que luego extendería en su libro Responsive Web Design.

Esta tendencia escuchada durante los últimos dos años, tendencia que prácticamente se volvió obligación para todo desarrollador web o empresa con negocios en Internet que quieren llevar su producto a más clientes o que simplemente desea permanecer actualizada con las últimas tecnologías que nacen en Internet.

Nuestro sitio Web Bizarro es un sitio que posee responsive web design y media queries para que todas aquellas personas que nos visiten desde diferentes dispositivos pueden tener una experiencia plena de nuestro sitio web en cualquier resolución y con cualquier dispositivo.

Según la siguiente infografía creada por WhoIsHostingThis actualmente hay 2,100 millones de usuarios con móviles, el 87% de los adultos en USA tienen smartphone, cifra que es similar en Latinoamerica, ¿O no has notado que cada día aumenta el número de amigos en Facebook con el icono de un móvil en el chat?, el 74% de usuarios con móvil abandonan el sitio web si éste toma más de 5 segundos en cargar.

Es muy importante a nivel de dispositivos móviles tener en cuenta que el tamaño de la pantalla es menor y debemos mostrar sólo el contenido relevante para el usuario en estos medios, la clave para esto es utilizar Media Queries y es muy recomendable en muchos casos realizar un diseño Mobile First que significa realizar el diseño de tu página primero para móvil luego en las demás resoluciones.

A continuación les presento la infografía espero la disfruten: