I'm Darren. A designer, sometime developer, and inveterate traveller. Let's go exploring!

Willkommen!

CSS drop-down menus: how to keep the top level selected when hovering over a sub-menu

In Code

Pure CSS-based drop-down menus are a great thing, if for no other reason than their sheer simplicity and flexibility. However, they have two main drawbacks.

  1. They don’t work in Internet Explorer 6 due to the browser’s poor support for the :hover pseudo-class.
  2. When the mouse cursor is over a drop-down, the top level navigation item does not stay highlighted under most conditions.

Fortunately, both problems can be solved with some simple JavaScript. The first problem is easily corrected with the excellent Son of SuckerFish drop-down code. The second problem can be solved using the equally small amount of code described below.

Read more

Five Lessons from the Success of the Nintendo Wii

In Journal

Humanizing Gaming - The Nintendo WiiAlthough I have never been a big fan of console gaming, it has nonetheless been interesting to watch the latest crop of consoles come to market. What really struck me is, even though I don’t intend to buy any of these consoles, I found myself hoping the Nintendo’s Wii would be the big winner. It is certainly not the most powerful, I’ve heard griping about the graphics and the better reviewed games are generally not in genres that interest me. Yet, despite this, I wanted the plucky little upstart to be win the day over the leviathan Sony and Microsoft’s entrants.

Why? Probably because it seems the most “human” of the three. I could easily imagine Nintendo developers actually having fun designing and testing the system. At Sony and Microsoft I could imagine, at best, nameless engineers spending long hours wringing one more frame per second out of the hardware – heat/power-consumption/cost/gameplay be damned.

For this reason, it was fascinating to read an extensive set of interviews with the system’s designers and developers, all on the Wii’s home page. It is an absorbing look into the creative process at one of the most clever companies out there.

Read more

Add icons to PDF, XLS, DOC file links, links to new windows and more…

In Code

Whenever linking on the web, it is important to let the user know exactly where the link leads, especially if opening a new window or the linked item requires a plug-in or external software. For example, if linking to a PDF a small icon can provide a good hint of where the link leads. Unfortunately, manually adding icons to every link through a site can be quite laborious. This is where JavaScript comes in. With few lines of simple code we can automatically add icons to every link on a page.

Read more

Tips for giving a good presentation

In Journal

Here are some key tips for giving a presentation (as shared with me by my manager at work). Some of these may seem obvious at first, but once you start pulling material together they are easy to ignore.

  • Main points are stronger when the audience can both hear and see it. This is especially true when you are talking about something abstract, such as a technical issue many people may not be familiar with.
  • It is important to first connect with the audience, to get them to understand why they should listen to you. Tell them what is in this for them but also begin with some interaction, asking them questions, getting their input.
  • A good rule of thumb is that, when speaking, you lose people every two minutes. So, it is important to come back and say, perhaps only implicitly, why this is important to them. This is especially true when they don’t know the subject or the relevance may not be clear.
  • Bring them back with, “and this is a lesson for all of us” for example.
  • Encourage participation, ask them for their ideas when you are finishing up. Invite them into the presentation, invoke their participation.

And, lastly:

  • If possible, test your presentation (if you are using Powerpoint/Keynote/etc) on the computer or broadcast system you will be using for the actual presentation. This is important, particularly for video conferences since some designs and colors may not show properly to all those connected (for example, yellow won’t show up).