So some time ago, Cracked made a Trailer for every Academy-Award-Winning Movie Ever:

I love this.

Thug-playing actor J.K. Simmons; and…

Thug-playing actor Hulk Hogan?

Yeah, that wonderfully fractal Hogan picture is amazing, isn’t it? UNSEE!

Special literary/unexpected triplet edition!

Action Man Patrick Leigh Fermor in the 1940s; and…

Action Actor Spike from Buffy?

And also…

Suave Patrick Leigh Fermor in the 1960s; and…

Suave Sheffield actor Dominic West?

I’ll leave a Dominic West/Spike pairing as an exercise for the reader. It’s easily done—go on! Also, if (and when) they decide to do a good movie of Fermor’s life, they could do a lot worse than Dominic West.

All joking aside, Patrick Leigh Fermor was an amazing man: an inveterate traveller, a daring war hero, a fantastic writer, and apparently a joy to be around up until his recent death. RIP.

Hot on the heels of Kern Me is Shape Type—by the same people, incidentally. This type, you test your abilities to design type as well as the masters who made the fonts in the first place:

Compare your aesthetic sense with the masters of type

My mind is thoroughly blown by this. It’s another tour-de-force of HTML5 programming. Like Kern Me, Shape Type is an amazing use of the canvas element. Who knew that you’d be able to replicate Illustrator’s vector-editing environment in a web browser? Not me.

Special double fortysomething’s countdown to Christmas edition!

Really cool character the Snow Miser; and,

Deeply uncool Senator John Kerry?

But Wait! There’s More!

Really hot character the Heat Miser; and,

Deeply lame Kazon from Star Trek: Voyager?

Ba dum bum BUM; waaaAAA UM…

I’ve written before about slimming Time Machine backups. Without careful pruning of the system, developers can find that their Time Machine backups become huge. For instance, if you’re developing Rails apps, you’ll likely want to not back up your logs directories. And everyone will probably want to exclude up their Cache directories, which of course are scattered throughout the system: I’ve counted /Library/Caches/, /System/Library/Caches/, and ~/Library/Caches/; and this doesn’t cover specialised caches you can find in */Library/Application Support/, for instance, for Flash. Remember this location, and note the asterisk: these become important later.

Well, since I’ve slimmed my Time Machine backups, I’ve noticed the occasional baffling 450MB or so backup in the morning, and periodically throughout the day. I couldn’t figure out what it was—remember, Apple doesn’t let you know what you’re backing up—and I was really worried that someone had broken into my machine and was using it to relay something really unsavoury.

Enter Time Tracker by Charlesoft, the author of Pacifist (I’ve since discovered BackupLoupe, which does much the same thing). Time Tracker is a very basic app that lets you view what, specifically, has been backed up, and how big it is. It’s a big help, and it helped me identify the culprit: Roxio’s Retrospect, which I use to create monthly backups of my work.

It turns out that even if you aren’t using it to back up your entire system, Retrospect creates a huge tally of your work. It’s located in /Library/Application Support/Retrospect/ and for me at least the files there tally usually in the region of 400–600MB in size. Which is backed up periodically throughout the day by Time Machine. Yes, the backups are backing up the backups. It’s backups all the way down, people.

I’ve never actually seen his show, but I giggle at the recursion jokes every time.

So, uh, if you’re paranoid like me & use Retrospect for monthly backups (because, you know, hourly backups aren’t enough), then you’ll want to exclude this from your backups. Since then, my backups are a lot saner in size, and my backup drive is no longer filling up with alarming speed.

Type nerd? Appalled by keming? Then you will really love the Kern Me game.

Entirely too much fun

This is an inspired bit of coding, spectacularly well done. And not only do you use your left & right arrow keys to shift the letters, as in standard typesetting apps. To increase the amount of shift, and totally without thinking I held down the ‘shift’ key while using the arrow keys, and that works, too!

In my post about Steve Jobs’ death, I didn’t write about the effect he’s had on my life. I should do that, here.

I got my hands on my first computer, a Mac Classic, in 1990. The first thing I thought was: this is a new tool for art. I started creating 2-bit artwork in glorious MacPaint and, while it was silly, pretentious stuff, those pieces were the first tentative steps that got me to where I am today, illustrating & making websites. Thanks, Steve.

“Pillar”, from a series called “My Family & Other Dead Animals” (1990)

The morning brings sad, if not unexpected news: the death of Apple founder and saviour Steve Jobs.

He did a lot with his 56 years on the planet. He revolutionised computing not once but three times, with the Macintosh, the iPhone & the iPad. It’s hard to remember now, but when he took over Apple again in 1997, it had been so poorly run for so long that people thought it impossible that the company would survive. Now, it is literally the most valuable company in the world, in terms of market cap. I think it’s fair to say that he’ll go down in history.

He was irreplaceable, but—cold as it may sound—not indispensable. In fact, he saw to that. He surrounded himself with extraordinarily capable people on Apple’s management board, which includes the new CEO, Tim Cook, who is clearly a brilliant strategist & has locked Apple into a virtuous circle of success for years to come. And he worked closely with Jonathan Ive, who is a brilliant industrial designer. So, while the company’s fortunes were shaped by Jobs, its success wasn’t merely his doing. That is as it should be.

I never met him, and frankly I’m not sure I’d have wanted to. He was a famously intense man. If you ever watch him in unscripted events—interviews, say—he had this laser-like focus that I found utterly unnerving. It was like watching a predator wait for his prey to make a fatal slip-up. And, of course, there have been stories that span whole decades about his temper: it’s the reason why the lazy media always prepend the word “mercurial” to his name.

But to do great things, it seems likely that anyone would be intense & “mercurial”—you’d have little patience for fools, and the world is full of fools. I’d like to leave this with Jobs’ wonderful commencement speech at Stanford a few years ago.

Jon Gruber also referred to the commencement address. Here’s a quote he pulled from it:

Remembering that I’ll be dead soon is the most important tool I’ve ever encountered to help me make the big choices in life. Because almost everything—all external expectations, all pride, all fear of embarrassment or failure—these things just fall away in the face of death, leaving only what is truly important. Remembering that you are going to die is the best way I know to avoid the trap of thinking you have something to lose. You are already naked. There is no reason not to follow your heart.

Inspiring words. Steve Jobs, RIP.

When starting up Photoshop today I received an error:

Could Not Initialize Photoshop Because the Disk Is Not Available

And then I was told that, specifically, my scratch disk wasn’t available. Huh? I have four of them! They’re right there!

It was all very peculiar, because I haven’t changed anything about my computer in the past several months. Other than to update to Adobe’s newest version of Camera RAW. I can’t say that this caused some problems, but I searched for the error message. Several people suggested checking out the scratch disk’s permissions.

Whilst doing that, I tried a little repair tip that’s useful for a lot of applications: I started up the app with the Command + Option keys held down. Voilà! I was asked to pick my scratch disks, and everything is sorted.

My son loves Curious George. I love pretentious cinema. How can we resolved our viewing dilemmas?

Perfect. No, really, this is inspired.

I’ll admit that, at times, I’d have considered the offer
(From the ever-wonderful FailBlog)

So there’s a tiny tempest at Zeldman.com. Jeffrey Zeldman rightfully condemns the “Pottermore” website for providing a retrograde experience. What’s the problem?

It’s certainly not the sentiment: the site is pretty crap. And it certainly isn’t because J.K. Rowling is under attack: a billionaire can defend herself many times over. Plus, I don’t like the Potter books. For me, it’s simply the title of the article: “Maybe stick to novels, dear”. That chummy “dear” is a standard form of condescension. It’s frequently used to belittle women & their contributions. I mean, come on: Rowling didn’t code the site herself, so why imply that she’s some rank amateur who decided to conquer the world of web development?

Now, do I think Zeldman is sexist? No. Do I think he fell into a pretty common social trap? Yes. I’ll accept that he attempted to make a joke: but it fell flat. We all misspeak; we all say things that, with further consideration, we don’t mean. That’s why I think it’s sad to see him stand his ground. It’s Luther’s “Here I stand; I cannot do otherwise”—for a joke.

Update: There’s going to be a rally of feminism in Sheffield soon. I was struck by the poster:

We won’t calm down, “dear”

Serge Keller has compiled a series of screenshots of early websites. How far have we come?

Alta Vista, which used to be the search engine, 1996.

Alta Vista in 1996 wasn’t a million miles away from Google today. Visually speaking, that is. Apple in 1997, however, shows how much things have changed:

Apple, 1997, during its “beleaguered” phase.

It’s been a while since I’ve seen this. I think it interesting the lack of change for “harder” information gleaning, à la Alta Vista & Google. Only recently has Google been modifying its look. Information services is clearly a very conservative field.

Web designers who are interested in providing an optimal experience for viewports of widely-varying width—I’m looking at you, traditional computers, iPhone & iPad—will be very interested in responsive web design.

A term coined by Ethan Marcotte in a revolutionary article (and compelling read), responsive web design takes together a number of elements that have been rattling around recently—CSS3 media queries, fluid grids, flexible images, in particular—and Marcotte showed how they can interact with one another to provide a powerful web presence across widely varying viewports. Since then, he’s expanded upon the subject by publishing a book. It’s the single best place to go in order to get up-to-speed on the subject—although, like all “A Book Apart” titles, it’s woefully small & at best a very general introduction to the subject.

I’ve just completed the process of converting a site I’ve been working on to a responsive design. This site is an ideal candidate for a responsive web design approach in that it’s an academic site & the participants, the prime candidates to access its content, are all around the world. The site provides information about upcoming workshops, meaning that the target viewers (participants in the academic project) are very likely to access the site’s content while using handheld devices such as the iPhone or iPad. As such, I received a nice introduction into the subject, particularly with the real-world repercussions.

Janus Cascade

One thing that I didn’t notice in Marcotte’s article or book is that by wrapping our designs in media queries, a style’s cascade is now two-facing. There are massive implications with this approach, and if you take a pixel-based approach, as opposed to the percentage-based approach Marcotte takes, all hell breaks loose. Here’s an example to show what I mean:

Say you have a DIV & when the viewport is a desktop size, you want it to be 100 pixels & float left; but on an iPad’s portrait mode, you want it to remain the same size & float right; and finally, on an iPhone portrait mode, you want it to be 300 pixels & display as a block. Here’s how you might go about that:

  @media screen and (min-width: 1040px) { /* For Traditional Computers */
    div { width: 800px; float: left; }
  }
  
  @media screen and (min-width: 810px) { /* For iPad: Portrait Mode */
    div { float: right; }
  }
  
  @media screen and (min-width: 320px) { /* For iPhone: Portrait mode */
    div { width: 300px; display: block; }
  }
  

If you looked at the page with the DIV in question in your various viewports, everything would seem to be OK. But for the sake of experimentation, on your desktop machine, resize your browser window.

You’d be in for a shock if you resized your browser window. When the browser’s wide, then the DIV is big & floats left. Shrink the window & the DIV floats right. What happens when you make the browser really small? Well, actually, it’ll still float right because you haven’t overridden the iPad portrait mode declaration. Now refresh your tiny browser window & you’ll see that the DIV now displays as a block. That’s because it’s not cascading the iPad portrait mode’s float declarations, because that condition hasn’t been met in your refresh. As Keanu Reeves would say: Whoah!

Now start resizing the window from that tiny width. You’ll notice that your floats aren’t floating, but displaying as a block; and furthermore, your box has not jumped to 1000 pixels in width, but has remained at 300 pixels. Again, it’s because you’re inheriting the display: block from the iPhone portrait mode declaration. See? Cascades now work two ways, depending upon how you resize. Double whoah! The solution here is to explicitly state in your iPad portrait mode that you want the div at 800px & also declare in each case where you want the DIV to float & how it’s to be displayed in the document flow.

Go With Percentages, Not Pixels

The other implication that I’ve only grazed above: working in pixels is a bad, bad idea. This is the reason why Marcotte exclusively refers to items in percentages: it’s a more elastic approach & won’t fall apart quite as thoroughly as pixel-based approaches. And in my experience, when I switched from pixels to percentages, the site coalesced really quickly.

Go Forth Warily

Freaky deaky responsive web design: you probably have a lot more testing to do now. And for Internet Explorer (prior to version 9, which is very good), you’ll need some help for reading media queries.

Make no mistake: responsive design is the future of web design & with the explosion of handheld devices, it’s very much worth it: no longer will you have to design multiple sites for different classes of devices. In fact, the first non-personal site, the Boston Globe, has just launched as a responsive site, and the power of this unified approach is self-evident.

Since we’re coming up to the tenth anniversary of the September 11 attacks in New York & Washington, and that I’m from the United States, BBC Radio Sheffield interviewed me about what I remember of the day. Specifically, I was called to the BBC studio that day & that’s where I saw World Trade Centre towers collapse; my father was in Manhattan when the attacks occurred & I couldn’t verify his safety for days; and my in-laws, who are physical anthropologists, worked with DMORT to recover bodies for months at the “Fresh Kills” landsite. This is all covered in the interview which you can download.

The thing that really hits me is that so many people saw the attacks live: not the first plane, of course, but there were many watching the aftermath of the first crash at the World Trade Centre when the second plane hit. I think that’s why our reactions are so strong: we saw it unfold, and we all slowly realised the significance of the acts we witnessed.

Unfortunately, I didn’t get the opportunity to talk about the legacy of 9/11, which includes the war in Afghanistan, the justification for the war in Iraq, the death of countless civilians, the erosion of civil liberties, the advocacy of torture, the draining of the US’s material wealth, the continuing inflammation of anti-American sentiment abroad and the decline of American power. It’s a bloody and unspeakably tragic legacy.

In any event, if you want to hear someone saying “uh” & “ah” a lot, have a listen.