jQuery

11 Plugins JS para hacer diseños web responsivos

hacer diseños web responsivos

Les compartimos una serie de excelentes plugins javascript perfectos para hacer diseños web responsivos, esto será de gran utilidad para seguir una de las tendencias de diseño web en 2014 que se trata de crear diseños web adaptables a cualquier plataforma sin importar navegador y mostrando contenido de calidad aprovechando las posibilidades que los diferentes dispositivos ofrecen tanto en imágenes de alta resolución como en interactividad.

Plugins JS para hacer diseños web responsivos

Adapt.Js

Es un alternativa al uso y dependencia de los Media Queries con CSS, que si bien cierto son excelentes aun no son reconocidos por todos los navegadores, lo cual puede causarnos algunos problemas, con Adapt.js eliminamos esa dependencia, también ofrece soporte para la mayoría de los navegadores incluso Internet Explorer, con este plugin podremos identificar el tamaño de la venta o resolución de pantalla de la persona que accede a nuestro sitio de tal modo que sirvamos las reglas CSS adecuadas según lo identificado.

adaptjs

FitText.Js

Este plugin nos permite ajustar el tamaño de nuestro texto a los contenedores según su tamaño, de tal modo que exista una relación entre tamaño del contenedor y el texto y este se adapte sin dejar de ser legible para el usuario.

FitTextJs

Retina Images

Este plugin javascript nos permite detectar si el dispositivo que visita nuestra pagina utiliza pantallas tipo retina display, de tal modo que si es el caso sirva imágenes del doble de resolución para aprovechar la calidad de estas pantallas, de este modo se optimiza el consumo de ancho de banda.

retina_images

jQuery Gridly

Un plugin que nos permite hacer diseños web responsivos con un sistema de bloques fluidos que se adaptan a las medidas de la ventana del usuario, agregando funcionalidad para gestionar los bloques, esto puede ser perfecto para un gestor de imágenes que nos permite visualizar un grid de bloques y que este se acomode automáticamente según la interacción que existe por parte del usuario.

hacer diseños web responsivos, jQuery Gridly

jResponsive

Un plugin muy similar a jQuery Gridly que nos permite trabajar con un sistemas de cajas fluidos que se adaptan al grid de nuestra pagina según el tamaño de la pantalla.

jResponsive

Salvattore

Un plugin que funciona como una alternativa al manejo de columnas por medio de CSS, para realizar un grid de columnas que se adapten automáticamente a las medidas de la pantalla.

Salvattore

Squishy

Squishy al igual que Fittext es un plugin que adapta el tamaño del texto al tamaño del contenedor que contenga las lineas de texto de tal modo que no se pierda la legibilidad del mismo.

Squishy

Glide.js

Este un excelente plugin para crear slides de imágenes o contenidos responsivos, cada slide se adaptara junto con su contenido al tamaño de la ventana de forma automática sin perder funcionalidad y con soporte para gestos touch.

Glide js

CollagePlus

CollagePlus es un plugin que permite crear diseños web con layouts del tipo de Pinterest y algunas revistas digitales con bloques flexibles que se adaptan de forma automática a la medida de la pantalla utilizando diferentes medidas para cada bloque dejan un interesante y bien ordenado layout.

CollagePlus

SlideMe

Otro plugin para crear slides de imágenes en diseños web responsivos, este también soporta gestos touch, ofrece soporte para Internet Explorer y soporta slides de pantalla completa para navegar en diferentes direcciones, muy bueno, lo he utilizado y ofrece excelentes resultados.

SlideMe

Sidr

Este plugin nos ayudara en la tarea de crear menus de navegación laterales tal y como los utilizan muchas aplicaciones móviles, crean menus adaptables que se muestran y oculta de forma lateral.

Sidr

FullPage.js

Es un plugin muy bueno y fácil de implementar, nos permite hacer diseños web responsivos de una pagina, tipo landing page y navegar entre sección con un efecto de scroll suave, haciendo cada sección a pantalla completa cuando en realidad seguimos en el mismo sitio, en este caso el uso de enlaces tipo “name” les permitirá optimizar asuntos de SEO.

fullpage

Tabslet

Plugin para organizar contenidos en tabs, muy fácil de implementar y con soporte multi navegador, incluido el odiado Internet Explorer, perfecto para sitios responsivos que necesiten organizar mucho contenido.

tablets

Extra…

Les recomendamos visitar nuestras sección de diseño web y también la sección de jQuery donde encontraran aun más recursos para hacer diseños web responsivos de forma practica y efectiva.

comment ¿Que opinas?

Artículos recientes

close

play_circle_outline Este es el nuevo trailer de Spider-Man: Homecoming

Una agradable sorpresa para aquellos fanáticos del universo de Marvel y sobre todo para los seguidores del universo de las pelicular de los Vengadores; pues el día de hoy se dio a conocer el nuevo adelanto…

close

Estos son los primeros ganadores del Sony World Photography Awards 2017

El día de hoy se dieron a conocer algunos de los ganadores del Sony World Photography Awards 2017; estos ganadores pertenecen a las categorías Open y National; por lo que aún restan los ganadores de…

close

Mockups gratis para presentar publicidad exterior

Les comparto una selección de útiles mockups gratuitos perfectos para presentar diseños de publicidad exterior, todos los mockups son de diferentes formatos para algunos de los medios de publicidad exterior más populares que puedes ver en…

close

Mira esta colección de logotipos animados para tu inspiración

Los logotipos son fuentes de inspiración únicas; esto debido a que para su realización se utiliza una gran gama de técnicas y estilos; las cuales son apreciables para los ojos entrenados que andan en busca…

close

WhatsApp da a conocer detalles sobre su actualización para borrar mensajes

WhatsApp ha dado a conocer nuevos detalles sobre su nueva y esperada actualización; la cual, incorpora una característica que muchos están esperando… la posibilidad de eliminar mensajes antes de que sean leídos por el destinatario….

close

Genial diseño de packaging sustentable y minimalista para bombillas eléctricas

Este genial diseño de Packaging creado por un estudiante del Instituto de Diseño Unitedworld en la India; cabe señalar que este diseño fue creado como parte de una tarea escolar; la cual señalaba un problema a…

notifications Recién publicamos
close