it-swarm.com.de

Berichts-Web-App - Wie werden große Datentabellen entworfen?

Ich arbeite an einer älteren Webanwendung, die sich hauptsächlich auf die Berichterstattung über große Datenmengen konzentriert - dh Tabellen mit mehr als 20 Spalten, in denen Finanzdaten gemeldet werden. Das Hauptproblem ist die Inkonsistenz des Tabellenlayouts in Abhängigkeit von der Benutzerinteraktion und den Daten selbst. Beispielsweise ändert sich die Breite einer bestimmten Spalte abhängig davon, wie groß die Zahl/das Wort in der Zelle ist oder ob der Benutzer beschlossen hat, diese Spalte zu sortieren. Ein aufsteigender oder absteigender Pfeil in der Kopfzeile bringt die gesamte Spaltenbreite durcheinander. Der Benutzer erhält eine "nervöse" Tabelle, in der sich die Navigation bei jeder Aktion an einer anderen Stelle befindet.

Darüber hinaus handelt es sich um eine internationale App, bei der die Übersetzung auch die Breite der Spaltentitel in verschiedenen Sprachen durcheinander bringt.

Wir benötigen eine sehr kleine Mindestauflösung, aber die meisten unserer Tabellen sind etwa 1200 bis 1400 Pixel breit, um für alles zu passen.

Gibt es Richtlinien, wie Sie eine Business-Webanwendung effizient und vor allem so gestalten können, dass die Benutzerfreundlichkeit nicht beeinträchtigt wird?

8
eagerMoose

Was ich in einem ähnlichen Fall getan habe, ist die Verwendung von Tabellen mit einem fixed Layout (damit es nicht springt), und alle Informationen, die überlaufen, sind verborgen. Dann habe ich innerhalb des title- Tags den gesamten Inhalt platziert.

Ich bin mir nicht sicher, ob das auf Sie zutrifft, aber ich hatte viele Spalten, die eher klein waren, und eine begrenzte Anzahl von Spalten, die eine Beschreibung enthielten (so dass das Layout leicht wachsen und durcheinander geraten könnte). Also habe ich das feste Tabellenlayout verwendet.

Der Vorteil war, dass der Benutzer immer noch die sofortige Übersicht hatte und bei Bedarf auf die vollständigen Informationen zugreifen konnte (bewegen Sie den Mauszeiger einfach über das Element und der Titelinhalt wurde angezeigt).

[BEARBEITEN: Verstehen, dass das Einschränken der Spalten keine Option ist]

Ok, ich verstehe, dass es nicht möglich ist, die Spalten in irgendeiner Weise einzuschränken. In diesem Fall scheint mir das einzige Problem, das Sie jetzt haben, das Erscheinungsbild des sortierten Asc/Desc-Symbols und die verschiedenen Übersetzungen der Spaltenüberschrift zu sein.

Das erste ist relativ einfach zu lösen: Mit CSS fügen Sie eine Klasse hinzu, unabhängig davon, ob Ihre Spaltenüberschrift sorted_asc, sorted_desc Oder not_sorted Lautet, und in jeder Klasse schaffen Sie Platz für ein Symbol (welches im unsortierten Fall ist entweder nicht da oder ausgegraut oder so).

Das zweite: Wäre es eine Option, Abkürzungen zu verwenden? Ich würde mir vorstellen, dass es sich in der Finanzwelt um global gültige Abkürzungen handelt und der On-Hover den übersetzten Wert anzeigt. Wäre so etwas eine Option? Ich gehe davon aus, dass Sie die Übersetzungen nicht ausreichend kontrollieren, um sicherzustellen, dass sie alle gleich lang sind. Andernfalls könnte die Schriftgröße der Spaltenüberschrift wirklich klein sein?

Angenommen, der Spaltenüberschriftstext ist nicht so wichtig, könnten Sie diesen Überlauf zulassen?

2
nathanvda