Web Standardistas - HTML and CSS Web Standards Solutions

December 2009 Archives

A Dozen Questions for Mr Keith

Adactio [Detail]

Jeremy Keith is a web developer, based in Brighton, UK (home to a decidedly healthy geek scene).

In 2005 Keith founded influential design firm Clearleft, along with user experience extraordinaire Andy Budd and typographer extraordinaire Richard Rutter (Keith is described at Clearleft’s web site as ‘Lineman for the County’). Their work for an international roster of clients, along with the conferences they organise, including UX London, have helped to shape the industry.

Keith is the author of two books: DOM Scripting, an excellent introduction to JavaScript and the Document Object Model (DOM), and Bulletproof Ajax, a comprehensive guide to the creation of… well… bulletproof Ajax.

We asked Mr Keith a dozen questions.

The Session

Where did you learn your craft?

I learned from viewing source. I also learned an enormous amount from people who were generous enough to publish what they knew. Zeldman’s ‘Ask Dr. Web’, Jeff Veen on Webmonkey, and Steve Champeon’s WebDesign-L mailing list were incredibly useful.

Who inspires you?

Well, Jeffrey Zeldman, Jeff Veen and Steve Champeon for the reasons mentioned above. More recently, the people I work with are pretty damn inspiring. Actually, the entire Brighton geek scene is a pretty inspiring place to be.

What are your influences?

My DNA and my peers. As to which is the more influential … that’s the eternal ‘nature vs. nurture’ question, isn’t it? Most of the evidence seems to point to nature, much as we would like to believe that the answer is nurture.

I am also influenced by my diet, my sleep patterns, and my involuntary exposure to popular culture and pervasive advertising.


You’ve gained notoriety for several personal projects: Huffduffer and Adactio to name just two. Your personal projects seem like a place to experiment: Machine Tags, CSS (X)HTML, JavaSript… what’s next on your experimental agenda?

There’s certainly a lot of stuff out there to experiment with. With all the APIs, frameworks and open source tools available to us, the barrier to entry for ‘Making A Thing’ is really low.

That said, what I really need to do is keep iterating on the things I have already launched. The Irish music website I started over a decade ago is starting to feel quite long in the tooth. There’s a lot more I could be doing with it. I need to set some serious time aside in 2010 to refactor the code and redesign the interface.

If you were independently wealthy, affording you the luxury of a life pursuing personal projects, would you keep your day job? (If so, why?)

I would keep the day job – Clearleft is a good environment for me – but I would definitely enjoy having more time to work on personal projects.

With WHATWG’s HTML5 Specification at Last Call what one thing would you add or subtract from the specification?

Last Call! doesn’t actually mean anything with regards to WHATWG. Last Call! for W3C specifications; that’s a different matter.

I certainly don’t think I would add anything to HTML5. There are a few things I would like to see removed.

I’m not convinced that there needs to be a separate article element as well as a section element. I think the time element is unnecessarily restrictive in that I can’t mark up months (such as 2010-01 for January 2010). I also think that the new restriction imposed on the cite element so that it no longer applies to people is a mistake.

UX London

Is 2010 the year HTML5 takes hold?

2010 and every year thereafter. As browsers start implementing features, those features will get used. Dates for Last Calls and Candidate Recommendations are mostly irrelevant.

HTML5 has already taken hold. Remember that most of HTML5 already exists in HTML 4.01. In fact, the name of the specification over at the WHATWG has been updated to simply be HTML to make it clear that it encompasses all previous flavours of markup, not just the new stuff in HTML5.

Whatever happened to Microformats?

Whatever happened to RSS? Or Ajax? Seems like everyone was talking about them a few years back.

All of those technologies are now ubiquitous. The reason why we don’t talk about them all time is that it would be weird. Kind of like greeting your neighbour with, “I see gravity is working well today.”

Microformats are everywhere now. Every result on Google Maps is an hCard. Google are indexing and displaying hReviews. But what is there to talk about? They’re so simple that, once you’ve grasped the basic concept, that’s it. You start using them and they become just another part of your workflow.

It’s kind of like the situation with accessibility: you don’t make a big deal out of the fact that you build accessible websites because it’s a given.

If someone is building a website for their client and they don’t mark up contact details using hCard or events using hCalendar, they’re doing their client a great disservice.

JavaScript was cool once, then it wasn’t cool at all, and now it’s cool again. Where to from here for JavaScript?

More of the same but faster. It’s kind of fun to watch browser vendors compete on who has longest di__ who has the fastest JavaScript. It’s all good.

It’s great the way that JavaScript is now being taken seriously and it’s great the way that libraries are making it so easy to work with JavaScript and the DOM.

What I don’t want to see happen is that ‘proper’ programmers come in and try to ‘fix’ JavaScript. There was a proposal on the table for a while there to make JavaScript more like Java. I can’t imagine a worse scenario. JavaScript’s relative simplicity is its greatest strength … kind of like HTML.

Server-side JavaScript is starting to look more and more attractive. Node.js looks quite exciting. Maybe that’s where JavaScript is heading.

Bulletproof Ajax

What’s your favourite typeface?

Ooh, that’s a toughie. I think that just about any typeface can get tired when it’s over-used. I’m getting kind of sick of seeing Gotham everywhere, for example, (Obama has a lot to answer for). On the other hand, a good designer should only need one or two typefaces so asking for a desert island typeface isn’t such an unrealistic request.

Hmmm … much as I love Futura and Clarendon, I’m not sure if I could look at them forever. So I think I’m going to have to go with something classic like Bembo, Garamond, Baskerville … wait, I can only choose just one, right?

Let’s say: Mrs Eaves.

But if you were to ask me again tomorrow, I’d probably give you a different answer.

What’s your favourite plain text editor?

Textmate. I used to use BBEdit but Textmate has left it in the dust. I use CSSEdit for CSS.

What’s your favourite tea?

Thé de constructeur.

1261170900 · Web Standardistas · Follow Us on Twitter

The Fastest Page on the Web

The Fastest Page on the Web [Extreme Detail]

Although we’d suggest a few changes to the underlying markup, The Fastest Page on the Web gathers together some useful resources to improve the performance of your web pages.

[Via Mr Munroe.]

1261155480 · Christopher Murphy · Follow Us on Twitter

Ten Things...

Ten Things That Annoy the Fuck Out of Me on Twitter

Jeff Croft is not happy:

God dammit, people. You suck at this social networking thing. Allow me to educate your asses on how to suck less by outlining ten things that annoy the fuck out of me on Twitter.

We’re in 90% in agreement. Nos. 6 and 9 are particularly funny.

1261154040 · Christopher Murphy · Follow Us on Twitter

You're Living in a Fantasy World

Stuff and Nonsense [Detail]

Mr Andy Clarke has some thoughts on some of the comments aired in response to Mr Tim Van Damme’s excellent post on CSS Animations at 24 Ways:

If you are one of those people who is waiting until using progressive CSS is safe because all major browsers support the same CSS at the same time, you’re living in a fantasy world.

Do the best work that can you can with the best tools available. Learn how to explain the facts of life to your clients or employers. Give them realistic expectations. Dismiss their preconceptions. Above all, have fun.

The key words, “Above all, have fun.”

Rather than focus on the downsides of the opportunities that are emerging as CSS evolves let’s celebrate designers like Tim Van Damme pushing the envelope, or as he puts it, “fooling around.”

1260993420 · Christopher Murphy · Follow Us on Twitter

Space - The Final Frontier

Space [Detail]

Join the talented Mr Tim Van Damme on a journey into space as he pushes CSS animations to the limit in CSS Animations at 24 Ways.

His introduction to the possibilities that CSS animations offer is well worth reading, not least for the excellent “fooling around” that results in a trip to the ultimate destination:

Space - The Final Frontier

100% CSS. Impressive.

1260979260 · Christopher Murphy · Follow Us on Twitter

Meet Pastebot

Pastebot [Detail]

There’s a new addition to the Tapbots family. Meet Pastebot.

1260977580 · Christopher Murphy · Follow Us on Twitter


Analog is a company of friends... [Detail]

Congratulations to our friends Jon Tan and Chris Shiflett who, together with Alan Colville, Andrei Zmievski and Jon Gibbins, have launched Analog:

A company of friends who make web sites … a co-operative where imagination, design, and engineering thrive; good people doing good work.

A tight knit team, the Analog co-operative have collectively authored half a dozen books, presented over one hundred times at an international array of conferences, and worked with a who’s who of clients including: Digg, National Geographic and Blackberry.

Their web site marries beautiful (and customisable) typography coupled with a just-a-keyboard-click-away grid with some GeoIP goodness, Twitter API fun and lots and lots of Easter Eggs. Go find them.

1260975900 · Christopher Murphy · Follow Us on Twitter


Iconwerk [Detail]

If icons are on your agenda look no further. Iconwerk create custom icons and pictogram designs that are, in a word, beautiful.

[Via Mr Burns.]

1260975720 · Christopher Murphy · Follow Us on Twitter


Friday, December 11, 2009

A collaboration between “studio-mates” swissmiss and Fictive Kin (a dream partnership indeed), TeuxDeux is an elegant browser-based to-do application. With a restrained, minimal and eminently Swiss interface, it’s perfect for managing and tracking tasks. (It also has a lovely strapline: “What deux yeux have teux deux teuxday?”)

Mr Shiflett summarises its appeal best:

TeuxDeux is a quiet triumph of innovative visualisation. In one uncluttered glance, you see what you need to do within the context of time, workload, and progress.

It gets better, TeuxDeux is free or, should you be feeling generous (and you should be…), a cookie donation.

It gets even better, an iPhone app is next on the list.

1260580380 · Christopher Murphy · Follow Us on Twitter

Maths Dreamed Universe

Maths Dreamed Universe [Detail]

Maths Dreamed Universe, in the words of its creator, Peter Crnokrak of The Luxury of Protest, is “a quantitative visualisation of the manner within which elemental forms in nature order themselves.”

A beautifully crafted information graphic created using a custom built generative process (created with Python) it maps the numbers 0 to 100,001 in a logarithmic spiral of minimal, yet restrained beauty.

Crnokrak’s work primarily focuses on data visualisation, with a particular interest in the intersection of visual communication and data analysis. His work has been exhibited internationally and is available via Stereohype.

1260553800 · Christopher Murphy · Follow Us on Twitter

PANTONE 15-5519 Turquoise

PANTONE 15-5519 Turquoise

Pantone is pleased to announce that PANTONE 15-5519 Turquoise – “an inviting, luminous hue combining the serene qualities of blue and the invigorating aspects of green” – is 2010 Colour of the Year.

1260553440 · Christopher Murphy · Follow Us on Twitter

Type-Inspired Interfaces

OH GOOD [Detail]

Dan Mall celebrates the 7th day of 24 Ways with a detailed look at Type-Inspired Interfaces.

1260304500 · Christopher Murphy · Follow Us on Twitter

Danny Turley

27b/6™ [Detail]

Danny Turley is a user-centred designer based in Belfast. His Tumblelog is well worth a bookmark, gathering thoughts on information design, user experience and emotional design.

One of the talented team behind Dubbeltap, Mr Turley has some beautifully designed iPhone applications in the pipeline. Watch this space for details.

(Disclosure: Mr Turley is a student on the MA Multidisciplinary Design programme that we run in Belfast.)

1259850900 · Christopher Murphy · Follow Us on Twitter

Simon Edhouse Redux

27b/6™ [Detail]

It’s fascinating to watch a meme take hold, gather momentum, grow exponentially, then, as quickly as it started, expire.

Last week, amidst growing hype, we posted a short note about David Thorne’s satirical piece: Please design a logo for me. With pie charts. For free. Purportedly an email exchange between a potential client (wanting, like many clients it seems, something for free) and a designer (again, true to the archetype, being asked to work on a promise), it was a well-crafted piece of work that hit all the right buttons.

The piece tapped into the zeitgeist perfectly and gathered a huge amount of momentum, drawing a number of high profile tweets from an influential coterie of writers, resulting in exponential, Twitter fuelled, growth.

Our original comment on the story - Please Design a Logo for Me… For Free - and a follow up piece - Mr Simon Edhouse Is Unhappy - generated a huge amount of incoming traffic to this site, the latter hitting page views in the thousands (thanks no doubt to the fact that it currently occupies Google’s Number Seven spot for the search term “Simon Edhouse”).

Today, traffic surged again, thanks to a tweet – “Bliss!” – by Stephen Fry.

It’s fascinating to witness the traffic ebb and flow as an idea takes hold and is passed from one to another over time. Equally interesting is the manner in which the phenomenon of ‘internet time’ – a kind of high-speed, fast-forward mode of time in which readers wilfully suspend disbelief as they follow a meme – takes over our collective senses, often resulting in the abandonment of criticality.

It’s a testament to Mr Thorne’s skills as a writer and raconteur that so many have been swept along on the thrill of the journey he has allegedly created, presumably accepting his version of events at face value, without question. On closer inspection, however, it would appear that the true series of events might be a little less crystal clear.

Mr Thorne is a self-confessed satirist and internet personality who, in his own words (and somewhat refreshingly), believes “the internet is a playground”. Gaining notoriety in late 2008 with an attempt to pay a bill with a drawing of a spider, it’s hard to argue with Thorne’s claim(s) to internet fame.

It’s worth noting that the drawing in question, when auctioned on eBay, was won by a user who posted a bid for $10,000, but who ultimately refused to pay. When asked how he felt about the refusal of the buyer to pay, Thorne stated: “The internet is a playground and I would not have it any other way.”

It’s hard to argue with Thorne. The internet is, indeed, a playground, and herein lies the paradox. A meme, rich in carefully crafted content, capturing our thoughts. The result? Our, inadvertent, complicity.

In closing, one has to spare a thought for Mr Edhouse, who states:

I had some immediate reactions and responses to what happened, and some of those reactions were based on my complete disbelief at what I was witnessing. I have made some simple statements about my position, but it seems more is required. I am happy to do that, but I will do so carefully…

Such is the pace of the internet that one cannot blame Mr Edhouse who would be well advised to tread carefully. Disbelief, it seems, is commonplace.

1259811420 · Christopher Murphy · Follow Us on Twitter


Scala Lowercase 'a', Serif and Sans. [Detail]

Meet FF Scala Serif and FF Scala Sans, a marriage made in heaven. Released within FontShop’s first year, FF Scala Serif was the first serious serif in the FontFont library (joined by FF Scala Sans a decade later).

To celebrate the 20th anniversary of its creation, FontShop have created FF Scala, A FontFont Focus, a beautifully designed microsite revealing ‘The Story of FF Scala’. Featuring an interview with FF Scala designer Martin Majoor and examples of the typeface “in the wild”, the site is well worth a visit. (You might even add it to your collection while you’re there…)

1259781060 · Christopher Murphy · Follow Us on Twitter


USD–EUR Exchange Rate, 2006–2008 [Detail]

Written in pure JavaScript, Highcharts is a rich charting library for the painless creation of interactive charts for web sites and web applications. Working in all modern browsers (including MobileSafari for the iPhone and, yes, even IE6) Highcharts is free for non-commercial use.

Offering a cross-section of chart types (the usual suspects and more), Highcharts is extremely versatile and offers a great deal of scope for customisation. The best way to see its potential is to explore the numerous examples at the Highcharts Gallery.

Mr Kember summarises it neatly: “JavaScript graphs that don’t suck!”

1259728920 · Christopher Murphy · Follow Us on Twitter

PHP Advent 2009

PHP Advent 2009 [Detail]

Paul Jones kicks off PHP Advent 2009 with an article on Comprehensible Code. Great stuff.

Brace yourself for a month of learning as we approach Christmas.

1259726040 · Christopher Murphy · Follow Us on Twitter

Twitter (RED)™

Twitter (RED)™ [Detail]

Great to see Twitter adopting a (RED)™ colour palette to support World AIDS Day.

1259701800 · Christopher Murphy · Follow Us on Twitter

24 Ways 2009

24 Ways 2009 [Detail]

Drew Mclelland kicks off 24 Ways 2009 with an article on Working With RGBA Colour. Great stuff.

Brace yourself for a month of learning as we approach Christmas.

1259698440 · Christopher Murphy · Follow Us on Twitter

@standardistas: Follow Web Standardistas on Twitter.