Resources for Responsive Web Design
Perhaps you hadn't noticed, but the internet is changing fast. And every time someone comes out with a device, every web page on the planet needs to adapt... or, better yet, respond.
Adaptive versus Responsive Web Design – Adaptive web design is the idea of writing multiple fixed width versions of the same web page. Responsive design uses fluid grid layouts to allow the website to respond to the size of the device to optimize the viewers experience.
Ethan Marcotte has written an excellent piece called
Responsive Web Design that explains how all of it works and why it is important.
The long and short of the concept is simple: If I use my smartphone to look at your website and all I can see is the upper left hand corner, I will be off to your competitors site in seconds. If, however, I can get your website to look good on my tiny screen, then I will be for more likely to stay and keep looking.
There are several very cool PDF books, free, of course, that you can get caught up on the subject for different functions:
Responsive Web Design by Tim Davison
Wordpress Meet Responsive Web Design by Micheal Pick
Responsive Web Design with HTML5 and CSS3 by Ben Frain
Vandelaydesign.com has written a great tutorial,
How to Turn Any Site into a Responsive Site. Several other companies offer other tutorials that can help you learn more as well.
Webdesignshock.com –
Responsive Web Design, Most Complete Guide
Tympanus.net –
Responsive Image gallery with Thumbnail Carousel
Webdesignerwall.com –
5 Useful CSS Tricks for a Responsive Design
There are plugins on each platform:
Wordpress – WP Fluid Images, Repsond JS or FitVids
Drupal – Adaptive Image, Responder, Modernizr
Joomla – Slideshow CK, Photo Gallery, Mobile
Jquery – ElastSlide Carousel, Responsive Slider, Elastic SlideShow
No matter what platform you are working on there are templates for everything. A simple search for “responsive web templates,” “responsive Drupal templates,” etc.
If you want the whole world to beat a path to your website, you have to make your website perfect for the whole world. Create a responsive website and everyone will be able to see all of your hard work.
