Making Events Calendar more user-friendly

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

I'm rebuilding an old program of mine, and I'm hoping you guys can
help me make it a little more user friendly and efficient.

The program is a calendar of events for local happenings. Until now,
I've always just listed them in order, but since the site is very
popular locally, I'm getting a lot more events entered than I
originally intended so it's needing an update.

The design I'm using has the appearance of a real calendar, which is
nice and people are use to using programs like that. The problem,
though, is in fitting the titles of the events into such a small
space; especially on an 800x600 resolution. On 1024x768, I have a
width of 87px, and on 800x600 I only have 56px.

Here is the program:

This isn't officially live to the public yet, of course, so consider
it a work-in-progress.

The very first event that you see on April 3 is a good example of the
problem I'm having. The title of the event is "Changing Face of
Substance Abuse - Spring Conference," but without taking up multiple
rows, I only have enough room on a 1024x768 resolution to say
"Changing Face...". Even this abbreviated title takes up 2 rows on a
lower resolution. My original design did let it take up more rows, but
then on days like April 14 (with several events), the height became
ridiculously large in comparison to other rows, making it look odd.

Any advice on how to make this more legible? Keep in mind, the average
visitor to this site is not what you would call "tech savvy."

Also, what do you think of the way that you click on the title to open
a block with more information? I don't usually do layers like that,
but I'm trying to avoid making the program run on the server too much
(I've had issues with having enough traffic to slow the server
significantly, so I'm relying on Javascript and CSS more than I used



Re: Making Events Calendar more user-friendly

Jason wrote:
Quoted text here. Click to load it
I think the lack of hight on the event titles  makes them look a bit
Maybe try sizeing the calender in % or em units instead of PX (mind
you I did not look at your source code.)
I would personally just have a table of event dates and have the user
click on them, then just generate a list of events for that day.
I think it would look better and be easier to navigate (provideing the
lists were short.
Regards Chad.

Re: Making Events Calendar more user-friendly

Jason wrote:

Quoted text here. Click to load it

I've spent nearly half an hour searching for this link, so you should
thank me for this! :-) It's an article I read about 18 months ago about
usability of online calendars, and how it's a fool's errand to try to pack
them into a grid structure. It made a lot of sense to me, and it stuck
with me. Now I've bookmarked it in case I need it again.

Note the source: 37signals. They make web-based software and are *very*
good at usability. Try out something like and you'll see what
I mean.

Toby A Inkster BSc (Hons) ARCS
Contact Me ~
Geek of ~ HTML/SQL/Perl/PHP/Python*/Apache/Linux

* = I'm getting there!

Re: Making Events Calendar more user-friendly

Quoted text here. Click to load it

Toby, I can't thank you enough for the time you spent looking for this
article! ;-)

I rather wish it said something different, though, because I was fond
of the grid-style calendar, myself. But since I'm limited on space
(the right side of the page is mandatory, since these ads pay for the
site, and removing the left side navigation would be inconsistent with
the rest of the site), then maybe I should just abandon the idea

Chad, my current Calendar is exactly the way you described, but as
warm weather approaches it's going to become a pretty long list. All
of the non-profit fundraisers are posted, the Chamber of Commerce
sends things, etc, so it's not uncommon for this list to have 50, even
75 events listed. Granted, they're in chronological order, and once
something happens it's automatically archived, but it still becomes a
little overwhelming for the visitor.

You guys have given me a lot to think about, I appreciate that. Thanks


Re: Making Events Calendar more user-friendly

Jason wrote:
Quoted text here. Click to load it

You need more horizontal space devoted to the calendar. Get rid of the
left and right columns on this page. The horizontal navigation at the
top of the page is good enough here.


Site Timeline