Tag Info

Hot answers tagged

16

Headers are essentially metadata and you need some way to indicate that they are separate from your content, but related to it. I would recommend against lowercase and normal weight text as it will make that row visually similar to the rest of the content. Title case is the most common, though you might be able to use small caps or uppercase headers. ...


14

1. Headers serve a different purpose from content This seems like an obvious statement, but it animates the reason why table headers are emphasized (title case, bold, colored, underlined, etc). While the user ultimately needs to read the content of a table, the headers provide users with: A crucial entry point into the table (i.e. the starting point for ...


5

Hmmm take a look at this: https://github.com/filamentgroup/tablesaw As width is reduced, the table converts over into a listing. You do lose the ability to do row comparisons, but it does ensure data remains accessible for small screen sizes.


5

maybe is out of scope, but scanning a table to detect patrons is not very user-friendly. If resources are available, i would go with an horizontal stacked chart: It offers a better perspective of the percentage of time on each status, and is more easy to scan for out-of-patterns days.


5

Your current approach is heading in the right direction. When your users use this data regularly, they will already know the relationship between the groups. Switching background color is one way of creating contrast between groups. Other ways would be to use line separators and white space. One thing you can have do to make it more obvious is by ...


4

In my experience this is one of those places where shadow works great to show deeper layers. A slightly different font weight/color treatment would help as well.


4

Use grouping horizontal lines and eliminate the verticals one. Horizontal lines helps to lead the eye along the line, while vertical lines become a barrier along the eye path:


3

ISO 8601 Duration As mentioned in the answer by Crissov, the ISO 8601 standard defines a textual representation of a span of time in this format: PnYnMnDTnHnMnS, called Durations. In this format, the P marks the beginning. The T separates the days portion from the time (fractional day) portion, and is omitted for whole days. Examples: P1D = One whole ...


2

Place the error next to the field Tables often have many elements, so the easiest way to communicate an error in the table is to place the error message right next to the offending element, so that it's very clear to the user where in the table she should focus. For example:


2

Why grids Tabular data arrangement is a raw dump that expects the viewer to carry the full burden of analysis and interpretation. This makes sense when the software can’t be expected to anticipate how the user may choose to evaluate the information. Tables are good when: All data columns are of equal or unknown importance. Horizontal space is not ...


2

It is interesting to me that the problem with large multi-column tables is not being solved by creating better content and information architecture, because regardless of how responsive or accessible the table is the information is still going to be unusable to the reader if there is simply too much information. The question of how to fit a large amount of ...


2

I think this is a design question where the overall content and intent of the design needs to be assessed and understood first. By content I am referring to the actual differences between the plans (or tiers) that you are going to display. There would be very little point in showing the information in a table if all three tiers offered very similar ...


1

"The app is to display large numbers of defects a site contractor might log while working on a building project." Given this information, think about the workflow of who is using it. What are his/hers immediate goals? I am going to make an assumption that the person using this primarily wants to see a list of issues associated with each project. So give ...


1

Tables are soooo 90s (they are about to turn 30) HTML tables were proposed in 1993 and took off around 1996. During this time, few considered accessibility and even less predicted responsive design. UX was never considered in the process. This case isn't unique, there are many other HTML standards that nowadays look ludicrous - selects and radio groups all ...


1

I think you are already on the right track with your design. A tip I would add is to have the left pane shelve out when needed, but hide it when a user is scrolling the table. To answer your question: I would go with the table over the list. Lists have always seemed horrible for tabular data to me. Sorting them on the different data dimensions almost ...


1

I agree that it's an odd implementation. I would do the following: Always leave the edit box enabled and have it show the current value. If the user wants to override the value, they just have to click in the edit box and type. Change the Use Default checkbox to a Reset button. Clicking the button would set the value in the edit box to the default. ...


1

Actually, there's two questions in here, one regarding the master-detail navigation, the other regarding accordion vs. tabs. Master-detail can be realized on one screen, like here, or with a two-step navigation from the list to a complete screen of details. For me, the decision between these two relies on the following: How many detail is needed to ...


1

With error messages it's all about association. I don't have the experience with implementing it with tables, but I don't see why you can't apply the rules for forms to tables. For forms, it's best practice to show the error message directly below, above or next to the input field that contains the error. Assisting the error message with a red color (or ...



Only top voted, non community-wiki answers of a minimum length are eligible