Bi-Weekly Frontend News

Collective #72

Inspirational Website of the Week


A great web experience to honor the 100th edition of the Tour of France. "Your Tour" is full of surprises and great examples of Google product uses. Our pick this week.

Get inspired

Use your browser as Notepad


Ever thought about using your browser as an editor? Fizer Khan shows us how to do it by playing with the Data URI scheme and the contenteditable attribute.

Check it out

Chrome DevTools Revolutions 2013


An excellent recap of Paul Irish's Google I/O 2013 talk "Chrome DevTools Revolutions 2013" on HTML5Rocks.

Check it out

The Illusion of Speed


A short video of Steve Souders' cool Ignite presentation, "The Illusion of Speed", at Velocity 2013. Check out this Forbes article for a great summary.

Watch it

Choosing A Responsive Image Solution


Making your website responsive comes with a lot of challenges, one of them being how to handle images. Sherri Alexander explores some useful solutions for responsive images in this Smashing Magazine article.

Read it



If you think that tabs are our of fashion and boring, think again and take a look at this stylish jQuery tabs module by Aaron Lumsden.

Check it out

Simple State Manager


Simple State Manager by Jonathan Fielding is a responsive state manager which allows you to target JavaScript at different browser widths.

Check it out

Why mobile web apps are slow


Drew Crawford gets to the core of why mobile web apps are slow in this in-depth and detailed article. Good Sunday read!

Read it

S Gallery: A Responsive jQuery Gallery Plugin with CSS3 Animations


A gallery plugin by Sara Soueidan that makes use of HTML5's FullScreen API, CSS animations and transitions.

Check it out

JS Sequence Diagrams


A really awesome JavaScript library by Andrew Brampton that turns text into vector UML sequence diagrams using Jison to parse the text and Raphaƫl to draw the image.

Check it out

Free Font: Primary Sans


Primary Sans is a sans serif typeface designed by Georgia Roussos as an appealing font for primary school children.

Get it

Digging into my slides about Sass


A great write-up by Hugo Giraudel about his recent talk at KiwiParty about the power of Sass.

Read it

Getting started with CSS sourcemaps and in-browser Sass editing


If you have seen the previously mentioned "Chrome DevTools Revolutions 2013" by Paul Irish and would like to dig into the Sass editing feature, then you'll find this tutorial by Tim Lucas really useful.

Read it

UI Kit (PSD)


A beautiful PSD of a UI Kit by PremiumPsds for your next design.

Get it

Just design


Megan Gray shares her experience and thoughts around the misconceptions of what the job of a designer is. A refreshing read.

Read it

Surfing Icons (PSD)


A set of 12 pixel-perfect, scalable, flat icons from WeGraphics.

Get it

Tab Bar Icons iOS 7 Vol2 (PSD, AI, EPS)


The second volume of the great iOS7 styled tab bar icon set by Pixeden.

Get it

Free Font: Lasco


Comic Sans, make way for this stylish successor! Lasco is an excellent, super-clean comic font by Lasko Dzurovski.

Get it

Useful GitHub patterns


If you work a lot with GitHub you'll find these patterns really useful. Put together by Jake Benilov.

Read it

Giphy: GIF Search Engine


Finally a place where you can search for GIFs in style and "play" the GIFs only on hover.

Check it out

Free Font: Cittadino Symbols


Dmitry Goloub created this complete and free set of public transport icons as a font.

Get it

So You Wanna Build a Crowdfunding Site?


Learn how to build a crowd-funding website in less than 300 lines of code in this tutorial by Nick Liow and Robert Nyman from Mozilla.

Read it

Collective72_17 by Knetik Media helps you to quickly and effectively identify required media queries for specific devices.

Check it out