Archive: July, 2007

61

sparkline
                    5th                     10th                     15th                     20th                     25th                     30th     
12am          
4am
8am              
12pm                        
4pm              
8pm                

Tuesday, July 31st, 2007

Big time

I’m back from my week in New York and, as promised, I took a whole bunch of typical tourist photos. Needless to say, I had a wonderful time: that city really is all it’s cracked up to be. But for most of my stay I wasn’t being a tourist; I was working.

I spent five days enjoying the company of the standards-savvy developers at Time Warner. They couldn’t have been nicer. I even had my own office on the 19th floor for the duration of my stay.

Two of my days were spent giving workshops in DOM Scripting and Ajax. These workshops went well but given the banner-ad driven business model of most Time titles, it seems unlikely that the marketing folk will allow much Ajax. It was kind of heartbreaking to see the developers’ ideas for improving the user experience get dashed on the rocks of page views. Still, things may change. Nielsen is changing its metrics from pages viewed to time spent. David Sleight is doing some celebratory cartwheels at this news. Had I known last week that he works in the office directly across from the Time Warner building, I might have been able to catch a glimpse of his gymnastics from my office window. Maybe next time.

The rest of my time in the belly of the publishing beast was spent looking at some code, chatting and generally geeking out with my Big Apple colleagues. I found some time in the middle of all this to give an impromptu presentation on microformats. Magazine-based sites (especially those in the sports and entertainment categories) are ripe candidates for some hCalendarisation.

I really enjoy talking about microformats as my captive audience at the BBC last month can attest. Just wind me up watch me go. When I’m on my microformats high horse, there are a number of recurring themes that I always touch on: where microformats come from, how you can consume them, and who’s publishing them already. On that last point, I usually cite some of the cool kids like Flickr, Upcoming and Twitter as well as the big names like LinkedIn and Yahoo Local. When Yahoo started supporting microformats, Richard MacManus was prompted to ask what chance, Google? Well, ever since Kevin Marks left Technorati to join Google the chances have been very good indeed.

Last week Google put hAtom in all newly created Blogger templates. That was a welcome step but today’s announcement completely overshadows it: Google Maps now returns search results in hCard:

Today we’re happy to announce that we are adding support for the hCard microformat to Google Maps results. Why should you care about some invisible changes to our HTML? By marking up our results with the hCard microformat, your browser can easily recognize the address and contact information in the page, and help you transfer it to an addressbook or phone more easily.

This is a huge leap in the number of published hCards on the Web. It would be interesting to get exact numbers but I’d guess that the amount of places returned in Google Maps searches runs into the millions. The beautiful thing about all this is that I suspect the change was trivially easy: just adding a few extra class names into a template.

With this seismic shift in the landscape of published microformats, I think we in the microformats community may have to shift our focus slightly. Instead of just being concerned with evangelising the publishing of microformats, it’s now incumbent upon us to show regular Web users how they can consume this wealth of semantic information, whether it’s through the use of a Firefox plugin like Operator, bookmarklets or—soon—native browser support.

Our work is just beginning but before we dive in, we can afford to pause for a few moments today to celebrate this great leap forward.

What's New at The W3C Markup Validation Service

The Validator got a new lick of CSS paint and it's looking good.

Official Google Maps API Blog: Microformats in Google Maps

W00t! This is a biggie! Google Maps now returns its listing results in hCard. Now you can do one-click export to your address book (or phone).

Web Designer Wall - Design Trends and Tutorials

A nice collection of CSS tutorials and design trends.

circaVie | Create and Share Timelines

From the people who brought you Ficlets comes a nice app for creating personal timelines. Microformats and OpenID support included.

Total Makeover Retouching

Now your child can look like a denizen of the uncanny valley with just a little Photoshop magic.

Monday, July 30th, 2007

Type the sky | Slanted

Finding letters everywhere.

social-network-portability - Microformats

Tantek, Brian, Daniel and others got together in Ritual Roasters to discuss making portable social networks a reality. Here are the notes.

Top 10 dotcoms to watch | Technology | Guardian Unlimited

Bobbie draws up a list of UK startups to keep an eye on. Moo is here of course but so is Dopplr.

[this is aaronland] Trying not to cut down the trees for an inability to see the forest

Aaron weighs in with his thoughts on JavaScript, web apps, the iPhone, dashboard, the papernet and more. Oh, and he's built a machine-tag mashup.

Biologists Helping Bookstores

A blog devoted entirely to reshelving books in their correct categories in bookstores, specifically the science and religion categories. I approve.

Friday, July 27th, 2007

ANN: Blogger adds hAtom microformat - Blogger Data API | Google Groups

"All new blogs, and all blogs that use Layouts and have unmodified blog page element templates now have hAtom classes in them."

Wednesday, July 25th, 2007

Twitter / Dori: Ann from conf: AOL ships br...

A browser-based IM client from AOL. You heard it here first folks.

Microformats: More Meaning from Your Markup [HTML & XHTML Tutorials]

Great article from Brian ranging from introducing microformats right up to the current state of play.

Thirteen Simple Rules for Speeding Up Your Web Site

The justification behind YSlow. If you've heard Nate Koechley speak, some of this will be familiar to you. It's all solid advice as far as I can tell.

YSlow for Firebug

The YUI folks have released an add-on for Firebug that will analyse your pages and suggest ways of speeding it up.

Tuesday, July 24th, 2007

dpaste: #15223: LOLDOM, by Jeremy Keith

Okay, this started as a joke but then I couldn't resist writing a bit of code. Usage: OH_HAI.I_CAN_HAS_ELEMENT_BY_ID("Id") and OH_HAI.I_CAN_HAS_ELEMENTS_BY_TAG_NAME("tag").

Monday, July 23rd, 2007

the 200ok weblog: syndication needs to get social

Ben Buchanan on how most supposedly open Web 2.0 (sic) sites are really walled gardens lacking interoperability.

Burningbird » How I Got My Harry Potter Book

Forget fan fiction. This is the best piece of Potter-related writing you'll read in a while.

Sunday, July 22nd, 2007

Macback

Playing a gig is tiring. There’s the actual playing on stage—which can get pretty sweaty—but it’s the hauling of amps and instruments that inevitably means that a gig night is a late night. So after playing a Salter Cane concert on Friday night, I had a nice long lie-in on Saturday.

When I did finally emerge, I slothfully sat with my iBook, casting a casual eye over the Web via Twitter, Flickr and all my habitual haunts. At five minutes to midday, I glanced at my mobile phone and saw that I had missed a call. In no particular hurry, I listened back to my voice mail.

The message was from Robert Harding, the authorised Apple service provider who was replacing the hard drive in my borked Macbook. The message said that my laptop was ready but I’d need to pick it up before noon. That was just five minutes away!

I quickly called him back and asked if he could stay open a little longer. It turns out that he normally doesn’t even work on a Saturday but he had gone the extra mile to get this done and he really needed to be somewhere else soon… but he would hang on until ten past twelve.

I’ve never dressed so fast in my life. While I was donning some clothing, Jessica called a taxi for me. I ran downstairs and began counting the seconds until the cab came ‘round the corner. It showed up, I hopped in, and away we went.

I made it. Just. While the taxi waited outside, I ran in and grabbed my Macbook, thanked Robert Harding profusely—he gets a thumbs-up from Jane and Richard too—and took the same cab back home.

Now I had my Macbook back with a brand new hard drive. Thus began a long day of file transfers, downloads, SVN checkouts and cabalistic command-line push-ups involving Apache, PHP and MySQL. I’ve just about managed to restore the machine back to the state it was in before its meltdown.

And not a moment too soon: in a few minutes I’ll be heading to the airport to grab a flight to New York where I’ll spend the week giving workshops and consulting with Time Warner. I had more or less resigned myself to bringing the iBook but, assuming that this machine stays fixed, the extra power of the Macbook will come in handy.

Expect numerous clichéd tourist photos in my Flickr stream.

Friday, July 20th, 2007

Thursday, July 19th, 2007

Stickiness

I attended my first Brighton Geek Girl Dinner last week. I was there as a guest of Jessica—guys are permitted to attend if they are guests of girl attendees—but I was also present in the more official role of being a sponsor.

The event was partly sponsored by dConstruct. As part of the sponsorship deal, we’re giving away two sets of two tickets to the conference. If you’re a girl geek, you’ve got until July 31st to win these tickets (and you know how coveted they are). You can find all the details on Rosie’s blog.

Denise Wilton, who will be speaking at this year’s dConstruct, was the guest of honour at the dinner. She gave a great talk about building personality into applications. A lot of it was about the importance of good, suitable copy. This is the kind of thing that Tom Armitage talked about at Reboot this year in his presentation The Uncanny Valet. In fact, Tom specifically mentioned the example of “little moo” and “big moo”.

Denise works at Moo, you see. Those lovely people are responsible for cute business cards and note cards. Now they’ve added another tactile toy into the mix: stickers.

Moo stickerbook

I was lucky enough to get a sneaky try of the latest product before it officially launched. As expected, the process of putting together a sticker book is straightforward and fun. And the stickers themselves are really nicely finished. I expect to see lots of these little pics cropping up on notebooks, laptops and mobile phones.

To celebrate the official launch of Moo stickers, there’ll be a party in London tonight. I’ll be going (of course!) and in true coals-to-Newcastle fashion, I’ll be bringing some stickers with me… microformats stickers, courtesy of Dan.

I can has stikerz?

Wednesday, July 18th, 2007

Mashed

It sounds like Mashup Camp was a hive of very productive activity. Kevin Lawver gave a presentation on portable social networks but instead of just talking about it, he wrote some Ruby code. Kevin is using OpenID for log in, followed by hCard parsing and XFN spidering (see also: Gavin Bell’s work). Superb stuff!

Meanwhile, Plaxo is now supporting OpenID and microformats thanks to the efforts of Kaliya and Chris.

And just in case you think that this is still a niche geek thing, here are the job details for Program Manager of Internet Explorer over at Microsoft:

Does the idea of redefining the role of the Internet browser appeal to you? Do the terms HTTP, RSS, Microformats, and OpenID, excite you? If so, then this just might be the opportunity for you.

Sentenc.es - A Disciplined Way To Deal With Email

I'm the world's worst emailer. This may help me.

Tuesday, July 17th, 2007

Portable Social Networks at Mashup Camp :: UltraNormal

Kevin Lawver has implemented portable social networks by mashing up OpenID and microformats in Rails. Read the presentation and download the code.

Brighton Girl Geek: Competition - girl geek logo and slogan

Want tickets to dConstruct? If you're a girl geek, here's your chance.

Monday, July 16th, 2007

Channy’s Blog - » 『DOM 스크립트』 출간 이벤트!

DOM Scripting... now also available in Korean.

5 segundos

Superb blood donor video. Which reminds me...

Guardian Unlimited: Arts blog - books: Punctuation is no place for zero tolerance

One of my 43 Things is to eliminate the grocer's apostrophe. Still... this is a well-reasoned argument in its defence.

Sunday, July 15th, 2007

Ticked off with Apple

When I got my new Macbook just over two months ago, I was somewhat wary of how it would compare to the workhorse of an iBook that I’d had for so long. I’m not necessarily saying that Intel chips are inherently shit but I had heard enough horror stories from friends to make me think that a good ol’ G4 was a geek’s best friend.

Pretty soon though, I got used to the Macbook’s speed and power and I quickly learned to live its quirky reflective screen. Before long, it became my main machine.

How premature of me! Last night the Macbook started making regular ticking noises. A loud click is emitted every second. I tried shutting down the laptop and was confronted with the spinning beachball of death so I held down the power button to force a shutdown.

After letting it cool off for a while, I tried starting up the Macbook. The ticking resumed immediately. And now, instead of booting into OS X, I get the dreaded flashing question mark folder. PRAM zapped. System Management Controller reset. All to no avail.

I’ll probably have to send the laptop away to get repaired. But I really can’t afford to be without a laptop—I’ve got a trip to New York coming up next week that involves two days of workshops. So I dug out my old iBook and—touch wood—it seems to be working okay. No freezes or kernel panics yet. Sure, the iBook feels a bit slow and claustrophobic compared to the Macbook but at least it isn’t constructed made of shoddy hardware.

I have a lemon that’s less than three months old. Tomorrow I’ll begin the long hold’n’explain with the Corkonian support staff. I hope they’ll deal with this situation lickety-split. I’m not happy about this.

It could be worse though. At least I’ve only got a couple of months of photos and music to lose. Over at The Onion, you can see ongoing coverage of Webcrash 2007:

Although the Internet did restart, all data had been lost. At an emergency press conference, White House Press Secretary Tony Snow revealed that the goverment does not have a back of the internet but had “always meant to get around to making one.”

The King of Kong: A Fistful of Quarters | Official Movie Site | Picturehouse

The next Spellbound-style documentary is all about Donkey Kong. "A middle school science teacher and a hot sauce mogul battle for the Guinness world record on the arcade classic, Donkey Kong."

Session.Org session SSWC'07 - a photoset on Flickr

This is simply marvelous! A meatspace gathering of musicians that know each other threw the Irish music website I run, The Session. I wish I could have been there.

SSWC07_08

Saturday, July 14th, 2007

YouTube - 100 Movies, 100 Quotes, 100 Numbers

Here's an antidote to all those "100 best movie" countdowns that infest Saturday night television. Here's 100 movies with 100 numbers.

Friday, July 13th, 2007

BBC NEWS | World | Middle East | British blamed for Basra badgers

UK military spokesman Major Mike Shearer said: "We can categorically state that we have not released man-eating badgers into the area.

BarCamp Brighton Blog » Blog Archive » BarCamp Brighton Logo

Here's the logo for BarCamp Brighton, taking place the day after dConstruct. Looking good.

Wednesday, July 11th, 2007

Open Business Models MicroFormateurs: 2007-07-11

Magnifique! A French translation of my blog post about mashing up microformats.

Your Daily Awesome » David Byrne Interviews David Byrne, 1984

This video of David Byrne from Stop Making Sense era Talking Heads is as brilliant and wacky as you'd expect. David Bynre is teh awsum.

Tuesday, July 10th, 2007

BBC NEWS | Magazine | Should we simplify spelling?

The cawl for speling reform in the Inglish langwidge iz misguyded and franklee, kynd ov styoopid.

Police In Knife Standoff Up For Awards (from The Argus)

Yet more on the events I blogged about down the street, again from the local newspaper.

We Love to Fly and It Shows: Inside the World of Mileage Running

This is a fascinating insight into a mindset that I simply cannot comprehend. Sounds like hell.

Faceball: your face, our balls

Here's a little teaser from Dunstan. Prepare for the greatest sport of the century.

Grab your place at dConstruct

I’m preparing for a big day at the Clearleft HQ. Tickets for dConstruct 2007 go on sale at 11am today.

Historically, dConstruct has always been fast to sell out (to sell out of tickets I mean… not to betray its principles). The first dConstruct sold out in just half an hour but there were only a hundred places to fill. Last year’s conference had 350 places and took a day and a half to sell out. This year we’ve got a lot more room—about 600 seats. I think we’ll manage to fill all the seats but tickets probably won’t sell out quite as fast as previous years. If you’re of the gambling persuasion, place your bets now.

I’m reviving the podcast of the conference; it was pretty popular last year. Once again I’ll be releasing sporadic, short, snappy episodes in the run-up to the event. I’ve already got two in the can: a retrospective of last year’s talks and a chat with some of the Last.fm folks which was recorded at the culmination of a night of carousing in San Francisco. I think that one will be hard to top. I may have to record all my interviews in the same manner.

This year’s dConstruct will be quite different from previous years. There’s the subject matter for a start: Designing the User Experience. Then there’s the workshops. For two days before the conference, you have the chance to attend full-day hands-on workshops in the salubrious surroundings of Casa Clearleft. Places on the workshops are limited to 15 people to keep things intimate and two of the workshops have already sold out. But you can still book a place on Thomas Vander Wal’s Tagging workshop and there are still places left for the workshop that’s dearest to my heart: Microformats.

The microformats workshop will be a joint effort by myself and Tantek. With our combined strength, we can end this destructive conflict and bring order to the galaxy… or, failing that, deliver a kick-ass workshop that will embed knowledge of microformats straight into your neocortex. We’ve got lots of ideas and I hope we can squeeze them all into one day.

So if you or your organisation has any interest in the semantic power of microformats, then you or your boss should book a ticket now.

Oh, and did I mention that attending a workshop automatically gets you a free ticket to the conference too?

Update: Wow. Tickets sold out faster than I thought—just 6 hours. Now the only way to secure a ticket to the conference is to grab a workshop ticket.

Monday, July 9th, 2007

The Amateur Gourmet: "Ratatouille" & Jewish Assimilation (an essay, with spoilers)

The Amateur Gourmet compares Remy's trials and tribulations in Ratatouille to the quintessential story of Jewish assimilation in the 20th Century.

shawnblanc.net » Why Daring Fireball is comment free

This transcription of John Gruber's justification for not having comments makes for superb reading. This is what blogging is really about.

Hero PC Tackles Knife Man (from The Argus)

Here's the local paper's take on the happenings on my street that I blogged about.

Sunday, July 8th, 2007

BBC NEWS | England | Sussex | Man attempted to stab policeman

The somewhat lightweight BBC report of the incident I blogged about earlier. "Reports of a man with a knife threatening and chasing people": that's me (the reports, I mean).

Saturday, July 7th, 2007

Typing up

I’ve been making some tweaks to the CSS for the default skin here at adactio. If you only ever read via RSS then you won’t have noticed but I’ve been adjusting the vertical rhythm.

I also wanted to get some horizontal alignment: I wanted to make sure that the bottom of the first heading in the main column lined up with the baseline of the first heading in the sidebar.

headings

My basic unit is 20 pixels: a font size of 12 pixels with a line height of 1.6667. Whatever sizes I made the headings, I wanted to be sure that they were multiples of this basic unit.

body {
 font: 12px/1.6666 Helvetica,Arial,Verdana,sans-serif;
}
body * {
 font-size: 1em;
}
* html body {
 font-size: 76%;
}

Because Internet Explorer refuses to resize text specified in pixels, I’m using the * html hack to give it a percentage value. Using any kind of hack—or filter—makes me feel slightly icky. Once I’ve established the base font size using pixels, percentages, or any other unit, I can use ems to scale up and down from here on out.

The level two heading in the main content takes up 40 pixels in total (twice the basic unit). The font size is 24 pixels, the top padding is 8 pixels and the bottom padding is also 8 pixels.

h2 {
 line-height: 1;
 font-size: 2em;
 padding-top: 0.3333em;
 padding-bottom: 0.3333em;
}

level 2 heading

So while the overall size is 40 pixels, the descent is at 32 pixels: 40 minus 8 (the bottom padding).

I wish I could accurately calculate the baseline but as far as I can tell, font-size is calculated from the ascender height to the descender height. In the absence of any reliable way to pinpoint the baseline, I’m going to have to work with where the descent begins instead.

Level three headings also take up 40 pixels in total but the space is apportioned differently. The font size is 18 pixels, the bottom padding is still 8 pixels but the top padding is 14 pixels.

h3 {
 font-size: 1.5em;
 padding-top: 0.7778em;
 padding-bottom: 0.4444em;
}

level 3 heading

The descent is still at 32 pixels: 18 plus 14.

The same pattern follows through for level four headings. The font size is 16 pixels, the top padding is 16 pixels and the bottom padding is 8 pixels. So the overall size is still 40 pixels (twice the base unit) and the descent remains at 32 pixels (16 plus 16).

h4 {
 font-size: 1.3333em;
 padding-top: 1em;
 padding-bottom: 0.5em;
}

So far, so good. With a little bit of addition, it isn’t too hard to ensure that everything slots nicely into the rhythm established by the base unit.

It gets a little trickier with the content in the sidebar. There, the basic unit has been scaled down to 15 pixels: a font size of 10 pixels with a line height of 1.5.

.box {
 font-size: 0.8333em;
 line-height: 1.5;
}

I wanted to make the bottom of the level three heading in the sidebar line up with the baseline of the level two heading in the main content, but I still wanted everything in the sidebar to follow its own vertical rhythm.

The font size of a level three heading in the sidebar is now scaled down to 15 pixels (18 pixels multiplied by 0.8333). I’ve changed the top padding to be 17 pixels and the bottom padding to 8 pixels.

.box h3 { padding-top: 1.1333em; padding-bottom: 0.5333em; }

level 3 heading in the sidebar

This gives me the descent at 32 pixels that I wanted. Unfortunately, the overall size of 40 pixels isn’t a multiple of the base unit of the sidebar (15 pixels).

Further down the page, there are so many factors influencing the positioning of all the elements that it’s almost impossible to guarantee any kind of horizontal alignment between both columns. Still, I was happy to get things lining up at least at the beginning of the page.

all the headings

You can peruse the style sheet if you like. You’ll see that I’ve also made some changes to the fonts I’m using. Gone are the headlines set in Verdana with body copy in Trebuchet MS. Instead, I’m using the oh-so-hip Lucida Grande for the body with some negative-spaced Helvetica for the headlines… the same kind of headline style I’ve been using in my presentation slides.

I really ought to tweak the vertical rhythms on all the other skins too but I’m not sure I can face all the maths just yet.

In the meantime I’ll be doing my homework by re-reading Richard’s classic 24 Ways article and Mark’s trials with incremental leading.

all the headings, animated

Charlie Romeo Alpha Zebra Yankee

When I arrived at the Clearleft office yesterday morning, I found Andy and Richard in mid argument.

“Indigo? No! It’s India”, said Andy.

“It says Indigo here,” Rich responded.

“Well I’m using the CAA alphabet.”

“Are you talking about phonetic alphabets” I interjected, “‘cause there’s more than one, y’know.”

I was then challenged to see how far I could get. “Alpha, Bravo, Charlie, Delta…” I did alright for a while but my brain started giving up later in the alphabet.

But it got me thinking. I should at least know how to spell certain things phonetically. For those phone calls when it really matters, it would be nice to be able to rattle off my postcode as Bravo November Three, One Delta Hotel. And really, everyone should know how to phonetically spell out their own name, right?

The office conversation turned to other matters—like which parts of Brighton were the most dangerous, with Sophie informing us that Waterloo Street (the street right down from mine) leads in the category of murder.

Cut to this morning. After a nice long lie-in, I sauntered into the living room, still pyjamad and robed, to the sound of some shouting from outside.

“Sounds like there’s another random crazy person shouting out there” said Jessica.

I looked outside and saw that the shouting was coming from a scarily stocky looking guy in the garden of the house directly across from us. Just a week ago, that house was the centre of a huge police raid involving detectives and officers in what looked like riot gear. I’m assuming that whatever they arrested him for didn’t stick.

Then things got scary. The guy came out onto the street. He had something in his hand. That something turned out to be a knife. He started shouting at strangers walking along the street and waving the knife about.

I ran to the phone and dialled 999. I could see some other people on the street doing the same thing with their mobiles. At least I was safe on the balcony—the people at ground level needed to take care of their own safety.

I started giving a blow-by-blow account over the phone of what I could see. I made sure to mention that this guy was almost certainly previously known to detectives as part of an ongoing investigation.

He started chasing people… down Waterloo Street. It was beginning to look like the street would be holding onto to its reputation for a while.

A police car arrived, screeching around the corner. The knife-wielder stopped chasing the civilians and started running towards the police car. They met in the middle of the street. He pounced on top of the car and started hammering on the roof.

I was doing my best to relay all of this down the line but this was all happening about 400 feet away from me at this point.

Another police car arrived. The officers got out. I couldn’t see clearly what was going on but I’m guessing they were trying to get him to put down the knife.

He started running back up the street. The four police officers followed. He turned. I saw him lash out with the knife. One of the police officers jumped back. I couldn’t tell if the knife had connected.

I saw truncheons in the hands of the police officers. It was clear at this point that he wasn’t about to give up the knife willingly. With a few co-ordinated blows, he was down. I’m generally not a big fan of resolving situations with violence but in this case, I felt relieved.

At the other end of the phone line, the man taking my call was thanking me for my help.

“Can I just get your name?” he asked.

“Sure. It’s Jeremy Keith”, I said.

“Jeremy… ?”

“Keith”, I said, and I started to frantically try to remember how that would be spelt in the phonetic alphabet. My mind was a blank. Must have been all the adrenaline.

“K.E.I.T.H.” I said, lamely.

Of course as soon as I put the phone down, I remembered. “Kilo!… Kilo Echo Indigo Tango Hotel. Damn it!”

As I write this, Waterloo Street has been cordoned off. The “suspect” is in custody. I’m still in my pyjamas. The first thing I did when I put the phone down was to Twitter. Then I Flickred. Now I’m blogging.

Yeah, I reckon I’ve got my priorities about right.

Thursday, July 5th, 2007

Deathwatch: Three Technorati Monsters escape - Valleywag

Valleywag is using my picture of LOLtek to illustrate a post about the recent resignations at Technorati. Ouch!

flightpatterns_excerpt.mov (video/quicktime Object)

Beautiful visualisations of flight data.

ironfeathers.ca » Home

Watch the adventures of Derek and Kathryn Featherstone in the run up to IronMan Lake Placid 2007. Check out the route maps: very slick.

Call and response

Date
3 July 2007 10:37:16 BDT
Subject
Adactio message from Michael McDonald

Mister Wong, Europe’s largest Social Bookmarking portal, is now available in English!

My name is Michael, from Mister Wong, and I am preparing the launch of the portal for the English speaking community. Your blog, Adactio, caught our eye while researching. We would, therefore, like to warmly invite you to try out Mister Wong as a beta tester.

In exchange for importing your bookmarks and feedback, you will receive a Mister Wong T-shirt and a pin set. In addition, we are also giving away an iPod Nano to one of our lucky testers.

Date
3 July 2007 10:47:09 BDT
Subject
Re: Adactio message from Michael McDonald

Hi Michael,

Great! Here’s a bookmark I’d like to share with you:

Mister Wong, the Offensive Social Bookmarking Portal

kthxbai!

Tchuess,

Jeremy

Wednesday, July 4th, 2007

Apple Developer Connection - iPhone for Web Developers - Optimizing Web Applications and Content for iPhone

Straight from the horse's mouth, advice for web developers on how the iPhone's browser renders pages. I'm very intrigued to find out how it handles liquid designs with no set min-width.

Mark Boulton Design : +44 (0)845 603 2399

Mark has launched his business site. Lovely grids and typography, as you'd expect.

Fiction Liberation Front--The Goods

Science-fiction author Lews Shiner is releasing many of his short stories online for free (HTML or PDF).

Viget Labs Is Hiring - Join Our Design Team

What excellent taste this web design shop has. I don't mean the fancy scrolling—I'm talking about what's on the bookshelf.

Monday, July 2nd, 2007

Pownce

The latest social networking app de jour is called Pownce. Like most people, I signed up a few days ago and starting playing around.

If you read the 140 character reviews of Pownce on Twitter, you’d be forgiven for thinking that Pownce is some kind of Twitter clone. Here, for example, is the collected wisdom of Paul Boag:

Just dont get pownce. Just feels like Twitter but i need to invite all my friends again

Not sure I can be bothered to update both twitter and pownce. Might have to make a decision soon.

It’s understandable, I suppose. Pownce lets you send little updates… just like Twitter. You can share links… just like Del.icio.us. You can share share events… just like Upcoming. So comparing Pownce to any of these services is understandable, I suppose. But I am reminded of the story of the blind men and the elephant. It seems that many of my own friends are displaying a disappointing lack of imagination by only comparing Pownce to what they already know.

The key feature of Pownce is the ability to share files. If you read the about page, the service is defined in a nutshell:

Pownce is a way to send stuff to your friends.

Stuff + friends. And like all the best apps, it was built to scratch an itch:

Pownce is brought to you by a bunch of geeks who were frustrated trying to send stuff from one cube to another.

If you want to compare it to anything, Dropsend feels like the closest competitor. Pownce is a pain-free way of sharing music, video and images amongst a discrete group of people.

And that’s the other key point: groups of people. It’s no coincidence that this app has support for groups built in from the start. The combination of file sharing with groups could potentially make it a killer app. It could be a social app like Twitter or whatever, but I think it could just as easily be a productivity app, more akin to something from 37 Signals.

Here’s an example: I’ve got everyone in the Clearleft office signed up. Each of us can have as many friends as we want but as long as we each have a Clearleft group, we can share files, links, events and notes with one another.

I’ve also created a Britpack group. If enough of my fellow Illuminati sign up, I can share stuff privately with them—something I can’t do on the mailing list because it quite rightly strips out attachments.

Another potential use would be for my band, Salter Cane. Emailing songs around is a royal pain. Being able to share MP3 files with an addressable but private URL could be really handy.

Far from being another Twitter or Jaiku, Pownce is a completely different part of the ecosystem of the social web.

I still plan to put public events on Upcoming and videos on YouTube, Viddler, Vimeo or wherever. But for that space between private and public, when I want to share something with a certain number of people, Pownce sure beats CCing a bunch of email addresses.

There’s another unspoken advantage that Pownce has over other social uploading sites like YouTube. If you’re sharing a file that might be slightly bending the law around license agreements or copyright, the ability to restrict the circulation could save everyone a lot of hassle. What the RIAA and MPAA don’t know won’t hurt ‘em.

The utility of Pownce isn’t the only reason I like it. It’s also really nicely designed. I don’t just mean the visual design—which is lovely, thanks to Daniel. The interaction design is well thought-out.

This is a surprisingly full-featured app considering that just four people put it together. There was just one full-time programmer for the website: Leah Culver. In spite of that, the site has launched (still in Alpha) with a whole bunch of features. The notifications and privacy settings, for example, are really nicely done. There’s also a nice “friends of friends” feature to help you track down people you might know.

Oh, and it’s got one of the best 404 pages ever.

Under the hood, everything has been put together with Django with storage handled by Amazon’s Simple Storage Service. If you peek into the markup, you’ll also find a bunch of nice microformats.

There’s also a desktop app for the service. It’s built using AIR née Apollo. It’s pretty slick and frankly, seeing an independent product like this is going to be far more likely to convince me of the benefits of the platform than any product demo from Adobe.

There are whole bunch of other little things that I like about Pownce that add to its personality—like the gender options in the profile form or the ability to choose themes—but I’ll stop going on about it. The key thing is that I can see this service filling a need through the combination of groups + file sharing.

If you’ve tried Pownce and come away feeling that it’s just like Twitter, you’re doing it wrong.

Graphic Design and typography - Swiss Legacy » The italic poster

We may just have to get this italic poster for the Clearleft office.

Sunday, July 1st, 2007

Mashing up microformats

When I gave my somewhat pretentiously entitled talk at XTech—Microformats: The Nanotechnology of the Semantic Web—I stretched the whole nanotech metaphor to its limit. One of the things I talked about was . I was referring to the danger of there being a microformat for everything. As has been said many times, if in two or three years there are hundreds of microformats then we will have failed.

There’s a danger of grey goo from another quarter: the temptation to unnecessarily extend existing microformats. This is something that has come up a few times on the microformats-discuss list. I believe that this temptation can be battled using the same prophylactic that protects the web from an over-infestation of microformats… The Process (cue dramatic music).

The first question to answer is whether or not there is a real problem to be solved. Remember that microformats operate on so if I proposed extension doesn’t apply to around 80% of use cases and requires more than 20% extra effort, then the price is too high.

The next step in the process is to look at whether an existing format already solves the problem. In my experience, this is the point at which the call for potential extensions can be resolved by casting the microformat net a little wider.

Here’s a recent example that came up on the mailing list…

Why not extend to add a “date of death” field?

Now, first of all, I don’t think that this is a common use case but let’s set that aside for the moment and concentrate on whether it makes sense to add a new field to the hCard spec.

hCard is a one-to-one mapping of vcard to HTML and vcard doesn’t have a “died” field. There is, however, a bday for date of birth. So it doesn’t seem unreasonable to ask for a corresponding field for date of death. Here, for example, is the hCard for an historical figure that encodes a birth date but there’s no way of encoding the date of death:

<p class="vcard">
<span class="fn">Robert Hooke</span>
was born on
<abbr title="1635-07-18" class="bday">
July 18, 1635
</abbr>
and died on
March 3, 1703.
</p>

As it turns out, this is unnecessary. There’s already a format for encoding start and end dates. That format is . If you reconsider a person’s life as an event, then you can encode birth and death:

<p class="vevent">
<span class="summary">Robert Hooke</span>
was born on
<abbr title="1635-07-18" class="dtstart">
July 18, 1635
</abbr>
and died on
<abbr title="1703-03-03" class="dtend">
March 3, 1703
</abbr>.
</p>

Now you’ve successfully encoded the event data but you aren’t explicitly marking this up as being a person.

One of the design principles of microformats is that they can be embedded within one another. So there is no reason why you can’t combine a person with an event like this:

<p class="vcard vevent">
<span class="fn summary">Robert Hooke</span>
was born on
<abbr title="1635-07-18" class="dtstart bday">
July 18, 1635
</abbr>
and died on
<abbr title="1703-03-03" class="dtend">
March 3, 1703
</abbr>.
</p>

Et voila! Now you’ve encoded the date of the person’s death without unnecessarily extending hCard.

The trick is not to get too fixated on using a single format. Use the right tool for the job.

It’s kind of like the situation with front-end development. There are three separate technologies, each one with its own purpose:

  1. HTML for structure.
  2. CSS for presentation.
  3. DOM Scripting for behaviour.

Here too there’s a danger of trying to overextend a technology beyond its purpose. Hence the call for “CSS-only” fly-out menus and JavaScript that generates page content.

Thinking about it, the existence of a bday field in hCard is kind of like the :hover pseudo-class in CSS. Putting event data into a format for contact details is as slippery a slope as putting behavioural controls into presentation.

As soon as you stop fixating on trying to encode everything in one single format then a whole world of possibilities opens up with microformats simply by embedding them within one another. The proposed format is an amalgam of existing microformats: skills marked up with , previous jobs marked up with hCalendar, and so on.

Likewise there’s been a call for a genealogy microformat. But I think that the information required for a family tree—at least for the 80/20 situation—can be handled with a combination of existing microformats:

  • hCard for people,
  • hCalendar for lifespans and
  • for relationships.

I really enjoy coming up with unexpected combinations of microformats. It’s as if the semantic information is increased exponentially.

Staying with the hCard/hCalendar example above, suppose I used Robert Hooke’s Wikipedia entry as the url field:

<p class="vcard vevent">
<a class="fn url summary"
href="http://en.wikipedia.org/wiki/Robert_Hooke">
Robert Hooke
</a>
was born on
<abbr title="1635-07-18" class="dtstart bday">
July 18, 1635
</abbr>
and died on
<abbr title="1703-03-03" class="dtend">
March 3, 1703
</abbr>.
</p>

Because of Wikipedia’s tag-space URLs, I could tag the current document with “Robert Hooke” by adding rel-tag:

<p class="vcard vevent">
<a class="fn url summary" rel="tag"
href="http://en.wikipedia.org/wiki/Robert_Hooke">
Robert Hooke
</a>
was born on
<abbr title="1635-07-18" class="dtstart bday">
July 18, 1635
</abbr>
and died on
<abbr title="1703-03-03" class="dtend">
March 3, 1703
</abbr>.
</p>

And seeing as I greatly admire Robert Hooke I can also encode his relationshipto me as “muse”:

<p class="vcard vevent">
<a class="fn url summary" rel="tag muse"
href="http://en.wikipedia.org/wiki/Robert_Hooke">
Robert Hooke
</a>
was born on
<abbr title="1635-07-18" class="dtstart bday">
July 18, 1635
</abbr>
and died on
<abbr title="1703-03-03" class="dtend">
March 3, 1703
</abbr>.
</p>

hCard, hCalendar, rel-tag and XFN all together in a single sentence. Microformats are interesting enough on their own but they get really powerful when you mash them up together.

Brighton R0x0r

I moved to Brighton almost seven years ago now. It’s funny, I still think of myself as a newcomer but I guess if you can remember the West Pier before it burned down, you can consider yourself a local.

Brighton has always had a great web/tech scene. While there’s no one big employer in the town, there are lots and lots of small agencies and freelancers. Rather than seeing one another as rivals, there’s a nice spirit of cooperation between all these geeks (helped in no small part by the Brighton New Media mailing list).

Lately, I’ve had the feeling that the scene has, if anything, improved. There are definitely more geek-related activities going on in Brighton. In fact, I’d say that on any given night of the week, Brighton would give London a run for its money.

Some friends of mine have put together a new site called Sussex Digital to aggregate all the geek-related activity into one place.

Sussex Digital - focusing on the Sussex digital community

Scanning down the list of regular events reveals just how much is going on:

Recently I attended a Geek Wine Thing. On the same night there was a Flash Brighton meetup and an Agile Forum. I am, quite literally, spoiled for choice.

If you live in Brighton, be sure to check out the Sussex Digital website and subscribe to the events calendar. You can also get updates via Twitter.

I love the fact that Sussex Digital is a grassroots effort made by a couple of enthusiastic guys… that would be Josh and Dave then.

The End of the Internet

I did it! I did it! I knew all that surfing would finally pay off.