idhana.com

Longdesc - Another look

Dhana — Wed, 13 Aug 2008 02:11:34 +0000

After coming up with a quick bit of code yesterday for the longdesc comment that Ruth left, I had another idea. I decided to try approaching the problem using the title attribute on images. Before getting knee deep in code, I decided to find out if the idea was valid by W3 standards. (more…)

Progressive enhancements with “longdesc”

Dhana — Tue, 12 Aug 2008 03:47:15 +0000

I just received this comment today by Ruth and when I read it, I thought, yeah, why not. “longdesc” as the name says provides a longer description to supplement the alt attribute of an image.

When I first thought about the problem, my first inclination was to provide a hidden div that held the long description which became visible whenever the image it corresponded to was interacted with. The solution seemed intriguing but I had another thought toying with me at the back of my mind. What if all these browser developers soon came up with a standard solution on dealing with longdesc (we can always hope, it keeps the world moving). Then my solution would be redundant. So, I decided to go the old route, that is by keeping the longdesc in, but providing progressive enhancements.

(more…)

Usability Testing with Children

Dhana — Tue, 15 Jul 2008 03:56:00 +0000

I had my first child usability testing today for a project I am currently working on. I chose paper prototyping for this phase as I wanted to figure out the issues with the interface before the programming team started working on it with all the holes in full glory.

All I needed - post-its, regular A4 paper, a pair of scissors and glue. For all the business savvy readers out there, here’s a cheap and quick way to test your interface. An added incentive, it’s incredibly easy to do and does not require a big ol’ testing laboratory like this.

For those of you who are not familiar with paper prototyping, here’s an article to get your feet wet.

(more…)

Firefox 3: My Selective Review

Dhana — Tue, 01 Jul 2008 06:45:27 +0000

14 days and counting - Firefox 3 has managed to surprise me on more than a few levels. When I first downloaded it, I assumed it was just going to be another of those updates you can hardly notice the changes that has taken place. Now, this is not a personal affront to those who work on making this enigmatic browser more secure than ever, but then as an interaction designer, I am usually more into how the browser works with users.
Let’s mention the inline search yet again. When I last mentioned the search capability, I was already in love with it since I never had to use my mouse even once to invoke the inline search.
(more…)

jStyler

Dhana — Sat, 09 Feb 2008 20:33:37 +0000

The first time you write a plugin, however simple it is, a sense of accomplishment takes over. It might last a couple hours, but those hours are precious as walking on the moon. As a person who recently got addicted to jQuery, the library has certainly lived up to its reputation in helping cutting lines of codes. Without further ado, here’s my first jQuery plugin – a stylesheet switcher.

This is a cookie based style switcher. Once a stylesheet is selected, it will use that stylesheet until the cookie is removed. Also note that Javascript is case sensitive. Make sure that the title attribute for the and the href has the same case. (more…)

Eliminating Excise in Software Design

Dhana — Fri, 04 Jan 2008 05:33:01 +0000

One of the biggest problems with softwares these days is the number of steps we need to perform to accomplish a simple task. More often than not, once we get used to doing the same thing over and over again, we arrive at the conclusion that the steps are unavoidable and plowing through them good naturedly might just make them seem more acceptable.

Excise is the extra work that satifies the needs of our tools or those of outside agents as we try to achieve our objectives. The problem with excise tasks is that the effort we expend in doing them doesn’t go directly towards accomplishing our goals.
Alan Cooper, Robert Reinmann & David Cronin

(more…)

Baby Steps Into Form Accessibility

Dhana — Wed, 19 Dec 2007 07:11:25 +0000

Making forms accessible isn’t something hard to do, but most times, it gets overlooked as developers pay more attention to parts that get noticed by users who can see visual changes. But then again, there are users out there who rely on assistive technologies and accessible forms help them tremendously in completing their tasks without unnecessary hitches.

Let’s look at a basic form below. Creating an accessible markup for it can be achieved with just a few steps. Assign a for attribute to the label element and match it with its form element using an id. Simple right?

   Message: *
   
   Email:

(more…)

What Say You About CSS Frameworks?

Dhana — Thu, 13 Dec 2007 05:21:24 +0000

There has been some talk recently about frameworks. Some for, some against and some on the fence. As someone who has not tried her hand at a single established framework, I have to say I am rather ambivalent about them. When I first read about the first CSS framework, my initial thoughts bordered on the negative. I was constantly arguing in my mind about the extra bloated code. Then my mind raced to the unsemantic code. And it went on and on …
(more…)

Focusing on Form Elements with jQuery

Dhana — Wed, 12 Dec 2007 06:43:58 +0000

There would be times you would want to offer your users an indication of the current form element they are on. A simple, non intrusive manner for this would be as simple as changing the background of the element using CSS. Users who are using their keyboard to move through the form elements would also benefit from this as it provides a more obvious cursor position.

Fortunately, there are several ways to get this effect. First, you just use CSS. By appending the :focus selector to your form element declaration in your CSS code, your work is done. Unfortunately, not all modern browsers comprehend :focus – especially not the big boys like IE. So, how shall we do it?
(more…)

CSS Graphs with Negative Axis

Dhana — Tue, 11 Dec 2007 06:30:55 +0000

A while back, while working on an intranet that displayed the amount of cash flow, we (design team) had to come up with a way to show data graphically. As the graphs we wanted were rather simple bar charts, we did not want to expend too much energy in researching extra tools in achieving this goal. With a little creative trick using absolute positioning, out came the bar chart with negative axis. Check out the code below to create the effect.
(more…)