Copy
All things responsive, all of the time. (View in browser.)
Wired RWD preview
Hello and welcome, once again from Australia, to responsive design weekly #149.

This week is the last time you can get your hands on a ticket for the RWD Summit next week where you get three days of amazing responsive presentations.... I'm even giving one (hoorah)

If you have any burning RWD questions before then you can ask me anything.

Lets get on with the links.
 

Headline

The Web’s Grain

When Frank Chimero writes an essay about the web, you read it. Outstanding!
 

Designing For Wearables To Enhance Real-Life Experience

Smartwatches and wearables are here and they're here to stay. Although this is mainly focussed around apps there is going to begin to be a requirement that our websites can be consumed through these interfaces... and more than likely provide a two way communication in certain situations. 

There will be a slight shift in the way that we deal with small screens in these situations, falling back to things like Open Graph meta content for initial consumption of specific content (we've already seen Facebook, Google and Twitter use these for displaying short but specific content), but there will also be a focus on consuming the content more through an RSS feed than a typical web page.
 
RWD Summit

How to get your RWD skills bragged about

Level up your RWD workflow skills by attending the new virtual conference, RWD Summit, from March 10th to 12th. Log in from anywhere in the world to hear experts like Chris Coyier, Jen Simmons, Dave Rupert, Rachel Andrew, and many more! Save some money — use code RWDWEEKLY and you’ll get 20% off registration plus free recordings of each valuable presentation that you can refer back to at any time!

Articles

Responsive Hero Images Cloud Four Blog

Hero images present unique challenges for responsive designs. During a recent responsive images audit Jason found a unique solution.
 

Welcome to the New WIRED

Wired has gone with a new responsive, mobile first, design. This came along with a huge review of all their content. Kudos.
 

Our Director of Engineering on the New WIRED.com 

If you want a few more dirty details about what went into the redesign: Wordpress, Stylus, jQuery, Gulp etc etc, then check out this post for the details.
 

Where Atomic Design Fell Short

Jono takes Brad Frosts Atomic Design and puts a more building structure to it.
 

Where Atomic Design Fell Short

Brad defends his choice of the smaller component names like atoms and molecules
 

Learn from Great Design: Virgin America

A great overview of the design approach on one of my favourite responsive designs.
 

Tired of Safari

PPK covers off the history of Apples influence over the mobile web.
 

The State of Web Type

Type isn't quite where it should be today, a lot of the features that print designers take for granted are missing or not well supported. So what do we need to up our game?
 

5 Golden Rules For Mobile Email Design

Although focussed on mobile design I know you all just want to send responsive emails... well these rules apply there too.
 

Resources and Libraries for Responsive web Design

Some good resources here, and yay that we snuck in at #18.
 

Rethinking Your Sass Variables

 

Tutorials

Font Loading Revisited with Font Events

In a recent ask me anything email someone asked ways that they could load fonts responsibly. Who better to answer that then Mr Responsible Design himself, Scot Jehl.
 

Quantity Queries for CSS

Heydon Pickering walks us through a new idea for creating style breakpoints for quantities of HTML elements.
 

Yahoo! Mail Fixes Media Query Bug

"All the hacks you had to add to your styles within media queries so that they don’t “activate” in Yahoo! Mail are no longer needed. The Yahoo! Mail’s CSS parser now parses nested CSS blocks properly and styles within media queries remain enclosed after the parser is done with it."
 

A Deep Dive Into Adobe Edge Reflow

If you haven't checked out adobe reflow for a while this is a good overview for what you can now expect.
 

Keeping srcset and sizes under control

A great article from Matt here, and just out of interest the reason he uses fixed widths for the 'sizes' attribute is because his design isn't fluid and pixels worked better than VW units.
 

Harnessing Flexbox For Today’s Web Apps

While this tutorial is focussed on web apps it's just as easy to apply these to the responsive sites you're working on today.
 

Organising Your Grunt Tasks

 

Frameworks & Plugins

 

MUI

MUI is a lightweight HTML, CSS and JS framework for sites that follow Google's Material Design guidelines.
 

Swiper

It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps, but you might find the need for it on your next responsive project. Designed mostly for iOS, but also works great on latest Android, Windows Phone 8 and modern Desktop browsers.
 

Plyr

A simple responsive HTML5 media player with custom controls and WebVTT captions

 
If I've missed something you've been working on this week please take 2 minutes to hit reply and share it with me and include it in one of the up coming RWD Weekly, or use Ask me anything.
 
Next week we'll be away camping so there's a chance there'll be no internet and as a result the newsletter might be put on hold... but don't worry it'll be there on time again the next week.

C
heers,
Justin
 
Copyright © 2015 Simple Things, All rights reserved.


unsubscribe from this list    update subscription preferences 

Email Marketing Powered by Mailchimp