Journal tags: calendar

8

Adfonting

It’s the start of the Christmas season. I know it’s the start of the Christmas season, not just because Brighton is currently blanketed in snow, but also because 24 Ways—the advent calendar for geeks—has kicked off with its first article. Hurray! And this year, all of the articles will be available as a book from Five Simple Steps for a mere £8, with all the proceeds going to charity. Grab a copy before the end of December because this is a time-limited offer.

This year, 24 Ways isn’t the only advent calendar for geeks. While I was off galavanting up and down the west coast of the US last month, my cohorts at Clearleft were scheming up a little something special: an advent calendar for fonts. Every day, for 24 days, release a Fontdeck font for one year’s free use.

When they told me, I thought “great idea!” …then they told me they were going to call it an “adfont” calendar and there was much groaning and gnashing of teeth.

The Adfont Calendar 2010 (groan) is now live.

The lovely visual design comes courtesy of Michelle, the latest addition to the Clearleft team, and it mimics a type case; just like the one we happen to have in the office. Every office needs a type case.

Originally, the interface was going to be one looooong type case with some JavaScript layered on top to allow smooth horizontal navigation. But when Rich asked me for some advice on implementing it, I steered him down a different path. Instead of displaying everything horizontally, why not use media queries to show just enough drawers to fit the user’s browser window and allow the rest to stack vertically?

I didn’t think he’d take my challenge seriously but he’s only gone and bloody done it!

Adfont Calendar — 480 Adfont Calendar — 960 Adfont Calendar — 1280 Adfont Calendar — 1680 Adfont Calendar — 2320

Have a poke around and see what’s behind drawer number one.

Open Tech schedule

I’ll be heading up to the University of London tomorrow for Open Tech 2008. The last Open Tech was in 2005 which was, by all accounts, a legendary affair—it led directly to the creation of the ORG.

I’ll be speaking about microformats, probably reworking some of the things I was talking about at XTech. It looks like there’ll be quite a lot of discussion around social networks, portability and privacy so I’m going to concentrate on XFN and hCard. Speaking of which, be sure to read Ben’s excellent article on Digital Web and then check out David’s superb implementation of the Social Graph API: what a productive pair of flatmates!

I put together an hCalendar schedule for Open Tech so if you’re going along, you might want to subscribe. I recommend subscribing over downloading as the schedule is likely to change. I’ll do my best to update the hCalendar document accordingly. Depending on the WiFi situation and how knackered I am after the early start from Brighton, I may try to do some liveblogging.

SG Foo Camp schedule

Thanks to my life-saving inflatable mattress, I managed to get a decent night’s sleep. A full day of sessions is about to kick off so I’m going to fortify myself with plenty of coffee.

But markup comes before coffee. I’ve copied down the schedule (as it currently stands) from the whiteboard and turned it into a nice portable hCalendar:

http://icanhaz.com/sgfoo

If you’re here, you might want to subscribe to the schedule and stick it on your phone (or any other device with a calendar).

Cascading calendars

I had fun styling the hCalendar markup for the Berlin Web 2.0 Expo schedule. I based the CSS on what I had written the table of errata for DOM Scripting (which uses del and ins to indicate changes—a nice little dab of ). For the conference schedule, I added a little flourish for standards-compliant browsers by highlighting headers and cells on the same row with these declarations:

table.vcalendar tbody td:hover,
table.vcalendar tbody td:focus {
 background-color: #ddd;
}
table.vcalendar tbody tr:hover th,
table.vcalendar tbody tr:focus th {
 background-color: #678;
}

Gareth asked if he could use the same CSS for some hCalendar schedules he marked up:

I’m more than happy to share my style sheets. In fact, Brian suggested the CSS could be released under a Creative Commons licence. So that’s what I’ve done.

This CSS file is licensed under a Creative Commons attribution licence. If you use Dmitry Baranovskiy’s conference schedule creator to generate an hCalendar table, this CSS should style it nicely.

Of course, you might decide to write your own CSS. In that case, please consider also sharing it under a similar licence. It would be nice to gather together a whole range of possible style sheets for hCalendar schedules and list them on the microformats wiki.

Berlin schedule

I’m off to Berlin tomorrow where I’ll spend the week immersed in the first European Web 2.0 Expo. I’m hoping that it won’t be the same mixed bag as the US counterpart: despite some good stuff, the lows were very low indeed.

I’ve been nominally serving on the board of advisors, helping to put together the design track. If nothing else, I passed along the names of Brian Suda, Mark Boulton and Jan Eric Hellbusch so the topics of microformats, typography and accessibility should be well covered. I’ll also be giving a couple of talks that I’ve already road-tested; Microformats: the Nanotechnology of the Semantic Web and The Beauty in Standards.

A full schedule is listed on the conference website but it’s marked up as a dead end. It always strikes me as a shame when someone goes to the bother of publishing event information without sprinkling the few extra class names needed to create an hCalender. Here’s a hint to any conference organisers out there: Dmitry Baranovskiy’s conference schedule creator is rather excellent. Brian and myself used it to output a nice hCalendar version of the expo schedule.

I’ve added some CSS and put the markup online. If you’re in Berlin and you want a quick glance at what’s on, here’s a suitably short URL:

icanhaz.com/berlin

From there you can download the schedule or better yet, subscribe to the schedule. That way, if there are any changes to the line-up, I’ll edit the HTML and you’ll get those changes reflected in your calendar.

Thinktanking

I’m sitting in on a Semantic Web Think Tank today which is conveniently happening right here in Brighton (in the same building as the new Clearleft office). I’m really enjoying it so far. I’m just taking some time out to blog this and demonstrate hCalendar at the same time.

Microformats gone wild

Microformats seem to be showing up in more and more places lately. Chris spotted hCards in the new .mac web client.

Just this week, Last.fm announced a raft of updates including an events section that uses, yes, you guessed it, hCalendar. I did much the same thing when I added events to The Session recently.

I had been eagerly awaiting the unveiling of events (and accompanying microformats) on Last.fm since having a chat with some of the developers at that Opera shindig. I really like the implementation. If you follow through to an individual event, you’ll see some clever use of CSS to auto-generate a gig poster. Nice!

It’ll be interesting to see some mashups of Last.fm with Upcoming. With every event tied to a location, there’s also plenty of room for doing some fun mapping stuff. It would be nice to have an API to access the event data, but having all the events marked up in hCalendar means that we can start playing around with the data anyway.

Thinking about it, gigs are just about the perfect piece of data to play with: there’s always a date and there’s always a geographical location. Surely somebody will build a concert Mapendar?

At the very least, I expect we’ll see a time/location Podbop-style channel on Last.fm before too long.

A tipping point for microformats

My spidey senses are tingling. Something has been happening in the last week or so. Microformats are getting noticed.

Until now, microformats were trapped in a chicken and egg situation. Few people wanted to publish microformatted content unless there were tools that would then make use of those formats. Meanwhile, the tool makers didn’t want to make applications to harness microformats until a critical mass of people were already publishing with those formats.

Technorati have broken that circular argument with the introduction of microformats search. It’s still in beta but already it’s started a new wave of interest in microformats. This is the killer app we’ve been waiting for.

I’ve been contacted by quite a few different people lately with questions about implementing hCard or hCalendar on their sites. The reason is pretty straightforward.

What’s the first thing you do when you’re presented with any new kind of search engine? That’s right… you ego surf. If your name isn’t returning any results from the Technorati kitchen then you’re going to want to do something about it.

So it may be ego, not altruism, that is driving the current push of increased microformat usage. Whatever the reason, I’m just glad to see more and more data being published in a format that I can take with me as part of my local infocloud.

It’s also a real time saver for the people providing the data. Publishing the same data in more than one format is a pain.

Michael Heilemann created an iCal schedule for Reboot 8. Jon Hicks has done the same for @media. All that effort wouldn’t have been necessary at all if the original schedules on the conference websites were marked up with a few extra class names.

Mind you, the @media site does have all the speakers marked up in hCard. You can use the wonderful Tails extension for Firefox to isolate the contact information or just point that page to Brian Suda’s vCard extractor on Technorati and you can instantly add all of those people to your address book.

I’ve been doing my bit for the microformats revolution over on The Session. There are hReviews in the Amazon-powered shop and there’s a brand new section that I launched a few days ago. The events page lists user-contributed details of upcoming concerts, festivals and workshops, all marked up in hCalendar. Right now it’s a handy way for someone to discover places to go for some fun in Ireland this Summer. In the future, I hope to build on the microformatted content to provide personalised information tailored to people’s location and schedule.

Like I said in my talk at Reboot:

Microformats are the nanotechnology for building a semantic web.

(By the way, there are a few microformats hidden in that article: I took a perverse pleasure in marking up the Renaissance with class="vevent").

Remember, the microformats community isn’t even a year old yet. This is just the beginning. I’m quite certain that we’ll see many more cool tools that harness microformats in the coming months.

Of course, we’ll probably also see the introduction of microformatted spam (hSpam? Ham?). That will be surest indication that a technology has really hit the big time: just look at what happened to email, blogs, comments and trackbacks.