FitText makes font-sizes responsive and flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

Download the kit and use Flexslider to create your own customized amazing, fully responsive jQuery slider plugin.

Are you a designer or developer who’s looking for a template to start you off with responsive web and mobile design? Here are a few good templates with a free download that you can use to get you started. Skeleton is a collection of CSS & JS files that can help you develop sites that look beautiful at any size, on a 1600px screen or an iPhone. Skeleton is a great resource – but uses Media Queries with specific sizes (4 to be exact) which I still find can be limiting. If you’re looking for free liquid layouts instead of Media Queries please continue reading below.

Golden Grid System (GGS) is also a template that you can use to start your responsive design. Starting with 18 columns, each column on the left and right are used as the outer margins of the grid, which leaves 16 columns for your design. The other thing that makes this one different is that it includes resizing your typography, not just the layout or columns.  Also click on the “Golden Gridlet” in the top right corner, it will show and hide the grid at any given size – fun! Also if you’re just starting to do fluid designs, make sure you check out the tips and faqs at the bottom where there are some useful links!

Here are some killer tutorials and from the Theme forest blog which cover the basics of the languages that I currently teach (HTML, CSS, PHP and jQuery). If you’re just starting there are some really excellent beginner videos and source files. Jeffery Way is the man!

Buildinternet.com has some really interesting tutorials and demos on their site. One of my students used this jQuery plugin for a recent assignment and it worked out very well. A full screen background slideshow plugin that dynamically links to flickr. You can view the demo, download all source files. All you need to do to make it run is start up a flickr gallery and grab your API key. Once you’ve plugged your API key and image set information in, you’re laughing!

I’ve mentioned fluid grids becoming the next huge trend in web design – to get around having fixed widths that don’t work across different devices. Media Quieries, and building fluid layouts, is the easiest way to have your site display well across browsers and devices with different sizes and resolutions. Media Queries is a document which is an extension of media dependent stylesheets that were used with CSS2 (for example screen and print) that is tailored for different media types and screen resolutions. By restricting CSS rules to the width of the device displaying a web page, the web designer can tailor the page’s representation to multiple devices (smartphones, tablets, netbooks, and desktops) with different screen resolutions. Responsive Web Design is the practice of using fluid grids, flexible images , and media queries to progressively enhance a web page for viewing on different platforms.