Responsive images: Current state & overview

Responsive images is a surprisingly complicated topic, and one that’s been steadily gaining attention over the last year as more developers discover they need them and then discover there’s no good solution yet. This article aims to give an overview of the problem itself, and show the different proposals in the works to address it. …

Fashionably flexible responsive web design

Responsive web design has made designing flexible websites fashionable again, but there’’s more to being fashionably flexible than technology or using CSS3 media queries. So this unique workshop — hosted by Andy Clarke, designer, author and speaker — puts the design back into responsive design. Andy will teach you how to design from the ‘content …

Pngy – Load images based on network connection speed

Pngy is a bit of jQuery that allows you to load images of different file sizes based on a page’s load speed. So, if the load speed is slow, Pngy can load your small image. If it’s fast, it can load a hi-res image. It’s kinda like a ping test in Javascript. Resonates with my …

Adobe Shadow

Adobe® Shadow is a new inspection and preview tool that allows front-end web developers and designers to work faster and more efficiently by streamlining the preview process, making it easier to customize websites for mobile devices. Pair your devices via the browser plugin and see all devices change sites whenever you change it on your …

Scaling With em Units

Recently I started testing how proportional scaling of bigger layouts would work in reality and if it makes any sense. It’s possible when using EM units and then changing body’s font-size when viewport’s height grows above certain point. Basically that means, that I have to change only one or two css properties between @media queries …

jQuery Anystretch

Anystretch is a jQuery plugin that allows you to add a dynamically-resized background image to any page or block level element. The image will stretch to fit the page/element, and will automatically resize as the window size changes. Handy when having a fluid layout/responsive design. Anystretch Demo → Anystretch (GitHub) → UPDATE: Reader Oemebamo pointed …

The slow elephant in the responsive images room

The past few weeks a lot has been going on around one of the challenges of responsive web design, namely responsive images. The gist of it is pretty straightforward: it’s not a good idea to let a device download a big image if that device is a small-screen device. It’s better to serve that device …