responsive web design

How (not) to think about Responsive Design.

The most important question we should ask is, "to what are we responding?" It's not too far to jump from that question to the point I want to drill in: we're thinking about the wrong kinds of interactions. In some cases it's egocentric, but the main idea is that we must change the thinking and dialogue to focus more on real-world user interactions.

A Simple Device Diagram for Responsive Design Planning

At Metal Toad we're big fans of responsive design, but a common snag in the responsive planning process comes when choosing what device widths to design to. Just yesterday we had a big internal debate over what the best widths to design to are for 3 layout sites, 4 layout sites, etc. I'll get to our conclusions below, but another important distinction to call out is that for each layout there are two things to consider: what the pixel width range for a specific layout should be, and what pixel width the designer should create the PSDs at.

Improved Lazy Loading for mobile devices (iPhone, Android) with Lazy Load 1.7

The latest version of the jQuery Lazy Load plugin (released Jan 29th, 2012) included the ability to customize your data attribute parameter. This is a pretty helpful update; I realized it could be used to set multiple source images for the same node. Here's how you can use it to optimize images, cutting down on data transfer for mobile devices.

When it comes to Mobile Development, Stop Worrying about Bandwidth

When it comes to mobile development, I've seen a lot of buzz recently on how CSS3 can help people eliminate images and cut the bandwidth requirement for their websites, however if a good mobile experience is important to you, you may want to think twice before deciding how to retrofit your website.

Responsive Web Design and HTML5 are the Future

With the latest launch of the Amazon Kindle Fire Tablet, the world is now up to more than five major Android hardware providers. Among each of these, there is also a wide variety in the screen sizes, from the smart phones to mid and larger tablets. Outside of the Android market you have the 800 pound gorilla, Apple with their iPhone, iPod & iPad. And you have RIM with the Blackberry and Nokia (who still can't decide what they are going to use).

How we made the Metal Toad site more mobile-friendly with media queries

There’s been a lot of buzz lately about Responsive Web Design, and in particular about CSS3 Media Queries. When our CEO recently asked me to make our site easier to view on his mobile phone, I jumped at the chance to retrofit our fixed-width layout using these new techniques.

Interested? Let's talk.