Tables are a means of organizing content into rows and columns, often – but not always – in a grid-based layout where columns and rows have distinct relationships.

learn more… | top users | synonyms (1)

3
votes
3answers
363 views

Displaying a large number of tables

We're designing a search feature which returns results from many different tables. The user searches for something and the application returns all the tables answering the search query. The user ...
4
votes
4answers
308 views

Long tables and graphs on one page: how to share space?

We have a site with one page that has a big table, that we also want to add some graphs to. The table could quite easily fill up the whole page, both in terms of width and height, so the question is: ...
5
votes
2answers
246 views

How to layout buttons/bars alongside a dynamically sized table?

I have a table of data with a dynamic number of rows. It could have none, one, or a hundreds. The width is fixed across the web page and it has a fixed number of columns: 9. Along with this I ...
3
votes
1answer
947 views

Responsive Pricing Table

I am designing a simple Landing Page which has 2 lines about the product and the Pricing Table. I want to Make a Responsive Layout for Mobile. Not sure which is the best way to display the Pricing ...
3
votes
4answers
286 views

Display temporary action in table

I have a table with a bunch of data in it that needs to be reviewed by a manager. The requirement is when they review a line of data (ie, a customer order), they can click something to indicate ...
5
votes
2answers
6k views

What is the standard on displaying wide tables on mobile devices?

We need to display wide tables (10+ columns) on our new mobile website. Is the standard to: Scroll Horizontally without any indication that the visitor can scroll to the right (like Google Docs) ...
1
vote
3answers
221 views

In a sortable table, should sorting by a column of identical values result in any change in ordering?

Lets say we have a sortable table like this: download bmml source – Wireframes created with Balsamiq Mockups It seems obvious that if I click on "Employee", that the table should reorder ...
2
votes
3answers
562 views

how to provide a good user experience for drilldown/click on a grid to external divs

My interface has a table (a nice, sortable table with 3 or 4 columns), which represents the summary of some data. Each row represents an important piece of data. At the moment if users click on a row ...
0
votes
1answer
113 views

Presenting comparable data series with varying frequency

I've a data design challenge that requires the presentation of data where the data is comparable (can be plotted or presented as a table) but who's data points are inconsistent. Inconsistency occurs ...
7
votes
3answers
330 views

Identifying multiple sort criteria

I have a table view with some data and I'm allowing users to sort on multiple columns. I wonder what are the options for indicating sorting precedence? The obvious is to display a number right ...
2
votes
1answer
275 views

Long content in Tables

What is the best way maximize readability when displaying variations of long/short text within table?
5
votes
2answers
2k views

Mouseover to reveal more data in a table

I have a table containing users like so: download bmml source – Wireframes created with Balsamiq Mockups In the system, users can associate multiple emails with their account. When the ...
1
vote
1answer
207 views

How can I design a UI for iOS with a diamond shaped drill down interface?

I have a basic drill down interface for iOS devices. A -> B -> C -> D The problem is that the following interface would work equally well: A -> C -> B -> D What I need is some kind of diamond ...
2
votes
1answer
493 views

How to accept multiple types of input to a table cell?

I have a problem with a column in a table in which the cells may receive data in multiple ways: You may write a number, say 1.0. If you write you can only write numbers. Place an object in the cell, ...
2
votes
2answers
447 views

How to display wide table on the report

I have two datasets with 50 columns and 1-100 rows. I need to display comparison of these two datasets in a report (standard letter). So, say my first dataset is as follows: Name Price Qty ...
5
votes
3answers
531 views

Defining relationships between many users in one UI?

We have a UI on a web-page, where relationships between users can be defined by admins. Users are divided to two roles, in this case "Lorem" and "Lorem ipsum". Right now a relationship between ...
2
votes
3answers
307 views

Interface Question for Showing Tabular Data?

I am writing a report generating system where result is shown in a tabular data. The Result appear in a table with information like Hierarchy | Title | created | updated | Available |Accessed | ...
4
votes
3answers
445 views

Option for switching between a table or a list view necessary?

I have noticed that a lot of web sites that contains product category pages give the user an option to toggle between a list view and a table view of their products. Usually the only difference ...
7
votes
2answers
950 views

What do UX guidelines say about dropdown boxes in table cells?

download bmml source – Wireframes created with Balsamiq Mockups I have been trying to look at Apple Interface Guidelines and Windows UX guidelines about what standard behavior for drop ...
6
votes
2answers
1k views

Best way to do 'bulk edits' on a table

I am building a web application for managing a list of products (using jqgrid). I need my users to be able to perform several 'bulk actions' on whichever products they select. I have copied Gmail ...
12
votes
7answers
829 views

How to make it obvious the contents of one table are based on the selected row of another?

Given a dialog with two grid-style tables, what's the best approach to visually showing that the selected row of the left table is what populates the right table? The best I can think of is an arrow ...
9
votes
4answers
455 views

Is moving columns in a tree table automatically bad for UX?

I have a tree table that allows the user to group columns arbitrarily. Is it bad UX for me to move the grouped by columns to the front of the table right next to the tree controls? Would it be more ...
2
votes
3answers
255 views

Min. opt. and max. value of a small field

I've a three digit input field which has a predefined upper and a lower bound, all within a table. The field also has an optimal (requested) value. So there is a min. an opt. and a max. What is a ...
7
votes
2answers
430 views

When is a table the proper way to present data?

UPDATE: added mockups We are in the process of designing a web application interface for administering an online store. In such an interface there are pages for managing products, orders, customers, ...
5
votes
1answer
318 views

Interface design for managing overlapping date periods

I am trying to design an interface to manage which team a person belongs to at any point. I would like it to be really easy to make small changes (e.g. fix a start date for a previous team ...
2
votes
5answers
1k views

What is the best way to hint that a table cell is editable?

I have a table with data, with several columns. This is a table used mostly for reading, with the possibility for a user to occasionally adjust some values. Most columns are informative only, and some ...
3
votes
3answers
801 views

Best way to show and sort by dates when the item may be repeating/recurring?

Currently this website has a list of FooBars, which may be sorted by date: I am adding functionality to allow a FooBar to be repeated, or a recurring FooBar e.g. Weekly on Mondays and Tuesdays ...
8
votes
3answers
8k views

Best way to display more table columns than I have room for? [duplicate]

The web development office I work for is working on a fixed-width web site. On one page, we have a table inside of the fixed 960px space available. So far, this table has worked out great for us, but ...
0
votes
1answer
271 views

Diagonal Scrolling rationale [closed]

I m trying to find rationale for implementation of horizontal scrolling on a mobile web browser for a table. The following are the one's I could think of, if you have any other rationale in mind or ...
3
votes
1answer
320 views

What is the most intuitive way to force users to enter certain cells first in the new row of a data grid?

It was suggested that I post to this site the first half of a question I posted on StackOverflow. Paraphrased… I have a data grid (in my situation, Microsoft's .NET platform using WPF) wherein I ...
1
vote
3answers
596 views

Data table multi value column

I have a table containing incoming invoices. I have to show additional information about the sender of the invoice. So I figured out that I can nest Sender name and his Tax ID in one row with quite ...
6
votes
1answer
876 views

empty cells in accessible html tables

For an html data table in which each row represents an item (such as an email) would screen-reader users prefer empty table cells to be empty or to have a placeholder like a dash? In my brief ...
0
votes
6answers
366 views

Appropriate icon for: Activate [closed]

In an application were developing there is a window containing a table holding 2-5 rows. A metaphor for the context could be that the table identifies a gearbox of a car and each row is a gear in the ...
3
votes
1answer
249 views

What's a good pattern for edit in place with hyperlinks?

I have a datagrid with many columns that I want to be able to edit in place. Some of the values in the table are hyperlinks. I want to be able to follow the hyperlinks and also edit them. The row ...
0
votes
1answer
125 views

Clearly show count and amount in the same table cell

What would be a clear presentation of something that the user counts and values at the same cell? for example, on a users table I want to show how many accounts and its total worth: | User | ...
3
votes
1answer
220 views

Specifying default sort

I want to add the ability to specify a default sort to this interface. Currently it allows users to specify the order of the columns display and the default size. I am revamping it into a table form ...
1
vote
2answers
829 views

What's an alternative to data tables for key/value pairs?

I have a list of 8 key/value pairs I'm displaying in a sidebar using a table element. I'm using a th and td element on each row. However, the td content is often too long and has to be truncated. I ...
1
vote
3answers
354 views

How to provide keyboard navigation in editable table that includes drop downs?

I'm designing a business application. When the user enters the main data entity in the application part of the form is tabular. Since some of the users will have an intensive usage of this ...
5
votes
2answers
1k views

Better ways to display/interact with tabular data

Let's say for an example you display a list of category records or any type of records for that matter in a web page. Is there better ways of showing that list of records other than in a table? Or are ...
7
votes
2answers
3k views

Column header alignment

What is the best practice to have a column header alignment, should it be left or center aligned? On click of the column header the columns can be also sorted. Numeric values will be right aligned by ...
3
votes
1answer
885 views

HTML table cell wrapping issue

One of the problems in a tabular representation of data, is text wrapping inside cells. There are some options available, like: Fixing the width of the columns, and enlarging the rows height to ...
2
votes
1answer
193 views

Ideas on displaying and editing 'Hours of Operation' for a service provider

OK--you've got a translator in Bolivia, and you need to know when she can provide her transportation services. And you need to store this in a system, for others to see and possibly edit. My ...
8
votes
4answers
2k views

How to present heavy data tables on smartphones?

Problem: I've got a table with 10 columns and ~100 rows. What is the best way to present these on small screens? My idea: effective search + data displayed row-by-row. Is there any better solution?
3
votes
4answers
629 views

What is a good field separator that can coexist with colons?

I am currently migrating a bunch of data from several Excel files of similar formats into a more structured format. Imagine Tabular data like this in File 1: Customer | Cabinet : Device : Port | ...
6
votes
3answers
3k views

Examples of nice looking html tables [closed]

All tables on my app look like sh*t, it's making me lose hair, I've been trying to make them look better but I end up making them look worse, do you have any examples of nice looking tables? ...
6
votes
2answers
409 views

Summary Rows and Paged Data Tables

In terms of best practices and UI patterns: if there is a summary row (sums, avg, etc) at the bottom of a data table that has paging should the row be a grand summary of the full result set or a ...
4
votes
3answers
229 views

Quickly change row status

I have a table of items that each have a particular status color icon. The users will need a quick method to change this status. I imagine click on the status icon an picking the new status. However, ...
0
votes
1answer
132 views

Should I save changes to visible columns automatically, or require a 'save' option?

I have a page in a web app that displays a large amount of tabular data regarding certain resources. With this release, in addition to standard columns, there can be an arbitrary number of ...
8
votes
4answers
1k views

How to correctly encode a leaderboard with a gap in HTML

I want to display a leaderboard like so: 1 - John 232342 2 - Mary 45234 3 - Luke 234 59 - You 45 It's an ordered list but I can't make an ordered list that jumps from 3 to an arbitrary ...
0
votes
1answer
142 views

Setting a giant grid of numbers on a mobile touchscreen device?

I'm trying to figure out a good way to present 96 configurable percentage values to mobile users. These percentages represent percents of a max lift (weightlifting), and they can be broken down by ...