Table of contents
Responsive design is a new trend in web design. But what is responsive web design?
In this article from Mashable, they describe responsive design as the following.
In simple terms, a responsive web design uses “media queries” to figure out what resolution of device it’s being served on.
This basically means that with responsive design your website will fit on all screens, iPhone, Ipad etc. With an ever increasing mobile & tablet industry you soon see how important this is now.
How do you create a responsive website?
If you’re a web designer then there are plenty of resources online to help you make your website responsive. There are also courses you can sign up to so you can learn all about this new trend, check out Team Treehouse for one. But since most people aren’t web designers or simply just don’t want to get their hands dirty here’s a list of the top WordPress responsive plugins which you can use to help make your website more responsive.
WP Fluid Images
WP Fluid Images replaces the fixed width and height attributes so your images resize in a fluid or responsive design.
WP Fluid Images takes your current CSS for your images and converts them automatically for you for a more responsive design. By removing the width and height tags the plugin replaces them with percentages.
The Responsive Slider plugin allows you to create slides that consist of linked (to any url) images and titles. The slider would then take those slides and present them as a jQuery-powered slideshow – at a chosen location within your theme, page, or post. In whatever order you want them.
Simple Responsive Images
This plugin generate images with attributes for the responsive images in your content. Choose the breakpoints and the sizes associated. The next images you will insert and the elements generated with the wp_attachement functions will begenerated with the right attributes.
Similar to WP Fluid Images above this WordPress responsive plugin allows your images to be displayed more effectively viewed on devices with different browser widths.
FitVids for WordPress
This plugin makes videos responsive using the FitVids jQuery plugin on WordPress.
The FitVids for WordPress plugins is similar to WP Fluid Images once again except it makes videos on your website responsive. Just activate it and you’re done :).
Responsive Image Lightboxes for WordPress with Built-In Social Sharing
One of the better looking lightbox plugins for WordPress and it’s fully responsive. The FooBox allows you to feature your images in a lovely responsive way with the potential for your images to go viral with their built in social sharing feature. It works with some of the most popular image gallery plugins like NextGen.
While there are loads of responsive plugins popping up all over the place at the moment there’s plenty of options for the non-coder. If you’re planning a new website however, I would suggest researching for good responsive WordPress themes and bypass all the plugins.