Bi-Weekly Frontend News

Collective #55

Inspirational Website of the Week


Skybox has some smooth sliding transitions and interesting hover effects, combined with a unqiue layout and typography. Definitely our pick this week.

Get inspired

Browserdiet: How to lose weight (in the browser)


A superb front-end performance guide put together by real experts who work on large sites.

Read it

Designing A Better Mobile Checkout Process


A great article by Derek Nelson on how to optimize the mobile checkout process for a better user experience.

Read it

Swipe Touch Slider


Swipe.js is responsive image slider with touch support developed by Brad Birdsall.

Check it out

Css-only Alternative to the Select Element


Learn how to create a slick select-like drop-down list with CSS only in this tutorial by Paulina Hetman.

Check it out

The Era of Symbol Fonts


Brian Suda gives a great overview of symbol fonts and how they help to improve perfomance and how to use them in an optimal way.

Read it - Collecting all the cheat sheets


At OverAPI you can find an extensive collection of cheat sheets you'll definitely find useful as a web developer.

Check it out

The Clambake for Emails & Retina Images


With the Clambake by Aaron Kahlhamer for ZURB you can add retina-ready graphics, like your logo, to a responsive email.

Check it out

Let's Build a Lightweight Blog System – Part 1


Start learning how to create a light-weight blog system with PHP and CSS3 in this tutorial by Martin Angelov.

Read it

Canvas Query


Canvas Query is a wrapper library for HTML5 canvas which allows it to be used with jQuery-like syntax. It also offers a lot of commonly used image manipulation methods mainly convenient for game developers.

Check it out

Timepiece Rounded


An interesting OpenType font displaying time, like 17:23:25, as an analogue Clock.

Check it out

iPhone and iPad (PSD)


A great looking iPhone and iPad template by Agence Me.

Get it

Free Sketched Icon Fonts


Peax shares three amazing sets of hand-drawn sketched icon fonts. Check them out: font 1, font 2 and font 3

Get them

iOS 6 switch style checkboxes with pure CSS


Some great looking CSS-only iOS switches by Lea Verou.

Check it out

Pixi Renderer


Pixi.js is a fast HTML5 2D renderer engine that uses WebGL with a canvas fallback that enables it to work across all modern browsers both, desktop and mobile.

Check it out

CSS3 text-shadow effects


Jorge Epuñan created some fantastic text-shadow effects on Codepen.

Check it out

Shadow DOM 201 - CSS and Styling


Learn more about the Shadow DOM and what you can do regarding CSS and styling from this article by Eric Bidelman.

Read it

Free Font: Shinto


A fresh new display font from Golden Black.

Read it

Move a Cube With Your Head or Head-Tracking With WebGL


Experiment with headtrackr.js and three.js, and learn how to do head tracking in WebGL in this article by Jerome Etienne.

Read it

iPhone 5 Template + (PSD)


A pixel-perfect and improved iPhone 5 template by Dash.

Get it

Social Media Image Maker


A great place to resize and retouch your social media images.

Check it out

Minimal Apple Product Templates


Some really nice, flat apple product templates by WeGraphics for your next mockup.

Get it