So here’s a pretty satisfying thought experiment/daydream: if uncountable buckets of money suddenly landed in your bank account one morning, who would you invite to share the windfall? Just in case this happens to Yours Truly, I’m writing up a list of people who devised things which made my professional life easier over the years, so that I can compensate them appropriately before I retire to a villa in Tuscany.
This villa is absolutely positioned. Photo by Maney Digital
Felix Ritter, for View Formatted Source. Yes, Firebug has assumed its function, but I’m nostalgic for the day this add-on removed tons of guesswork from my project.
Eric Meyer, for his Reset CSS, which introduced us to a sparkling world clean of browser defaults
The other night my husband and I indulged in some old-fashioned diversion by picking through our collection of 78 r.p.m. records, playing the selections on the 1947 Delco phonograph. He surprised me with a record I’d forgotten we had: Jelly Roll Morton, late in his career, playing Willie “The Lion” Smith’s “Finger Buster;” B-side, “Creepy Feeling.”
We listened to “Creepy Feeling” first. Here was all of Morton’s legendary talent in one side–the ragtime and jazz piano styles he excelled in and defined. We had great expectations for “Finger Buster.”
This piece was also rendered with impressive virtuosity, but ultimately left us cold. The point of it seemed to be for the pianist to cram as many notes into every moment as possible, a challenge Morton met and bested. But getting all those notes in meant he discarded tone, mood, contrast–almost everything that makes a piece of music memorable. “Finger Buster” had no hook.
I’m reminded of “Finger Buster” when I look at some of the ways people write JavaScript. I see cryptic, single-character variable names, rigid adherence to object literal syntax, disdain for whitespace and for comments. Some people seem to treat their applications as the Web equivalent to the Apollo moonshot: everything must be rigorously minimized, milliseconds shaved off like millimeters, as if, say, the rendering of the lightbox on the regional sales division’s intranet login has profound, mission-critical implications.
Still others want to impress with their scripts’ obscuring structure. They don’t want you to understand it readily; they don’t want to provide the f*cking manual for you to read. They want to dazzle you with their finger busters.
Okay, time for a test.
Quick: hum the riff for the Kingsmen’s “Louie Louie.” Now do the same for any of Steve Howe’s solos on Tales from Topographic Oceans. Maybe a few of us can do the latter, and some would even prefer it. I confess to a bone-deep dislike for prog rock, and admit bias for “Louie Louie.” I’m not alone–which recording do you think has great influence?
The Kingsmen, “Louie Louie”.
Steve Howe in 1971 BBC documentary.
A trick question. Both do. Punk arose in the 1970s from both emulation of the do-it-yourself, technically simple example of 1960s garage bands like the Kingsmen, and contempt for the pretentious, technically complex example of prog groups like Yes. The original punks knew finger busting really doesn’t signify great music. If the music can’t make its point quickly, if you need lots of post-production and exotic instruments and huge concert venues to create it, and if nobody can easily recall what it sounds like, then it’s failed–doesn’t matter how many notes it has.
It’s high time finger busting JavaScript met its punk counterbalance. Too many blog posts, presentations, framework docs, and lines of code seem written with complete disregard for the basics of communication, as if hoarding information makes the writer more powerful. Just as you don’t need conservatory training to make good music, you don’t need an MS in Computer Science to write good JavaScript. My stress is on “good”–is it good if nobody understands it? If nobody can reuse it, add on to it? No. Web development isn’t a cutting contest. Let’s save finger busting for novelty records.
I’ve been perusing a lot of job postings, which is, I know, inefficient, if my goal is to find a job, but it’s interesting to see what employers are putting in their requirements.
More and more frequently I’m seeing a call for skill with frameworks–not just for Ruby on Rails or Prototype, but also for CSS. There are by now a few of these to choose from: the skins for the Yahoo! User Interface Library, Blueprint, Nicole Sullivan’s “Object Oriented CSS” (excellent work, but oh! for a less trendy name), and so on. All of them: good to use. But it depresses me that employers don’t want to hire someone who can develop CSS by hand.
I’ve barely used any of the frameworks; I haven’t needed to. I guess I’m like a Savile Row tailor in preferring to make my own measurements and to follow my own procedures. But I can’t really say “my own,” since I was the benefactor of other CSS developers, those who worked in the earliest days of the technique—Web 0.9?—and discovered its patterns.
One of these pioneers was Matthew Brealey, who contributed to the W3C CSS discussion list. In between posts he maintained RichInStyle, a one-man compendium of frontend development tips and tutorials; I had it bookmarked, if not always open in a separate browser window. Brealey somehow had the time to investigate the browser support for every proposal in the CSS 1 specification; generously, or self-aggrandizingly, he posted his findings.
He also devised a way of writing a stylesheet that, with few adjustments, I still use. Brealey’s “Masterclass” show signs of age (remember uppercase element names?), but outlines one of the most logical ways to write CSS I’ve seen yet.
A couple of his most enduring principles are, simply:
Use the cascade. Start with the most general rules at the top (HTML elements), and only then follow with those for classes and IDs. Put the toughest cases–the most obstreperous browser hacks–at the bottom of the CSS text, processed last.This rule seems obvious, but I can’t believe how many stylesheets I see beginning with class or ID rules.
Ease human usage of the stylesheet with alphabetization. Brealey wrote before we had Firebug, or even View Formatted Source. Yes, we were flying with instruments in those days; you never knew where that pesky text color was coming from, nor why your document’s h3s were in italics. But a stylesheet organized as Brealey proposed gave up its secrets more readily: the rule for h3, for instance, would be reliably beneath that for a and above that for p, and its font-style would be beneath border and above margin. Maybe the importance of this approach has diminished as far as debugging goes, but it still shows thoughtfulness, the developer’s hand.
Developed by hand, old-fashioned; an artifact, not a commodity. Sure, I’m biased in favor of hand-tailored CSS, but then I’ve seen nothing but benefits from its skilled usage. Note “skilled.” It’s thanks to Matthew Brealey and others like him that I know what that means.
Comments Off
About
The blog of Melanie Archer, Web developer, in occasionally sunny Oakland, California, USA.