Comments on: Coding Calendars For The Web

By: John Fredrickson

John Fredrickson — Tue, 09 Jun 2009 14:14:15 +0000

It makes zero sense to mark up a calendar as a table. Tables are for tabular data, and a calendar is only tabular in it’s display. On the code level, tables are actually lists of data and should probably be marked up as an ordered list, if you want to be really picky.

By: The Design O'Blog

The Design O'Blog — Sun, 31 May 2009 16:14:02 +0000

[...] few weeks ago I wrote a tutorial explaining how I coded a calendar for a client project at my day job (Brunello Creative). After some comments from readers I realized [...]

By: Arbenting's Weekly Inspiration and Best of the Web #6 | Arbenting

Arbenting's Weekly Inspiration and Best of the Web #6 | Arbenting — Sun, 24 May 2009 22:49:07 +0000

[...] Coding Calendars For The Web – Calendars are such an everyday object for most people – they are literally everywhere, in print, on our cell phones, computers and on the web. I recently had to design and code a calendar at work and learned a few things along the way. I thought I would show you guys my work process and share some code with you. [...]

By: CreativeNotice

CreativeNotice — Thu, 21 May 2009 15:44:08 +0000

This is a great head start for me, thanks. I can see this really taking off with some jQuery goodness.

My first thought was also to use a table, but I wonder if some very cool animations couldn’t be cooked up using the divs, like sliding the days into the calendar with some easing, etc. Can’t do that with a table.

Also, it’s possible to stile layers as table elements, wonder how that would play with screen readers? Anyone have insight into that?

Great job Nikki!

By: d2m.ca

d2m.ca — Thu, 21 May 2009 05:59:40 +0000

Hahaha

This is sick. I love the presentation!!

Thanks

By: Daniel [HiddenCSS]

Daniel [HiddenCSS] — Wed, 20 May 2009 15:01:52 +0000

DUDE! Thats pretty cool. Now I just need an excuse to use it!

By: Catherine Cantieri, Sorted

Catherine Cantieri, Sorted — Tue, 19 May 2009 14:08:10 +0000

I’m impressed. Great work, and elegant, too!

By: matt

matt — Tue, 19 May 2009 11:34:54 +0000

Niki,

Nice! I like it. The only concern I have though is an accessibility thing: This would seem to be an excellent candidate for a TABLE (as Jack mentions in comment 3). That would allow your calendar to be awesome and accessible to more users!

In fact, there seems to be a dearth of good TABLE based calendars on the web. Maybe you could bring your CSS to bear on a TABLE based design?

By: Tracey Grady

Tracey Grady — Tue, 19 May 2009 10:23:26 +0000

Thanks Niki, this will save me some time when the next project with a calendar crops up. To everyone who has contributed useful additions in the comments, thanks as well.

By: Sebastian Steinmann

Sebastian Steinmann — Tue, 19 May 2009 05:35:38 +0000

Nice work putting a block-element inside a inline element tho :p

I would move that a inside the h3.

Also, you should add a state for the day to be in the past. Done with sprites ofcource.

You can see the problems of not using it by checking your example.
Takes a second before the hover image is shown.

Nice simple example tho!