Responsive Design News

Keep up with the latest news and developments around responsive design and the new direcitons that web designa and development are taking.

Lining up Responsive Day Out 3

Responsive Day out is coming up again this year, if you’re based in the UK (or nearby) you should check it out.

Read more

Why we can’t do real responsive images with CSS or JavaScript

Bruce Lawson explains in very plain English why the image preloader is amazine, and why it destroyed JS and CSS ability to help with images. Fortunately we’ve got SRCSET now :D

Read more

Official Responsive Images Plugin for WordPress

Whenever WordPress outputs the image through the media uploader, or whenever a featured image is generated, those sizes will be included in the image tag via the srcset attribute. Be sure to check out our Screencast about setting up WordPress with responsive images.

Read more

image-rendering: pixelated

The new CSS property image-rendering allows you to choose an alternative mode of image scaling. What does this mean?  Well Paul Kinlan does a great job of explaining this in the article itself but essentially it provides you with some more flexibility about the way an image looks when scaling. By default the browser tries to help […]

Read more

Responsive Web Design Tips

Don’t use picture (most of the time)

Jason Grigsby explains is great clarity the reasons where you would use the different responsive image specification implementations. Of course you could use <picture> but the chances are for most of the implementations you won’t need it.

Read more

Why We Banished the Hamburger Menu

By removing the hamburger icon and making a persistent tabbed navigation on this iOS app the team at Rebooth double the number of sessions, the time for each session increased by 70%, and they saw a 65% increase in daily active users.  While I realise these figures and example are based upon a native app […]

Read more

What the Virtual Viewport?

The virtual viewport in Chrome 40 will allow you the ability to scroll elements on the page that were set as position:fixed; — for instance elements like the top Nav bar of

Read more

Smartphone sales: Samsung's fell, Apple's grew, Xiaomi's exploded

Cheaper smart phones making a bigger splash, meaning RWD outside of predefined iOS breakpoints are well and truely a thing of the pastvia @RWD

Read more

Hamburger menus for mobile navigation: do they work?

Taking the Zeebox example above a little further, this article looks at two other A/B tests on Booking.com and Exisweb to see how they faired.

Read more

Responsive Discovery

The discovery phase of any project is arguably the most vital part, and in a responsive multi device world the discovery phase is so much more complicated. Luckily Emily Gray (Sparkbox) and Drw Clemens walk us through just how to do it.

Read more

The State of Responsive Web Design

LumX

It’s great to see a framework released that is Responsive  Based upon Google Material Design This link comes with a grain of salt though, I urge you to take care when implementing frameworks on your sites/web apps and ensure that you don’t rely on Angular to be there all of the time. That’s not to […]

Read more

Little RGB Riding Hood: a JPEG’s Tale

What’s in a color? Quite a bit it turns out. Depending on the colors contained within the image will have an impact on how much compression you can get out of it.

Read more

Expandable Image Gallery in CSS and jQuery

A great way to include a image gallery on small viewports and provide a smaller preview and full screen view at larger screens

Read more

The 80/20 Hybrid Approach to Designing in the Browser

This goes on a little further from what smashing talked about with their hierarchical visual design. It’s a matter of getting most of the way there in a the design tool which is the path of least resistance and then finishing it off and “deciding in the browser “

Read more

Foundation for Apps

Foundation is one of the two most popular responsive frameworks for websites (along with Bootstrap). Now it sites alone as the first front-end framework created for developing fully responsive web apps. Built upon flexbox, using Angular and a new range of motion classes for animations you can start prototyping web apps quickly.

Read more

Responsible Web Components

Jeremy Keith has taken Dave Ruperts podcast web component and forked it to become a little more progressively enhanced. There’s more to do, as he points out, like applying an ARIA roles and extending it with <audio> rather than a link. If you fancy a go, Fork it.

Read more

Status roadmap update: srcset,
element, and date inputs in development

For a long time the development team at MSDN have been hinting about the work towards work on the responsive image element and now it;s official. They have begun work on implementing the srcset attribute for image elements focussing initially on the x descriptor to provide higher resolution images specifically for device DPI. Thankfully they’re […]

Read more

Helping users find mobile-friendly pages

Over the next few weeks google will be rolling out a change to the standard results pages for mobile. Now along with your list of ads and related links you will also be informed if the destination is mobile friendly (based on the inclusion of the meta viewport tag)

Read more

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.