[Sigia-l] Displaying tablular data on websites

[Pradyot Rai]

> I'm looking for some ideas about how to display tabular data when there
> is limited horizontal screen space on a web application.

This is an 'issue' with the web applications. I have faced this problem
before. We had tabular data, with pagination and multi column, with
various type - some of the columns had really long product names or
'descriptions' kind of data... At times the number of columns ranged from
anywhere 4 to 13 coulmns. This was surely unmanageable on one screen,
without expense of the interface look and feel. So this is what I had done
-

1. Nested the data table in an IFrame

2. Irrespective of the number of columns, we presented with default number
of columns (with control to user setting to over ride/redefine them), with
the option that user can expand the columns anytime from the menus (by
checking out what all columns he want to view).

3. We truncated the long strings with three dots (...) at times and showed
the complete data either as ‘Alt txt’ or by fully expanding it with users
controls.

4. Created feature to allow user to personalize his ‘table views’ - which
used to allow him to view the table he wants to view/hide at any moment.

5. To view the whole data table more meaning fully provided features such
as - ‘export to MS Excel’, ‘Pop-up in new window’ and ‘export to Print’
options.

This was a lot of work and we spend lot of time on fixing usability issues
arround every feature. However, this wasn't perfect either, but it worked
better than the first realease we had. Some of the good things we achieved
were -

1. The horizontal Scroll was within the page (in IFrame), it still may be
ugly, but can be handled with little visual design and not break the
overall content to go haywire with the H-scroll. Istead of 'IFrames' you
can also use 'DIV', 'layers' depending on what browsers you are targeting.

2. Most of the targeted users were used to work mostly with ‘MS Excel’
kind of tools for analysis. Features such as ‘Export to Excel’ was really
‘cool’ stuff for them.

3. If user wanted to she things fully expanded, at the expense of the UI
layout, he could do that easily too.

Some loose ends were as follows -

1. Aligning the data table exactly with the header was tricky.

2. With ‘Export to Excel’ feature, user also demanded, ‘import from Excel’
file. Which we couldn’t figure out and was very costly.

I hope you will analyze it, make corrections and will also let me know how
did you solve your problem.

Pradyot Rai
eBusiness, Fannie Mae
Washington, DC 20016-2892
office. 202 752 1855
Cell.   240 472 0432
Fax.    202 752 7501