Das Ausblenden des Textrandes kann eine nützliche Alternative zu Ellipsen sein, und ich würde argumentieren, dass dies in gewisser Hinsicht überlegen ist.

Verwechseln Sie den Inhalt nicht

Ellipsen ersetzen den Textinhalt, um ihre Arbeit zu erledigen, was zu Verwirrung über den tatsächlichen Text führen kann. Enthält er die “ … „? Wenn ich ausschneide / kopiere / einfüge, kommt das zustande? Ein Überblenden ändert die Art und Weise, wie der Inhalt angezeigt wird .

In gewissem Sinne entsprechen Fades dem Begriff einer Trennung zwischen visueller und semantischer Codierung und Ellipsen nicht.

In iOS 5 hat Apple die Adressleiste geändert, damit Mobile Safari anstelle von Ellipsen eine Überblendung verwendet:

Nicht o Es ist nur klarer, wie die tatsächliche URL lautet, aber (zumindest fühlt es sich so an) Sie können ein wenig mehr davon sehen, wenn es nachlässt.

Vertikal abgeschnittener Text

Ellipsen funktionieren nicht vertikal. Hier ist ein Beispiel von JIRA, bei dem der niedrigere Inhalt gescrollt wird, der Header jedoch gesetzt bleibt (er wird auch kurz zuvor geschickt komprimiert – er ist nicht so ruckelig, wie es sich anhört). Die Überblendung hilft bei der Kommunikation, dass der Teil, der gescrollt wird, irgendwohin geht.

Wenn Text überläuft, handelt es sich um einen Container, der jedoch nicht umbrochen werden kann.

Hier in Google Mail ist die Kante, an der der Überlauf abgeschnitten wird, schwierig. Die Breite ist dynamisch, daher müssten Ellipsen dynamisch eingefügt werden, was nicht praktikabel ist (ich nehme an, sie könnten es nicht bissig machen). Ich würde argumentieren, dass ein Ausblenden oder ein Cousin der “ unter “ helfen könnte, zu kommunizieren, was los ist.

Allgemeiner Hintergrund

Im Allgemeinen der Ausblendeffekt ergibt sich aus einem Skeumorphismus, der darauf zurückzuführen ist, dass ein höherer Kontrast leichter zu analysieren ist und “ näher “ am Benutzer zu sein scheint und ein niedrigerer Kontrast schwieriger ist und scheinen entfernter – denken Sie, “ verblasst im Sonnenuntergang „. Ein konkreterer Skeumorph-Verwandter von iOS hebt die Idee hervor:

Ein weiteres Beispiel von Gmaps:

Dies ist eindeutig keine übergeordnete Konvention, die Textumbruch oder Ellipsen ersetzen soll. Nur ich Ich habe ein Beispiel für genau das gefunden, wovon Sie sprechen. Aber ich denke, es ist unter bestimmten Umständen eine gültige Option.

Kommentare

• +1 Das ´ ist eine schöne Übersicht über verschiedene Arten von Verläufen. Sollte ´ ein Blog-Beitrag gewesen sein;) Ich hoffe, Sie erweitern die Schlussfolgerung auf mehr als » Aber ich denke es ‚ ist unter bestimmten Umständen eine gültige Option. « , da Sie anscheinend ´ sind Ich habe viel darüber nachgedacht. Übrigens: Der letzte imho ist ein “ innerer Schatten „.Oh, und ich denke, Sie müssen die Bilder mit acht Leerzeichen versehen, damit die Liste funktioniert.
• @kaiser Vielen Dank für die Gedanken. Ich habe die Listen überarbeitet. Wahrscheinlich könnten auch die beiden letzten als “ innerer Schatten “ bezeichnet werden, obwohl der Schlüssel darin besteht, dass es ‚ ist ein innerer Schatten auf einem Container, der Text abschneidet – daher habe ich versucht, die Parallele zu zeichnen. Mein Wortlaut muss überarbeitet werden …

Zusammenfassend:

Die Punkt mit Verläufen und Ausblendungen ²⁾ ist immer der gleiche: Sie spielen nicht gut mit schlechten Monitoren / LCDs.

Das Kontrastproblem

_{Links : sieht auf dem Designer-Monitor gut aus || Richtig : viel früher ausblenden.}

Die Farbbereichsproblem

Schlechter Monitor:

Guter Monitor:

Wie Sie oben sehen können, teilt nicht jeder Benutzer Ihre persönlichen Erfahrungen auf Ihrem Monitor. Wenn Sie Sonnenlicht direkt auf den Bildschirm bekommen, wird das Ergebnis ausgeglichen schlimmer sein.

Meine Meinung:

Verwenden Sie keine Ausblendungen und Verläufe , bis Sie dies nicht vermeiden können .

Kommentare

• Dies ist nicht ‚ t was ich dachte “ verblassener Text “ bedeutet. Mein Eindruck war, dass es ‚ eher so ist wie: [~ 400 Zeichen Volltext] [~ 50-100 Zeichen schnell verblassenden Textes] – in diesem Fall Unterschied in der visuellen Erfahrung aufgrund Fade “ Geschwindigkeit “ woudn ‚ ist nicht wirklich signifikant. Bis das OP klarstellt, was sie meinte, handelt es sich jedoch um Spekulationen.
• Sicher, der spätere Teil würde entfernt, aber das wäre ‚ egal, da die Eine kurze Menge verblassenden Textes impliziert, dass ‚ nicht zum Lesen gedacht ist, sondern eher als ikonische Darstellung des “ mehr Textes „, das verfügbar ist.
• Farbverläufe sind weder hardwareabhängig noch werden sie durch Sonnenlicht oder schlechte Monitore erheblich beeinträchtigt. Sie verwechseln ein Designproblem mit einem UX-Problem. Normalerweise werden 4-10 Zeilen ohne Überlagerung angezeigt, dann 2-4 Zeilen mit einer Überblendung von 100% auf 0%. Es ist unerheblich, ob diese Überblendung genau auf dem Monitor des Benutzers ‚ dargestellt wird. Solange der Benutzer eine Überblendung sieht, hat das Steuerelement seinen Zweck erfüllt, weiteren Inhalt anzuzeigen.
• Auch hier haben Sie ein Missverständnis. Der Farbverlauf deckt nicht den gesamten Text ab, sondern nur den unteren Teil. Ob die Überblendung in diesem letzten Teil hoch oder niedrig ist, ist für den Wert als Indikator dafür, dass mehr Inhalt verfügbar ist, nicht besonders relevant. Der Großteil des Inhalts ist vollständig sichtbar. Es ist wichtig, sich der Tatsache bewusst zu sein, dass der Farbverlauf für einige Benutzer möglicherweise weniger sichtbar ist (damit Sie für den schlimmsten Fall entwerfen können), aber dies hindert ihn nicht daran, seinen Zweck zu erfüllen, unabhängig von der Qualität eines Benutzers ‚.
• Der entscheidende Punkt ist, ob das OP bedeutet, dass die Überblendung über 10 Meilen oder 10 mm erfolgt. Ich glaube nicht, dass ‚ es ‚ klar ist, angesichts der knappen Beschreibung und des Mangels an Beispielen. Ich ‚ würde zustimmen, dass große Farbverläufe über Text schlecht sind – die Beispiele, die Sie einschließen, sehen unter den besten Bedingungen ziemlich schrecklich aus. Aber nur weil die Beschreibung vage ist, heißt das nicht, dass Sie den schlimmsten Fall annehmen sollten. ‚ Ich ‚ wäre neugierig, was Sie von meiner Antwort halten, die einen Fall anspricht, in dem die Annahmen möglicherweise optimistischer sind.

Ich habe wirklich nicht gesehen, dass die Technik des „verblassten Textes“ häufig verwendet wird, aber ich denke, der Sinn der Benutzererfahrung besteht darin, für alles zu entwerfen, was es dem Benutzer einfach macht Wenn der Benutzer versuchen muss zu erraten, was los ist, verlieren Sie wahrscheinlich den Zweck. In den meisten Fällen reicht es aus, nur […] oder [mehr …] hinzuzufügen und einen sauberen, leicht zu verfolgenden Pfad bereitzustellen damit der Benutzer mehr Informationen erhält … worum geht es eigentlich?

Sie fragen, ob die Verwendung von ausgeblendetem Text überhaupt getestet wurde?

Aus meiner Sicht ist dies ein Beispiel dafür die Idee, „Information Scent“ in einer Benutzeroberfläche zu verwenden. Mit anderen Worten, wie können Sie Benutzern visuell ein Gefühl dafür vermitteln, wo sich die Daten in einem Information Spa befinden ce. In diesem Fall zeigt das Ausblenden an, dass in dieser Richtung mehr Informationen vorhanden sind, zu denen Sie gelangen können, wenn Sie scrollen oder auf irgendeine Weise interagieren.

In den späten neunziger Jahren haben wir in der Visualisierungs-Community viel über das Konzept des Informationsgeruchs diskutiert. Es gab eine Menge Forschungsliteratur in der CHI-Community, die Xerox Parc-Theorien zur Informationssuche herausbrachte. Sie haben viele Studien in diesem Bereich durchgeführt. Die Artikel von Peter Pirolli und Stu Card fallen mir ein.

Sie können den Informationsduft auch auf Abfragen anwenden. So habe ich zum Beispiel in einigen Visualisierungen, die ich mithilfe von Graustufen entworfen habe, den Informationsduft verwendet, um zu zeigen, wie Daten bestimmte Kriterien erfüllen, die auf Schiebereglern festgelegt wurden (Schwarz fehlgeschlagen eins, Dunkelgrau fehlgeschlagen zwei usw.). Mit anderen Worten, schwarze Datenpunkte liegen direkt außerhalb Ihrer Abfrage. Sie können den Schieberegler also schnell verschieben, um sie einzuschließen.

Bob Spence hat ein Papier geschrieben, in dem viele dieser Informationsduft- / Rückstandstechniken .

Obwohl ich keine Daten zu dieser speziellen Technik bereitstellen kann, gibt es in der Tat viele Studien darüber, wie die Bereitstellung dieser Art von Hinweisen Menschen bei informationsbasierten Aufgaben unterstützt.

Kommentare

• In welcher Beziehung stehen Mini-Maps zum Ausblenden der Inhaltsränder, die ‚ nicht in die Anzeige passen?
• bearbeitet, um zu verdeutlichen … es ist das zugrunde liegende Konzept, auf das ich anspreche.
• Es ist ein Balkendiagramm mit Farben pro Fehler. Ich habe immer noch ‚ Sie sehen nicht, wie relevant dies ist. Warum ist das rote Rot und die meisten Fehler am leichtesten und mit der hintersten Z-Ordnung?

Das Schöne an der Verwendung von verblassendem Text (für diejenigen, die nicht wissen, was dies bedeutet: transparente Farbverlaufsüberlagerung, damit der Text im Verlauf des Kurses in die Hintergrundfarbe „verschwindet“, wenn ein paar Zeilen) ist, dass es viel größer und schwerer zu übersehen ist als Auslassungspunkte. Während Ellipsen fast immer zur Anzeige dienen, scheint der Text manchmal nur an der richtigen Stelle zu enden, sodass es kein baumelndes Konzept gibt, das Benutzer dazu ermutigt, nach zusätzlichen Wörtern zu suchen. Ellipsen sind auch recht klein und leicht zu übersehen, insbesondere für Menschen mit eingeschränkter Sehkraft (wie ältere Menschen).

Ich habe selbst keine Erfahrung damit, und obwohl ich mich an eine Site erinnern kann, die ich benutze … Ich kann mich nicht erinnern, welche Site, die ich benutze, diese hat. Ich entschuldige mich. Ich kann sagen, dass mir die gefällt Konzept und ich glaube, es funktioniert gut für seinen Zweck. Beachten Sie, dass es keine „Mehr“ -Schaltfläche ersetzt, sondern lediglich einen viel größeren und klareren Hinweis auf zusätzlichen Inhalt bietet. Sie benötigen weiterhin einen Bereich, in dem Benutzer klicken können (Fensterschatten, Schaltfläche Mehr), wenn sie den Fading-Effekt sehen.

Dies scheint gut zu funktionieren das Konzept des Formlesens, http://www.microsoft.com/typography/ctfonts/WordRecognition.aspx und der Worterkennung. Theoretisch kann ich dies jedoch nur für horizontale Überblendungen (von links nach rechts) und nicht auch bei Amazon als nützlich erachten vertikales Überblenden. http://softwareas.com/pure-css-solution-to-avoid-cutting-off-text/ Wir könnten dies mit einem Flüstern gleichsetzen, obwohl das Flüstern hörbar ist, ist dies ein ähnlicher Effekt Eine visuelle Ebene. Meines Wissens gab es noch keine Studien, aber wenn jemand eine findet, bitte hier posten.

Hier ist ein Fade-Sample im Vergleich zur Standard-Ellipse. http://www.theuxunicorn.com/fade_sample.png