by Dan Linn, Front-End Architect / Fun Master
Breakpoint Panels is a new module just released that allows you to specify which panels show in which breakpoints. It integrates with the Breakpoint module, Panels, and specifically the Panels In-Place Editor. In this post, we'll walk through how to use it. Read More…
by Adam Edgerton, Director of Project Management
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. Read More…
by Erin Seale, Web Developer
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. Set up your lazy loading the normal way - generally this is gives you HTML like this: Read More…
by Scott Vandehey, Front-End Web Developer
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. In a nutshell, media queries allow you to define alternate styles that are applied to certain screen sizes. The obvious example is to pass a mobile stylesheet to small screens, and your regular stylesheet to large screens. Read More…