After going through a few template revisions of a web application we’ve been developing, I became stuck. I just couldn’t get the interface to look like it was supposed to be used the way it was intended. The issue was that the interface was a set of tabs, each containing form fields, organized by columns. The challenge was to make the interface, which was basically a spreadsheet, to feel not so spreadsheet-like.

The ‘Ah-ha!’ moment came when I realized what it was we were really trying to achieve with the interface, on a very basic level. We were organizing tabular data, so the solution really became quite obvious. Instead of ‘divs’ and ’spans’, organize the interface using ‘tables’.

What had kept me from realizing this initially is that using tables for page layout is typically frowned upon, as it allows the presentation and content layers of code to become easily ensnarled. However, as I thought the problem through, it really began to make sense to use tables to organize the interface. Implementing this idea over our interface brought its own set of challenges, but the application definitly began to take shape and gain a more consistent app-like feel throughout.

It’s something that, as developers, we should do once in a while. Take a step back, and try and see things the way they are trying to show themselves. We can then easily match the right element to the right job.

This entry was posted on Wednesday, October 18th, 2006 at 10:00 am and is filed under Deep Thoughts, Usability, Technology, Development. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.