In this second issue of Roundup you have the chance to win one of 3 annual subscriptions to PixelKit: Premium UI Kits and Design Resources.
Plus, as every week, we bring you a selection of the most interesting tweets we've tweeted throughout the week. Let us know what content you'd like to read and we'll do the rest. Freshly baked!
Front End Frameworks
A collection of best front end frameworks for faster&easier web development
The Layered Look: Better Responsive Images Using Multiple Backgrounds
via CSS Tricks
We don't want to serve giant-sized images to people who don't need them. There are several approaches for not doing this — including Scott Jehl's picturefill, server-side solutions, and lazy-loading techniques — but the simplest method may be to use a background-image and the magic of CSS media queries.
Loading Images on Demand with Pure CSS
Workflow for Designers
I’m currently working on no shortage of responsive projects, all of which have great need for resolution-independent imagery. Since all the cool kids are going the SVG route, I figured I’d try my hand at it too.
Monster University: Create-a-Monster App
The Create-A-Monster app prioritizes the user experience with HTML5 multi-platform performance, providing an entertaining and visually dynamic window into the world of Monsters Universi...
HTML5 Features, Responsive CSS Modules and Sass – Treehouse Show Ep 44
When we build websites we usually start by defining the body text. The body text definition dictates how wide your main column is, the rest usually follow almost by itself.
Working around a lack of element queries
via Filament Group
We want to build responsive layouts comprised of many modular, independent HTML components that fluidly fill any layout container we drop them into, but CSS3 media queries don't currently offer a way to make content respond to its container's dimensions (as opposed to the overall viewport size).
A particle engine (or particle system) is a technique from computer graphics that uses a large number of small images that can be used to render special effects such as fire, smoke, stars, snow, or fireworks.
‘Scope’ in CSS
via CSS Wizardry
One thing you will no doubt be familiar with, as a web developer, is the idea of scope. Wikipedia’s introduction to the subject: "In computer programming, a scope is the context within a computer program in which an identifier is in effect, and can be resolved to an entity – when the entity is visible."
The CSS Shapes Module Will Revolutionize Web Design
For decades we’ve meticulously sliced up images to create rounded corners, shadows, gradients, and ornate detail. The W3C added these features to the CSS standard and many web designers rejoiced as browser support followed, because it meant that we didn’t have to rely on images anymore. However, the recent flat design trend has made these celebrated features much less relevant.
Designing for Services Beyond the Screen
via A List Apart
The producer-consumer model is so ingrained in our society that we tend to treat everything like a product—a one-and-done offering that can be pushed to the market and forgotten.
Win an Annual Subscription to PixelKit Premium UI Kits and Design Resources
PixelKit provides access to a constantly changing library of complete UI kit solutions. Rather than being just a general directory or catalog of various tools or a mixed bag of options, this site puts its emphasis on UI kits.
Now you have the opportunity to win 1 of 3 Annual Subscription to PixelKit. Here you will find UI kits that feature every possible element, including buttons, sliders, icons, menu features, app screens and more. This guarantees that all of the designs you provide are as up to date, detail rich and esthetically pleasing as they can be. It also means that you don't have to worry yourself dizzy about client satisfaction. Even if the buyer is not satisfied with the choices you have made, you won't have to redesign the wheel to add a new set of UI elements to the project. This is because the PixelKit site provides an immense number of easy to use options.
How to Win:
Just follow these 3 simple steps: