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

Netflix estrena el trailer de The Punisher junto con The Defenders, pero esta oculto

El día de hoy se estreno la esperada serie de súper héroes “The Defenders” en la cual, y justo al final de la temporada encontraras oculta una sorpresa. Se trata de un teaser trailer de…

close

15 principios de oro sobre la jerarquía visual que debes conocer

La jerarquía visual es uno de los principios básicos del diseño, no obstante, suele ser ignorada como tal en por algunos diseñadores. Lo anterior, traer como resultado un desorden visual sobre la importancia de los…

close

Pequeños robots hechos con cámaras fotográficas por James Rauff

“El arte de recirculación” es el nombre que recibe esta serie artística del artista y escrito James Rauff; el cual, ha realizado unos pequeños robots en base al reciclaje de algunas cámaras fotográficas descompuestas. Los…

close

Coloring corruptions, el resultado de dejar a un adulto con libros para colorear

La creatividad no tiene limites, no obstante, la edad y donde se aplique son variantes que pueden modificar el resultado, es por eso, que el día de hoy quiero compartir con ustedes algunas imágenes de…

close

Microsoft Office World Championship, el concurso de paqueteria Office que no creerás que existe

El Microsoft Office World Championship es una realidad, una muy curiosa que hasta el día de hoy desconocíamos; según el sitio web Gizmodo este campeonato mundial de Office se celebra anualmente con la participación de…

close

Safety Bags, bolsas de plastico que limpian los alimentos de pesticidas

  Safety Bags es una iniciativa lanzada por la multinacional Tesco y desarrollada por la agencia Cheil WW Hong Kong; esta, tiene finalidad promover el uso de las “Safety Bags”, las cuales, tienen una función muy…

notifications Recién publicamos
close