Collective #13
Inspirational Website of the Week
With its interesting thumbnail shape, subtle animations and great color scheme, Julien Renvoye's portfolio becomes our pick of the week.
Check it outCompass2CSS
Compile Compass into CSS using this awesome online tool by Brian Gonzalez. This can be useful in a situation when you don't have the power of Sass/Compass, or if you are simply curious to see how Compass implements certain functions.
Check it outGumby Framework
Gumby is a new responsive 960 grid CSS framework that comes with many amazing features. It has support for all of the new HTML5 goodness and you can customize it for your needs. It's great for prototyping since it comes with styles and common interface elements (forms, buttons, tabs, and pure CSS dropdowns and more).
Get itMeteocons
Alessio Atzeni gives us this beautiful icon set for free. Meteocons is a set of weather icons which contains more than 40 icons in various formats: PSD, CHS, EPS, SVG, Desktop font and Web font.
Get itThe CSS3 Flex Box Specification
Johnny Simpson dives into the CSS3 Flex Box Specification and shows us usage examples and how it simplifies layout design.
Read itWordPress Meet Responsive Design
On the new and great Code Poet, a superb resource for Wordpress designers and developers brought to you by the very developers of Wordpress, you can find this short e-book where Chris Coyier, Ian Stewart and Sara Cannon talk about strategies for designing WordPress sites responsively.
Read itTwo Free Fonts: Tikal Sans Medium + Medium Italic
Miguel Hernández created this wonderful font family with 20 weights, two of which are free: Tikal Sans Medium and Tikal Sans Medium Italic.
Get themvert.x
If you are developing asynchronous applications, you will find vert.x interesting. It's a framework which takes inspiration from event driven frameworks like node.js, combines it with a distributed event bus and sticks it all on the JVM - a runtime with real concurrency and unrivalled performance. Vert.x then exposes the API in JavaScript, Ruby, Groovy and Java.
Try itddSlick.js
A free light weight jQuery plugin by Prashant Chaudhary that allows you to create a custom drop down with images and description.
Get itOn Responsive Typography
Some interesting thoughts by Indra Kupferschmid about how there are several important aspects to typography when it comes to "responsive typography".
Read itExample of getUserMedia and CSS Filters
A really great practical example of getUserMedia, the fantastic HTML5 feature that let's you access the user's audio and video devices. Taking it one step further, Raymond Camden adds CSS filters to create a registration form that makes the taken picture become sharper after filling the inputs.
Read itsuperscrollorama
After creating scrollorama John Polacek gives us superscrollorama, the jQuery plugin for supercool scroll animations.
Get itHTML for Icon Font Usage
What is the best markup for using icon fonts when considering semantics and screen reader friendliness? Chris Coyier covers some useful techniques with those considerations in mind.
Read itFree Keynote Mockup Templates
Keynotopia shares some free Keynote Mockup Templates for prototyping mobile, web and desktop apps.
Get itFontello Iconic Fonts Composer
If you did not know about it yet: with Fontello you can combine iconic webfonts for your project; adjust glyphs collections, merge symbols from different fonts and access large sets of open source icons.
Try itA New Take on Responsive Tables
With all the hype around responsive design, one important element seems to get left behind: the table. A new playround piece of ZURB shows how to create responsive tables with JavaScript and CSS.
Check it outFree Ultimate Blurred Background Pack
At WeGraphics you can get this free PSD which contains 20 soft blurred background textures.
Get itBariol Regular Free Font
Atipo gives us one member of this exquisite font family for free: Bariol Regular.
Get itEmber.js Framework
Ember is a JavaScript framework for creating ambitious web applications that eliminates boilerplate and provides a standard application architecture.
Get it