Tag Info

Hot answers tagged

16

I made a demo solution with CSS3. The Salary column is in ascending sorted status and the Bonus column is in descending one. I commit the work to github at horiontal-tight-table-sorter-css3. You can have a quick review of the html page here htmlpreview horiontal-tight-table-sorter-css3. For the sake of the demo, I only tested it on Chrome. Hope this ...


5

A possible solution would be to show where the row landed by scrolling the entire table up or down after the edit is complete, then showing a highlight around the position of the new location. Nothing that would last very long, just enough time that the user can locate where it went. This would require some animation and scroll hijacking, but I like the use ...


4

Try something like this. Keep the horizontal positioning of the column labels the same and add sorting horizontally on top but in smaller font using some noticeable color. If possible, make the whole div (or table cell) having that column label clickable and sort icons clickable.


2

Ordering this content by when it was last edited or updated seems like a rather confusing approach, especially given that users bring a typical news streams and calendar timelines paradigm with them. If not confusing to the user, this would be rather frustrating and require users to learn a different approach to your timeline only. I tried to come up with ...


2

Here's an idea on how to make column A and B look sortable (buttons, pushable). Column C is in a disabled state, meaning interaction isn't possible. You really want to avoid forcing the user to have to roll over the headers to discover which ones that can be sorted and which ones that can't.


1

Your question: What are the cases where one would use this type of filter and how effective is it? Is something you answered previously: [When you can] assume the user knows what the first letter of the item is. Context-wise, I think your two examples are likely the most applicable uses: dictionaries and address books. iOS7's address book, for ...


1

Option 2 looks more intuitive because : it does not introduce a new element like the arrow, the meaning of which might not be obvious to your users and does not force you to suddenly move the item title horizontally and therefore create discomfort during the process by. To build upon it and have your users understand that their action is going to affect ...


1

This was meant to be a comment on Hynes (who I want to give my support) but it became too long: Splitting them up makes a lot of sense. The News section is a feed while the Events section is more of a time table. Mixing them would lead to a non-intuitive plus a some other usability issues. For instance, when it comes to items like upcoming events, they ...


1

You could account for the possibility of the arrow by reserving space in each item. This would keep the column widths the same (arrow or not), and allow for the arrow and text to be horizontal. Reserved space indicated in red.


1

You could considder if using the background of the header cell would work. Something like this perhaps? download bmml source – Wireframes created with Balsamiq Mockups This is of course just a very rough sketch, any graphics guy should be able to make something subtle and pretty...


1

I don't know exactly how the workflow looks here (e.g. what happens next) but I assume you don't have an "apply"-button used for the sorting to take effect. Never the less, this can be seen as a 2-dimensional sorting and the least elegant thing about this could be the duplicate sorting parameters (e.g. NAME (A-Z) NAME (Z-A)). If you have a clear picture ...


1

It all depends on the goal of your website. What is it? As I understand this is portfolio/services website, thus the goal is to sell your services. Why Services are separate from Info? Why do you need Read More button? if you don't know what it's for how can anyone tell you? I believe entice your audience by your services and if they want to find out ...


1

The order of the information should be set by what you want the user to do. For new users the offerings of the site should be first. For returning users put the account at the end. In lists in general the first two and last items carry the most weight! The name of sections are also important. Avoid generic titles like 'info' or 'details' as these wont' ...


1

A few options: Forgo labels and use an up and down arrow to toggle the list. This visual metaphor is used a lot when toggle the sort order for tables. Remove the toggle altogether and change your initial "sort" text to "Sort by Newest" instead of "Sort by Date" and then presenting two new buttons. An example: Use Newer to Older. The Most/Least Recent ...


1

I don't think there's anything inherently wrong with Newest or Oldest, but here are some suggestions for both button names: download bmml source – Wireframes created with Balsamiq Mockups


1

Without knowing what kind of products you are selling, it's my opinion that you don't need to have both Newest to Oldest or Oldest to Newest, just have Sort by Date or even New where you default to showing the newest products first.


1

If indicating sort direction without utilizing more horizontal space is a requirement, your main option is to utilize more vertical space to display sort direction. Other things you may wish to consider, however: Analyze your columns and only show the most important/relevant sections. You may wish to remove certain items from the main table view to gain ...


1

I'd suggest using the 4th option. It is the most direct way to do the sorting, without any extra fields or radio buttons. It is the result columns that define the fields sorting is based on, after all. This approach is the most used option, as well, AFAIK. To tackle the "technical difficulties", one could use client side sorting (no round-trips to server), ...



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