Canberra web designImproving the User Interface
29 June 2007It's not hard making interfaces look professional. I've found that some good looking icons and a bit of cell padding makes all the difference.
Using the example below, we can apply small changes to the design which will improve usability and make this ugly interface look a lot better.
I've removed the table cellspacing which was cluttering up the design, and changed the date/time to a more readable format. Removing the boldness from the opened emails puts more emphasis on the new emails.
Removing the vertical table borders is a great way to open the table up, yet still provides a way for users to easy scan from left to right because we've left the horizontal borders in place.
Adding some more cellpadding and making the horizontal borders lighter makes the design cleaner and less cluttered. The font has been changed from Verdana to Arial which is slightly thinner and makes more space in the table cells.
The finished product. I've replaced all the icons with ones from famfamfam.com, and used a delete icon rather than a 'delete' link. There is now a light gradient behind the table header and some alternating row colors.
As you can see, it's not hard to improve the aesthetics of a table. You can apply these sort of changes to almost any part of an interface.
Kieran
Very nice article, I just saw this on dzone.com. That's definitely a link for the favourites.