Collective #16
Responsive Images: What's the problem, and how do we fix it?
A great overview of the "responsive images problem" and the proposed solutions by Matt Wilcox.
Read itInspirational Website of the Week
Healing Stories is this week's inspirational pick because it tells a wonderful story in a beautifully interactive way.
Check it outBuilding Books with CSS3
Nellie McKesson introduces the CSS3 Paged Media Module and shows how to create print-ready paged book layouts with it.
Read itIcon Deposit CSS3 UI Kit (PSD+CSS)
Matt Gentile shares this beautiful UI Kit with us. It includes the PSDs and the ready-to-use markup with a pixel-perfect design.
Read itResponsive Images With WordPress’ Featured Images
This is a very helpful and extensive article by Rachel McCollin on how to make Wordpress handle responsive (featured) images.
Read itPortfolio Basics for Web Design Students: About Me Pages
On her website "A Student's Guide to Web Design", a wonderful resource for learning and preparing web design students for the design industry, Janna Hagan explains the concept and purpose of the About page and how important it is.
Read itfc.tape: jQuery widget for sprite animations
With fc.tape you can animate a background image (sprite) consisting of picture frames like an old-time movie projector tape.
Check it outFree Font: 47
Hendrick Rolandez created this vintage style font with a unique touch. He offers the bold & italic version for free.
Get itSupercharge Twitter Bootstrap
If you use Twitter Bootstrap, this will come in very handy for you: NetDNA hosts all Bootstrap objects on their superfast CDN servers allowing you to save bandwidth and time.
Use itFree Ecology Vector Icon Set
A charming free vector icon set by Jasmina Stanojevic for Noupe.
Get itAnnotator: JavaScript library for making websites annotatable
If you didn't know about it already: Annotator is an open-source JavaScript library and tool that can be added to any webpage to make it annotatable. Annotations can have comments, tags, users and more.
Check it outRekapi: A keyframe animation library for JavaScript
Rekapi is a helpful library for making beautiful <canvas> and DOM animations, like graph animations, and it allows you to export your DOM animations to CSS3 @keyframes.
Try itBalloons.IO: Free & ready to go web chat room
Balloons.IO is a free and ready-to-go web chat room. It’s built with the help of node.JS, Express, Socket.IO and Redis and it uses easy-OAuth for authentication with Twitter.
Check it outKoloria Free Iconset (PNG)
From the maker of the epic Quartz Icon Pack, Andy Gongea, comes another pixel-perfect free icon set of more than 160 gorgous icons.
Get itSyte: Personal site with social integrations
Rodrigo Neri developed Syte: a really simple but powerful packaged personal site that has social integrations like Tumblr, Twitter, Github, Dribbble and Instagram.
Check it outCompressing Multiple CSS Files with PHP
Another useful resource by Paulund: A PHP snippet which will combine mutliple CSS files and remove all comments and spaces, reducing the size of the file and thereby reducing loading times.
Read itList/Grid View Switcher with jQuery
Learn how to build a list/grid view switcher with jQuery in this tutorial by Jake Rocheleau for Vandelay Design.
Read itDummy: Rapid Prototyping and QA
Dummy is a simple PHP-based toolkit that will make rapid prototyping a breeze: You can insert randomly generated strings of placeholder text in commonly needed lengths and formats (e.g., headline, teaser, paragraph) and request different sizes and aspect ratios of images on the fly, and more.
Check it outFree File Type Icons (PNG)
The Gentle icon set consists of 20 file type icons of 128 x 128 pixels and in PNG format.
Get itFree PSD Template: Gastronymous
Gastronymous is a free PSD template meant for websites related to food and/or the food industry.
Read itFree Galaxy S3 Template (PSD+PNG)
Eryk Pastwa shares this beautiful vector shape based Galaxy S3 template with us on Dribbble.
Get itAnimated CSS3/SVG Loading Bars
Learn how to use CSS animations and SVG to create a loading bar in this tutorial by Johnny Simpso.
Read it3D Buttons with CSS
Brandon Pierce shows you how to create some awesome minimal circular 3D buttons with CSS in this CSS-Tricks tutorial.
Read itVicons Free Glyph Icon Set (PSD)
Victor Erixo shares this really cute icon set with us. It contains some useful glyph icons.
Get itFree Font: Acorn
If you are searching for a free, clean and simple sans-serif hand drawn typeface, you'll love Acorn by William Suckling.
Get it