Dynamische Tabellen und fixierte Filter
One Size fits none
Nicolai Goschin · August 2013 in Expertise
Was ist die optimale Breite für eine Tabelle? Die gibt es nicht. Tabellen mit vielen Spalten lassen sich visuell am besten erfassen, wenn jede Spalte eine gewisse Mindestbreite hat. Texte in schmalen Spalten brechen an vielen Stellen um und sind daher deutlich schlechter lesbar. Hat eine Tabelle aber nur wenige Spalten, erscheinen zu breite Spalten zerrissen und lassen sich optisch nur schwer erfassen.
Hinzu kommt die größte Unbekannte, der persönliche Geschmack. Jeder User hat seine speziellen Vorlieben, was die Aufbereitung von Informationen anbelangt. Das Festlegen der „richtigen“ Breite von Tabellen und Spalten ist also nicht so trivial, wie es scheint.
Um dieses Problem zu lösen und dem persönlichen Geschmack des Users gerecht zu werden, enthält getinsight.de – eine Plattform, die wir für einen Auftraggeber entwickelt haben – eine Funktion, mit der der User die Breite von Tabellen im Browser manipulieren kann. Mit einem Klick auf einen Button (oben rechts) passt sich die Tabelle an die Breite des Browsers an. Mit einem zweiten Klick zieht sie sich wieder auf eine vordefinierte Breite von 980 Pixeln zusammen. So kann der User frei entscheiden, welche Darstellung ihm das beste Leseerlebnis bereitet.
Lessons Learned – der Warenkorb
Die getinsight.de-Plattform ermöglicht es Usern, PDFs gesammelt herunterzuladen. Hierzu gibt es eine Art Warenkorb-Funktion. Im Warenkorb sammelt der User Inhalte, um diese dann geschlossen herunterzuladen. Das Prinzip ist schon von den Warenkörben typischer E-Commerce-Seiten wie Amazon.de bekannt.
Zwei grundlegende Prinzipien haben wir also gelernt. Das eine ist das visuelle unmittelbare Feedback, sprich dem User wird eine visuelle Rückmeldung gegeben, dass der Artikel – oder in unserem Fall die PDF – sich nun im Warenkorb befindet. Das andere Prinzip ist das Anzeigen der Sammlung, sprich dem User wird jederzeit angezeigt, wie viele Artikel – oder eben PDFs – sich im Warenkorb befinden.
Beide Prinzipien nutzen wir in erweiterter Form bei getinsight.de, um dem User eine komfortable Bedienung zu ermöglichen. Nach dem Klick auf den „In den Warenkorb“-Button ändert dieser das Icon und die Farbe, um zu visualisieren, dass die PDF nun im Warenkorb ist. Zusätzlich blenden wir am Fuß des Browsers den Warenkorb mit einer Animation (Bewegung von unten nach oben) ein. Diese Bewegung zieht den Blick des Users auf den Warenkorb und schafft so Aufmerksamkeit. Ein zweiter Klick auf den Button entfernt die PDF wieder aus dem Warenkorb. Der Mechanismus ist ähnlich wie bei einem An- und Ausschalter.
Filter, fixed!
Wenn es um das Filtern von Daten geht, gilt es, einige einfache, aber wichtige Prinzipien zu beachten. Eines davon ist die Sichtbarkeit. Wenn dem User eine eingeschränkte Auswahl von etwas – in diesem Fall Publikationen – angezeigt wird, muss ihm jederzeit klar sein, dass die Auswahl eingeschränkt wurde. Ansonsten kann der Eindruck entstehen, dass Daten fehlen und besonders die gewünschten Informationen nicht vorhanden sind.
Für getinsight.de verwenden wir daher einen Filter, der „fixed“ ist, sprich immer am oberen Rand des Browsers stehenbleibt. So ist er stets im Blick des Users und dient gleichzeitig als Bedienelement und als Anzeige der aktuellen Filter.
Zusätzlich verbessern wir die Bedienbarkeit durch das logische Ausschließen bestimmter Filterkombinationen. So verhindern wir zum Beispiel, dass ein User gleichzeitig nach einem Unternehmen und nach einer Branche filtert. Denn die Filterung nach einem Unternehmen schließt bereits alle anderen Branchen kategorisch aus. An dieser Stelle deaktivieren wir bestimmte Optionen, so dass der User nicht in eine Situation gerät, in der die Suchergebnisse leer sind.
