Ich muss häufig tabellarische Daten anzeigen und möchte die ganze Magie. . . Spalten, Paginierung usw. sortieren Ich bevorzuge Spalten, bei denen Sie auf den Namen der Spalte klicken und die Sortierung für den Benutzer erfolgt (normalerweise mit Javascript, obwohl es schwieriger ist, wenn Sie auch Paginierung haben, weil Sie nur die Daten sortieren den Bildschirm oder sortieren Sie ihn nach dieser Spalte und setzen Sie sie dann wieder auf die erste Seite?) Aber wie zeige ich an, dass er sortiert wurde? Was ist ein guter UI-Hinweis dafür? Wie sollen die Spaltennamen aussehen? Ich mag es auch, jedes andere Ergebnis mit Grau zu färben, aber dann sehe ich jemanden mit einem Bildschirm, dessen Helligkeit zu hoch ist und der nicht grau genug ist, um die Zeilen unterscheiden zu können, aber wenn ich die Menge an Grau erhöhe, gibt es keine genug Kontrast, um den schwarzen Text bequem zu lesen.
Was sind einige Beispiele für Tabellen, die richtig gemacht wurden?
Traditionell wird "Sortieren nach" durch Aufwärts-/Abwärtspfeile angezeigt, die das Sortieren aufsteigend oder absteigend darstellen. Die Spaltennamen sollten einen höheren Kontrast aufweisen als die Werte, z. B. fetterer Text oder ein schattierter Hintergrund.
Persönlich werde ich beim Färben abwechselnder Zeilen normalerweise eher heller als dunkler, da der Effekt umso stärker wird, je länger Ihre Benutzer mit der Tabelle interagieren.
Hier einige gute Beispiele für Optionen für das Tabellenlayout: http://patterntap.com/tap/collection/tables
Ich habe derzeit keine unmittelbaren Beispiele für Sie, aber hier ist ein Beispiel für eine Tabelle, die ich für meine Web-App entworfen habe und die meinen obigen Ratschlägen/Vorlieben entspricht:
Schauen Sie sich aus rein visueller Sicht http://www.datatables.net/ (Plugin für jQuery) an. In der Beispieltabelle auf der Startseite sind die von Ihnen erwähnten Funktionen bereits implementiert.
Technisch gesehen hängt es davon ab, was Ihre Back-End-Technologie verwendet. Wenn Sie auf einem .NET-Server ausgeführt werden, können die in ASP 3.5 und 4 enthaltenen Steuerelemente) sehr einfach verwendet werden, wie Sie es beschreiben, ohne die Abhängigkeit von jQuery und Plug-In.
Schauen Sie sich ExtJS-Gitter an. http://dev.sencha.com/deploy/dev/examples/#sample-
Beste Benutzerinteraktion aller JS-Frameworks, die ich gesehen habe. Wir verlassen uns bei unserer Anwendung bei Marketo in hohem Maße darauf.
Wenn Sie ein Datagrid mit "all the magic" benötigen, versuchen Sie es mit dhtmlxGrid: http://www.dhtmlx.com/docs/products/dhtmlxGrid/index.shtml
Es ist eines der leistungsstärksten JavaScript-Raster, die ich je gesehen habe.
Wenn Sie in beide Richtungen sortieren möchten, gibt es den klassischen Pfeil nach oben/unten wie in Windows Explorer/Gnome Nautilus. Diese haben normalerweise eine dunklere Farbe als die Zelle.