Progressively Enhancing Progressive Enhancement

Last Friday I made a joke on Twitter about progressively enhancing the progressive enhancement on a site—turtles all the way down, ha ha. But in some ways I was being quite serious. One of the beautiful things about working on the web is that a site is never truly done, sometimes for worse but usually for the better. You can keep improving things iteratively, smoothing over the rough edges that may have existed at launch.

The Essay and Voices in Time articles on Lapham’s Quarterly feature random artwork and quotes (random in a sense that they’re only tangentially related to the article). Every issue has an associated pool of artwork and quotes, and each time we load an article we dip into that pool and inject some artwork/quotes into locations specified by the content author. This worked fairly well, but it’s always bothered me that our first implementation relied on JavaScript. So if JavaScript wasn’t available, or somehow failed (which we all know never ever happens, no no)—you didn’t get the artwork. We justified that decision based on the fact that the artwork and quotes are an enhancement on the article—the article makes perfect sense even without the random elements.

But still: it felt like it warranted a second pass. I really like how Aaron Gustafson advocates for unobtrusive JavaScript in his book Adaptive Web Design:

“Unobtrusive JavaScript is an idea that meshes perfectly with progressive enhancement philosophy because it forces JavaScript into the role of functional enhancement, as opposed to absolute requirement.”

So this past week we went back to work under the hood, pulling the JavaScript-reliant parts into a custom Drupal module. We did the same things we were doing on the client-side, except now we do them just before we render the page, using some new tricks we learned about selectively replacing markup after all Drupal modules have run. The result is a page that has all its artwork and quotes, even if JavaScript takes a nap. Most people (hopefully) won’t notice a thing, but I’m glad that we’ve continued to move towards a more accessible and inclusive site.

Lapham’s Quarterly

A few dev notes on the recently-launched redesign of Lapham’s Quarterly:

  • The site was designed and built by Bluecadet (with the exception of the online store, for which we only did the design templates). Design was led by Theresa Decker. Will Vedder and Greg Sarault handled most of the development. Kevin Zakszewski did a lot of early responsive prototyping during the wireframe and design phases. Rebecca Smith handled both content strategy and project management (!). I did technical strategy and a few tricky Drupal/JavaScript pieces.
  • It’s a Drupal site. Drupal can be a sprawling beast sometimes, but it was a good fit for this project because of the complex relationships between issues, contributors, and individual articles.
  • We built and deployed the site on Pantheon, which allowed us to open up the CMS to content authors in one tier while we developed/tested on the other tiers.
  • A lot of Lapham’s Quarterly’s content requirements involved some form of what we internally dubbed “sophisticated whimsy” – Essays and Voices in Time on the issue page had to be pulled randomly, for instance. We ended up doing a few compound views to achieve complex layouts.
  • Artwork and quotes that appear on Essays and Voices in Time are not directly related to the piece itself (carrying over a hallmark of the print quarterly). For the website, however, Lapham’s Quarterly wanted the artwork and quotes to also be random, lending the piece a slightly different look each time it was loaded. Content authors choose the point at which they want to insert an instance of one of three types of content: a column-width image, a widescreen image, or a quote. These generate markup patterns that then replaced with a random instance of artwork, pulled from the available options for that issue (each issue has a bucket of artwork/quotes).
  • Each issue that Lapham’s Quarterly publishes has a signature color. In the website’s design system this translates to a set of four hex values to cover different states: default, rollover, emphasis, etc. We wouldn’t be able to treat those colors as Sass variables, since we didn’t want to have to add to the stylesheet each time Lapham’s Quarterly published a new issue. So they are injected at the page template level, based on the values set by content authors for that issue. The styles … cascade.
  • Lapham’s Quarterly needed a way to designate an issue as “Coming Soon”. This meant that any content associated with that issue would not be displayed/linked from the archive pages. We had to write a few hook functions to filter taxonomies prior to display.
  • Handling BC dates turned into more of an interesting development problem than we anticipated, because we wanted to keep the actual date value different from the display, to make sorting content by date easier. We ended up writing a small custom module to transform BC dates for display.
  • There was a lot of iterative design and development for this project. One example is the slide-out tab allows you to get back to the main issue page. That was originally visible at all times, but as we started testing content we realized that it obscured the widescreen images. So we turned it into a little pull-tab.
  • There’s no single workflow technique that emerged from this project, just a general feeling that team conversations around a whiteboard are rarely a waste of time. In most cases we arrived at a faster, more bulletproof solution than if we had sealed ourselves off to work in isolation.

We’re still fine-tuning thing under the hood, but I’m very happy with how the project turned out.

But Sleep *is* Work

Sleep

Several days ago I tweeted this:

We would probably be better off if we approached sleep as a productive action, not just a break from “real” work.

I haven’t stopped thinking about it, because I’ve been attempting to wake up just fifteen minutes earlier to read and pray, and the difficult part is that I should also be going to bed earlier. And that’s hard, because it feels indulgent.

I’m not sure when and how we’re taught to confuse sleep and rest with laziness, but here’s a (misunderstood) clue from the end of Proverbs 24:

A little sleep, a little slumber,
a little folding of the hands to rest—
and poverty will come on you like a thief
and scarcity like an armed man.

Well, okay then.

Of course, if you read the whole passage, that verse comes after the author “went past the field of a sluggard, past the vineyard of someone who has no sense”. So it’s an indictment of laziness, not rest itself. Keep in mind that this is the same culture that had the Sabbath, where you were expressly forbidden to work. It’s as if the Old Testament God didn’t trust Israel to rest so he made it illegal to work for that one day.

Do As I Say, Not As I Do

I once asked my wife why she didn’t nap when our kids took their afternoon nap. “Because that’s my only time to get things done”, she replied. And this is true, except that we don’t sleep much in the evenings, either. Parents make kids take naps because we know that they don’t function well without them, yet somehow we convince ourselves that those same physical/cognitive/emotional limits don’t apply to us. We’re adults. We’ll power through.

Busy Work

My friend Roberto called for more “idleness” as an addendum to my tweet—which I took to mean giving the brain enough time and space to unspool creatively. Shortly afterwards I read “Interrupt the Program” by Kio Stark, which closes with this exercise:

Do Nothing

Sit by yourself somewhere in public for 7 minutes without looking at your phone. It has to be somewhere without a TV. Neither of these are bad, I like them too. Do it anyway. This may make you uncomfortable. Do it anyway. Unless you choose to sleep, you will find that you are forced to look at something. What is it? Are you reading signs or looking at things in store windows? Are you looking at other people? Are you looking at trees? Water? Sand? Cement? If you start talking to yourself in your head, you are doing this right. I should have said at the beginning, take a pen in case you want to write something down. You can write on your hand, it’ll wash off. You have been awake.

I love that last line: “You have been awake”. It makes me look at my autopilot, head-down, get-things-done mode as somehow not fully awake, a fugue state where importance and urgency are confused. Busy work, then. Much visible effort to little purpose.

Nap Room

Bluecadet is moving to a new office this fall, and there’s been lots of half-jokes about the need for a nap room. We laugh, because we know it would never happen. But what if it did? I’d wager we’d see more productive people. The danger that I see is if people use the nap as a way to shortchange themselves even further from their evening sleep.

Perhaps our true weakness lies not in our inability to push ourselves past limits, but in our refusal to take care of our very selves.