Performance and Responsive Web Design
A great presentation around performance with RWD sites. Zach focuses on the main blockers including JS, CSS, Images (backgrounds and inline).
Keep up with the latest news and developments around responsive design and the new direcitons that web designa and development are taking.
A great presentation around performance with RWD sites. Zach focuses on the main blockers including JS, CSS, Images (backgrounds and inline).
A great flyout menu option for top navigation… much better than a traditional mega menu (I think). This even scales down to the mobile, although it does start being a bit ‘scrolly’ if you’ve got a lot of options
The book explains how to combine Modernizr, the WURFL device detection library, and simple PHP code, to serve content according to device capability. Each of these essential RESS building blocks gets a little introduction before being combined to provide a robust foundation for proper device detection.
This article goes DEEEEEEP into the <picture> implementation to come up with a way that only downloads a single image. The good news is that it succeeds! The bad news is there’s a lot of non semantic markup to get there. A great look at the problems surrounding possible image solutions. I think we should […]
Oooohhhhhh, this will divide many. Ian suggests that you can use !important within your media query to cancel out previous styles. The example used is passable… barely. Definitely worth looking at if you are approaching a retrofit of an existing desktop site, but we all know we should be building mobile first.
Yes yes yes, a thousand times yes. Listen to James Young, do as he says and make it a lighter web.
Big kudos to Yoav Weiss this week for all his research into the use cases for art direction requirements on the web today. He takes a look at Alexa’s top 50k sites and finds out who is using picturefill. Brilliant.
An interesting approach to identifying Media Query changes though JS by including quick non-visual animations within each breakpoint and watching for the event. As the author points out it’s not really production ready (IE9 doesn’t support animations for instance) but a quirky technique.
.Net Magazine have produced and e-book that takes you through a few key areas including Best Tools Best Sites for your inspiration How to build a responsive site in WordPress or Drupal Common Problems and how to avoid them
BBC produce news stories many many times a day and in todays world what is news without some images to support the story. They are faced with the exact same problems that we have when approaching responsive images The need to create multiple versions of the same images Decide when to show a particular version
Testing across different devices isn’t always possible so we fallback to using emulators instead. Unfortunately this doesn’t mimic the slower network connection that can sometimes be experienced with mobile devices. This short piece from Alex Fish explains how you can do that in OSX Lion.
A follow up to the naming of the media query Dribbble shot we ran a few weeks a go. Chris has some interesting suggestions, and there’s some interesting new techniques in the comments also
Is photoshop still part of the web designer workflow? Of course it is, but should it really play as big a part as it currently does?
An interesting approach to quick testing of your responsive designs against the viewport by setting up a series of keyboard shortcut widths using Divvy.
Jason Grigsby knows a lot about the responsive web and has the wonderful ability to break down problems into simple questions. He does just this in this article on responsive images and looks at the issue of providing the right sized image and the correct one when it comes to art direction.
It’s no secret that foundation is our favourite frontend framework, and it appears it’s popular for another group of people who have created these set of tutorials covering most of the foundation features in a set of interactive lessons.
Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.