Type Exploration #6

Type Exploration on CodePen

Just a small visual for this week. Work is set with Passion One, and Life is set as Mr Bedfort, from Adobe Edge Web Fonts. Small embellishment on hover.

I plan to add to this pen over time as my attitudes toward a work/life balance evolve.

Friday Type Exploration #5

Type Exploration #5 on Codepen

This time, a simple blockquote with embellishment, set in Economica. A little harder to read at smaller sizes. Tired pattern, or trusty standby?

Friday Type Exploration #4

Type Exploration on codepen

Ubuntu headings, body set with Titillium Web. It feels very clean and readable.

Friday Type Exploration #3

Type Exploration on codepen

Source Sans Pro. I spent a lot of time working with the contrast. Any ideas to make the grey and yellow color palette work better?

Friday Type Exploration #2

Type Exploration on codepen

PT Sans with embellishment.

Friday Type Exploration #1

Type Exploration on codepen

First installment, a simple one. Open Sans Condensed, no frills, high contrast.

The Device Test Imperative

When creating the masthead for this site, I was quick to ensure support in Chrome, Firefox, and IE 10-8. It was easy, I suggest too easy, to test the fluid layout and media queries by resizing the window, or using a tool like this one to gut-check various viewports.

None of this, however, could satisfy the necessity of testing on a real mobile phone. Here’s what I saw on mobile Safari on my iPad and iPhone:

The site on an iPhone, for some reason not adhering to the same viewport as desktop browsers.

Frustrating! What could have caused this? I kicked into Firefox’s 3D mode, confirming the masthead’s 200% width trick was extending the page width, but my current overflow: hidden declarations were not being honored.

Some digging revealed that mobile Safari overflow rendering rules are different, and that I should try the following CSS.

    overflow-x: hidden;

Sure enough, fixed for all tested version of Safari. Need to test Android and other devices, sure, but this was another small reminder to get into a browser - especially mobile browsers, as soon as possible.

Design Is Parenting

When my son was born, I was obsessed with the temperature of his bath water. What if it was too hot? Too cold? Which was worse? We bought this plastic bathtub that had a built-in color-changing thermometer. We were given a color-changing rubber ducky at the shower. The baby books said between this degree and that degree, Celsius or Fahrenheit. No shortage of advice existed on the web.

Practice grew me adept at drawing X amount of hot water and Y amount of cold, and how to cancel mistakes or maintain temperature by adding Z amount of warm. And always, if in doubt, I had my arsenal of thermometers. It took me months to gradually realize that if it was comfortable for me, it was comfortable for baby. There is no formula. Find comfortable. Trust.

At An Event Apart - Seattle, there was a lot of discussion as to what design is, and what role we all play as designers. Some definitions included:

Design is the rendering of intent.

Design is moving things around until they look right.

Design is a job

I think all of these are correct, however, I’d like to add my own:

Design Is Parenting

In both design and parenting, there is an implicit desire to create, to shape, to guide and eventually let go. I am not implying that my son is my client, by no means do I consider it that sort of relationship! But really, you can distill a lot of interactions down to whether or not you give a damn to see how it turns out. What matters most? To me, parenting is caring enough not to give up on tough problems, constantly course-correcting. It’s about trusting your gut, not what others say (though advice and basics never hurt). You must tailor your approach to each changing day.

And when you see the product of all your hard work first take steps, or fall and get back up, you breathe a sigh of relief that everything might be okay. No one was born a good parent, or a good designer. No such definitive guide could ever describe the perfect process, the playbook of teachable moments, or the motivation to continue on day after day, never really being done.


We try to set a good example. When we are gone, we hope the world will be a better place for our efforts.


I’ve taken down Browser? I Barely Know Her! citing recent events and a clearer conscience. I’ve felt this way for a while - that the pun was not worth perpetuating a stance that I do not believe in. The last straw came when I received some open and honest feedback that the novelty URL was perhaps excluding individuals from the very conversations I was trying to foster with the larger web worker community.

I’ll be migrating most of the posts here, including Stephan Hay’s responsive web design workflow review series. Progress through that has slowed, in part due to my discovery of patternlab.

Expect re-releases of old posts and explorations of RWD and atomic design in the near future.

Email Etiquette


My father-in-law wrote this to his supplier one day—probably in a rush, probably absent-mindedly, and certainly with no ill intentions. No subject, no greeting, no goodbye. The entire contents, the entire context, is right there in the message, left for the reader to infer. He’s a great guy—he has a restaraunt, (not to mention a wonderful daughter) and likes to serve meat with grill marks. No worries, good value, and very delicious.

But what is a guy to do when faced with this email?

I am amused and alarmed at the thought of this email. No doubt the sales rep receiving it was struck with momentary panic, as the Internet equivalent of a scream appeared in his inbox. And while it prompted quicker service, that was not my father-in-law’s intent. He was adding to his already scheduled order. Business as usual.

The web requires us all to walk, and write, on egg-shells. There are no context clues to guide us through conversations, contract negotiations, and change requests. In a recent conversation with a client, I appeared testy after re-explaining the terms of our agreement and pushing back on contadicting change-requests. I admit, my response could have been much more well-crafted. Looking back, I should have been more upfront about the change request process instead of reacting to a situation I had in-part manufactured. This, coupled with my client’s rapid-fire requests with no subject, no hello, and no goodbye, caused me to get defensive.

All is well again, reconciled via apologetic messages on both sides, but it served as a clear reminder of the necessity of a human touch in digital communication.

Tl;dr—The bison was delivered early.