Responsive Design

We’ve written 9 blog posts about Responsive Design. View all topics »

1. 

   Grunt Plugins Reviewed

   

   7/17/14

   by Cat Farman

   The movement towards designing with performance budgets in mind has inspired more fist pumps and vuvuzela bleating in this developer than the recent World Cup. Thinking through the ramifications of design choices for site performance makes it easier for me to build a fast website when development begins.

   But when it comes to testing against budgets, we’ve been measuring page weight and rendering times manually, using tools like WebPageTest.org and Yahoo’s YSlow. Relying on humans to run tests has meant we don’t always measure our performance consistently, therefore missing page weight hogs like the occasional stray Blingee. There has to be a better way, right? A curious client got us wondering how we could automate our performance testing.

2. 

   Cognition Roundtable

   

   6/5/14

   by Michael Johnson

   On this edition of Cognition Roundtable, we ask: “Does every site need to be responsive?” This question has been an undercurrent topic for conversation in the web industry ever since RWD was introduced, but our own work as well as others’ continue to spark it again and again. Design Director Michael Johnson leads a discussion on the differences between adaptive, responsive, and dedicated sites with Senior Designer Yesenia Perez-Cruz and Developers Anthony Colangelo and Sam Hernandez. Tune in for this half-hour discussion that also covers:

3. 

   A Simple Grid Mixin Explained

   

   11/7/13

   by Allison Wagner

   Successful design systems stand on the shoulders of sound grids. Grids form the groundwork for a uniform yet flexible suite of templates. Their layouts hold containers that fit together like pieces of a puzzle. Last week, Happy Cog, in partnership with Mijingo, released the 7th video in The Happy Cog Way series: “The Basics of Grids.” In it, MJ discusses using a nice little web app called Modular Grid Pattern, a grid generator that can export into a variety of design programs.

4. 

   Fall Back to the Cascade

   

   10/24/13

   by Cat Farman

   When we think of responsive design, we typically focus on newfangled mobile devices like smartphones and tablets. But, as front-end developers, we still need to account for older browsers that can’t handle the newest CSS3 techniques when rendering our sites. In the case of responsive design, that means our old friend Internet Explorer 8 (and below) needs some extra handholding when we build our sites with media queries. These browsers don’t support media queries, and since they are still in widespread enough use that we can’t ignore them (~10% of users are still using IE8), we have to come up with new techniques for gracefully degrading our sites.

5. 

   The Web on the Web’s Terms

   

   10/3/13

   by Brandon Rosage

   After finishing journalism school, I worked for a series of terrific newspaper and radio companies. Barely two years into it, after flirting with the web, I quit.

   Compared to the web, print and radio had limited reach and were clumsy to use. In print, we plugged content into a fixed canvas and delivered the same experience to every reader. The closest we got to flexibility was an evening edition or special insert. The web attracted me because it couldn’t have been more different. It challenged me to design and build something that can reach anyone on any web-browsing device—a cause worthy of committing my career to.

6. 

   The Happy Cog Way

   

   9/19/13

   by Ryan Irelan

   When Jeffrey Zeldman started our studio in 1999, he established an ethos of openness, sharing, and teaching. Since that time, Happy Cog practitioners have spoken at conferences, written articles, authored books, and published code for others in the industry to learn from our experiences—good and bad.

   Earlier this year, Happy Cog partnered with my publishing business, Mijingo, in an effort to share the knowledge of Happy Cog’s many team members and to teach, enable, and empower professionals in what we practice every day.

7. 

   Go Vertical

   

   3/21/13

   by Anthony Colangelo

   Devices come in all shapes and sizes—from iPhones, to the massive Galaxy Note, to the tall-but-skinny Nexus 7, to 10-inch iPads, and massive, 30-inch displays.

8. 

   Invention is slow.

   

   2/28/13

   by Michael Johnson

   By now you’ve probably seen Noah Stokes tweet assailing responsive web design’s command over aesthetic:

9. 

   Discontent

   

   5/24/12

   by Jeffrey Zeldman

   Have you ever had to fit three lead stories onto a web page that was designed for only one? Ever needed to hastily rework a design because nobody realized that a product description might run to more than 200 characters until after you delivered the templates? Ever found yourself slapping big yellow alert banners and screaming headlines onto an otherwise tastefully designed home page because the layout actually distracted your users from the site’s most important content? (And why did the layout distract them? Not because it was elegantly designed, but because it was designed before the client figured out the content strategy.)