event notes, events, technology & web

Notes From An Event Apart Austin: Ethan Marcotte

More notes from An Event Apart Austin… Ethan Marcotte (@beep) presented “Laziness in the Time of Responsive Design” and full disclosure: It wasn’t about being lazy overall, but was all about getting things setup now up front to let you be lazy later. Definitely good sense!

On laziness:

“Embrace laziness in responsive design” through layout, navigation, & animation. Twitter Bird Icon 16x16

Frameworks are vocabularies. They are philosophical conditions, not rigid systems of repetition. Twitter Bird Icon 16x16

“Design the transaction, not the interface.” Then, layer in complexity. Twitter Bird Icon 16x16

On using max-width:

  • We’ve used “max-width:100%” for images, objects, & videos.
  • But what about height?

Examples to check out:

  • fivethirtyeight.com — Great example of responsive navigation. When screen size reduces, navigation menu switches to hamburger & only top-level links remain.
  • BBC News — Watch how some navigation links are under a “more” link depending on size of screen. It shifts seamlessly and keeps the menu from being overwhelming.

Note: The Twitter bird icons link to the corresponding tweet for each piece. Thanks to @mor10 & @sbeatty for live-tweeting the talk along with me on #aeaaus. 🙂

Notes on some sessions linked on this page (and more added as I post them).