Ein Beitrag, in dem einige Hintergrundinformationen zur Wirkung von Animationen, Tickern und Blinkern dargestellt werden.

Es geht unter anderem um das Gesichtsfeld, Blickreflexe und Wahrnehmungs-Systeme.

Und das Fazit für die Praxis: Lassen Sie es sein!

Inhalt

Das zweigeteilte Gesichtsfeld

Zusammenfassung: zwei visuelle Systeme

Beispiel 1: Wenn News blinken

Beispiel 2: Wenn mehrfach animiert wird

Beispiel 3: Wenn eine Grafik nicht genug ist

Wenn's nicht anders geht: Schaden minimieren

Fazit: Lassen Sie es sein!

Animationen: Sind sie nun die Formel 1 des Webdesigns oder überflüssiger Plunder? Machwerk von Amateuren, die Nächte damit verbringen, alberne, zuckende Bildchen zu basteln? Oder die raffiniert getarnten Verführungswerkzeuge von Bannerwerbern? Oder sind sie vielleicht die frühen Vorboten des multimedialen Cyberspace, über den sich manche Visionäre so gerne auslassen?

Nun, wenn ich von der nüchternen Voraussetzung ausgehe, dass die Gäste einer Website möglichst viel von den Informationen aufnehmen, verstehen und behalten sollen, die ihnen präsentiert werden, sind Animationen jedenfalls (fast immer) eines: schlecht! Und dieses Urteil kann man getrost auch weiter ausdehnen, auf alles was da im Web so rotiert, blinkt, zuckt und tickert. Die Gründe hierfür liegen jenseits von Technik, Geschmack, Vision, Philosophie und Ästhetik und haben etwas mit der Funktionsweise unseres Wahrnehmungssystems zu tun - womit wir beim Thema dieses Artikels wären.

Das zweigeteilte Gesichtsfeld

Als Gesichtsfeld bezeichnet man den Bereich der Umwelt, der in einem gegebenen Moment in unseren Augen, genauer: auf der Netzhaut, der lichtempfindlichen Zellschicht im Augenhintergrund, abgebildet wird - salopp ausgedrückt „alles, was wir sehen“.

Unser Gesichtsfeld wirkt zwar glatt, übergangslos und einheitlich, es sei denn man trägt eine klitzekleine Brille oder hat, sagen wir, 12 Sambuca konsumiert, dieser Eindruck ist jedoch falsch. Tatsächlich wird es von zwei getrennten Nervenbahnen und daran angeschlossenen Hirnzentren mit völlig unterschiedlichen Eigenschaften versorgt. Diese kooperieren allerdings normalerweise so unauffällig und perfekt, dass wir sie nicht ohne weiteres unterscheiden können.

Zum "wo":

Das eine System - nennen wir es „zentrales“ System - ist für die Stelle der Netzhaut zuständig, mit der unser Blick Dinge fixiert, was zugleich der Punkt mit der höchsten Sehschärfe ist. Bei einem Computermonitor wäre das eine Zone etwa von der Größe eines Markstücks. Beim Lesen springen wir mit diesem "Fixationspunkt" z.B. in mehreren Schritten über eine Textzeile, und picken uns dabei soviel Information heraus, dass wir den Sinn des Ganzen - hoffentlich - verstehen. Das andere, "periphere" System ist sozusagen für den Rest zuständig, also die Zone, die vom Fixationspunkt bis zum äußersten Rand unseres Gesichtsfeldes reicht. Auf der folgenden Grafik ist dies schematisch dargestellt.

Zum "wie" und "warum":

Das zentrale System fokussiert Informationen, nimmt Dinge detailliert wahr, analysiert sie inhaltlich, und schickt die Ergebnisse dann gewissermaßen an unser Bewusstsein. Dieser Funktion entsprechend ist sein räumliches Auflösungsvermögen, also die Fähigkeit, Gesehenes in Feindetails aufzulösen, sehr hoch. Gleichzeitig ist die Farbempfindlichkeit der Netzhaut in der Region um den Fixationspunkt maximal und nimmt nach außen rasch ab.

Das periphere System hat andere, nicht minder wichtige Funktionen. Zunächst beruht die Steuerung der Blickbewegungen zu einem guten Teil auf den Informationen, die es an das Gehirn liefert. Es scannt aber auch die Umwelt permanent auf Veränderungen, unterbricht gegebenenfalls laufende Handlungen, und lenkt die Aufmerksamkeit und die Blickbewegungen entsprechend um. Die Logik die hinter diesem sog. "Orientierungsreflex" steckt, ist ebenso einfach wie bestechend: Was sich verändert bzw. bewegt, könnte ja (a) uns fressen oder (b) uns verletzen oder aber (c) von uns gefressen werden. Also schauen wir vorsichtshalber erst einmal nach, bevor wir uns weiter mit unseren Handlungszielen beschäftigen. Dieser biologischen Funktion entsprechend ist das zeitliche Auflösungsvermögen des Systems, also die Fähigkeit, schnelle Bewegungen oder kurzdauernde Veränderungen wahrzunehmen, besonders hoch - sehr viel größer als die des zentralen. Da andererseits Formen und Farben für seine Funktionen keine wesentliche Rolle spielen, ist die Sehschärfe und die Farbempfindlichkeit im peripheren Gesichtsfeld gering.

Sehr wichtig ist noch, dass sich dieser Reflex überhaupt nicht für Inhalte interessiert, er wird durch alle Veränderungen oder Bewegungen ausgelöst, sei es eine ins Blickfeld krabbelnde Spinne, ein umfallender Stuhl, oder eben ein Ticker in der Statuszeile eines Browsers.

In der folgenden Tabelle sind die wesentlichen Merkmale der beiden Systeme noch einmal im Überblick dargestellt.

Zusammenfassung: zwei visuelle Systeme

Wir können also festhalten:

Bewegung und Veränderung hat in der Hierarchie der Reize, auf die unser Gehirn biologisch programmiert ist, immer die höchste Priorität.

Und damit kommen wir dann zum Kern dieses Beitrags.

Beispiel 1: Wenn News blinken

Was geschieht, wenn unsere Wahrnehmung, sagen wir, mit einen dieser hübschen, blinkenden, meist schwarz-gelben "News"-Icons konfrontiert wird, die viele Websites zieren? Zunächst wird das periphere Wahrnehmungssystem durch das Blinken aktiviert, unsere Aufmerksamkeit wird automatisch gelockert, aktuelle Denkvorgänge werden gestört oder unterbrochen, und die Blickbewegungen werden in Richtung auf die brandheißen Neuigkeiten abgelenkt. Dies ist, wie gesagt, keine Frage des Willens, sondern ein Reflex, der genauso mechanisch funktioniert wie der, den ein Neurologe auslöst, wenn er mit einem Hämmerchen auf unser Knie schlägt - andere Leute wissen oft Schmerzhafterweise nicht so recht, wo sie hintreffen müssen. Wenn wir uns dann beiläufig vergewissert haben, dass es sich - wieder mal - nicht um eine angreifende Killerwespe, sondern um ein dröges Sonderangebot oder den aktuellen Dollarkurs handelt (was uns beides nicht die Bohne interessiert), können wir uns wieder den Dingen zuwenden, die für unsere Ziele relevant sind. Aber auch dann zieht die andauernde Unruhe immer noch weiter Aufmerksamkeitsressourcen ab.

Wie bitte? Sie sind schon immun gegen solche Mätzchen, glauben Sie? Trotzdem: Auch wenn Sie den Eindruck haben, erfolgreich gegenzusteuern, wird dies doch nie wirklich vollständig gelingen und ganz nebenbei wertvolle Aufmerksamkeitsressourcen verbrauchen, mit denen Sie - gerade im Web - Besseres anfangen könnten. Das Denken und Handeln wird von dem durch das Blinken angeregten Alarmsystem also immer und andauernd irritiert.

Im übrigen wird Blinken in der Ergonomie wegen dieser brachialen Wirkung auf die Aufmerksamkeit traditionellerweise eingesetzt, um kritische Systemzustände anzuzeigen. Wenn Sie also z.B. einmal an einer Führung in einem Atomkraftwerk teilnehmen, und irgendetwas beginnt hektisch zu blinken (möglicherweise sogar noch in Rot und von einem ätzenden Summton untermalt), ist der Zeitpunkt gekommen, sich unauffällig in Richtung Ausgang zu bewegen........

Beispiel 2: Wenn mehrfach animiert wird

Was geschieht dann bei mehreren blinkenden Zutaten oder Animationen? Nachdem wir wissen, dass Bewegung für unsere Aufmerksamkeit oberste Priorität hat, können wir es uns in etwa so vorstellen: Die Blickreflexe werden gleichzeitig in mehrere Richtungen gezerrt, das Fixationsverhalten wird also zunächst einmal ziemlich desolat, und es wird dann eine ganze Weile dauern, bis das Alarmsystem unseres peripheren Gesichtsfeldes so weit zur Ruhe gekommen ist, dass das zentrale Analysesystem einigermaßen ungestört arbeiten kann. Und auch hier gilt wieder (man kann es nicht oft genug betonen): Selbst wenn wir schließlich die Animationen anscheinend erfolgreich ignorieren, entstehen permanent weiter Kosten in Form erhöhter Ablenkung und verminderter Aufmerksamkeit, die sich z.B. in einer Verschlechterung der Gedächtnisleistung für die eigentlich interessierenden Informationen bemerkbar machen.

Beispiel 3: wenn eine Grafik nicht genug ist

Ein besonderes Problem entsteht, wenn - wie vielfach üblich - an einer Position auf einer Seite mehrere Grafiken im Wechsel gezeigt werden. Hier kommt zu den bisher geschilderten Problemen noch ein weiteres hinzu: Bilder ziehen die Aufmerksamkeit besonders an und werden ohne jede Anstrengung entschlüsselt - sehr viel müheloser als Texte. Auch die Gedächtnisleistung für Bildmaterial ist im Vergleich zu Texten oder Wörtern weitaus besser. Dies macht sie zu idealen Werkzeugen für die Orientierung innerhalb komplexer Websites. Wenn an einer Stelle ein prägnantes Bild angezeigt wird, werden die Benutzer/innen dies automatisch als "Bookmark" in der mentalen Landkarte abspeichern, die sie während ihres Aufenthaltes auf einer Site aufbauen. Die abgelegte Gedächtnisspur können sie dann später nutzen, etwa um interessante Seiten wiederzuerkennen oder zu entscheiden, ob sie eine Seite schon einmal gesehen haben.

Etwa so: "Die Download-Seite mit dem Werkzeugkasten rechts oben enthält Tools, die mit dem 'HTML'-Button die HTML-Editoren. - alles klar!"

Wenn nun aber mehrere Grafiken an einer Position miteinander konkurrieren, werden diese Prozesse völlig überflüssigerweise erschwert und verwischt. "Die Seite, auf der rechts oben (a) ein Werkzeugkasten, dann (b) ein Computer nebst Modem und schließlich (c) eine Diskette angezeigt wird, enthält 'Tools', die auf der (a) ein 'HTML'-Button, dann (b) der verkleinerte Screenshot einer Homepage und dann (c) ein stilisiertes 'tag' angezeigt werden, enthält die HTML-Editoren - nichts mehr klar!"

Und diesem negativen Effekt - ganz zu schweigen von den erhöhten Wartezeiten für die Mehrfachgrafiken - steht als einzige Rechtfertigung gegenüber, dass die hübschen Bilder nun einmal "da" sind, und dass zwei coole Grafiken nach den Gesetzen der Mathematik doppelt so cool sind wie eine einzelne. Eine andere, plausiblere Erklärung fällt mir nicht ein. Hier gilt also ganz eindeutig: "Weniger ist mehr", und nicht "viel hilft viel".

Wenn’s nicht anders geht: Schaden minimieren

Das ist Ihnen alles egal, und Sie möchten trotzdem eine animierte Website? ("Aber, der Friedrich Weizenkeim hat doch einen glitzernden Sternenhimmel mit einem durchstartenden 3D-Raumkreuzer auf seiner Homepage. Mit rauchendem Feuerschweif! Und wie sieht das denn aus, wenn bei mir garnix passiert? Der hält mich doch für einen Laien.")

Also gut. Über Geschmack lässt sich streiten. Aus den Eigenschaften des peripheren Alarmsystems kann man einige einfache Regeln ableiten, die es erlauben, Animationen, wenn sie denn sein müssen, wenigstens so zu gestalten, dass die Besucher möglichst wenig gestört werden:

• Regelmäßiges Blinken ist besser als unregelmäßiges, weil sich das periphere Gesichtsfeld an eine regelmäßig wiederkehrende Veränderung leichter anpassen bzw. schneller beruhigen kann.
• Aus dem gleichen Grund sind glatte, saubere Bewegungen weniger beeinträchtigend als unruhige, ruckartige und eine regelmäßige Animation besser als unregelmäßige - z.B. mit komplexen Richtungswechseln in der Bewegung.
• Synchrones Blinken mit gleichen On- und Off-Phasen der Elemente ist wiederum besser als asynchrones.
• Eine Animation ist - natürlich - besser als mehrere, weil sich die ablenkende Wirkung mit jeder zusätzlichen Bewegungs- bzw. Störquelle potenziert.
• Animationen, die ein Ende haben oder abgeschaltet werden können, sind besser als endlose, die sich nicht kontrollieren lassen. Wie gesagt: auch wenn man den Blick von all den beweglichen Dingen, die uns so bezaubern, einmal losgerissen hat, stört eine andauernde Unruhe im äußeren Gesichtsfeld weiter die Informationsverarbeitung im zentralen.

Fazit: Lassen Sie es sein!

Zusammenfassend sind animierte und blinkende Zutaten ein gutes Mittel, die Aufnahme, das Verarbeiten und das Behalten von Informationen auf einer Website wirksam zu stören. Dabei habe ich bisher noch außer Acht gelassen, dass sie ja auch höhere Wartezeiten verursachen und so erheblich dazu beitragen können, dass ungeduldige Gäste auf den Besuch einer Site kurzerhand verzichten. Visuelle Effekte, die beeindrucken sollen und dann einen Teil ihres Publikum vertreiben, bevor sie sich überhaupt entfalten konnten, sind nun aber - um es auch aus dieser Perspektive noch einmal zu betonen - schlecht.

Es gibt durchaus noch andere Techniken, die Aufmerksamkeit zu lenken, etwa durch biologische Auslösereize, wirksame Schlüsselwörter und intensive Farben bzw. Kontraste. Diese Reize ziehen die Aufmerksamkeit auch an, lassen aber trotzdem zu, dass die Benutzer/innen sie irgendwann ohne Qualitätseinbußen bei der Wahrnehmung der eigentlichen Inhalte ignorieren. Und in mindestens 90% der Fälle sind diese Methoden allen nur denkbaren Animationen, Tickern oder Blinkern vorzuziehen.

Es sollte noch erwähnt werden, dass es natürlich auch Fälle gibt, in welchen Animationen gewissermaßen genau die Informationen transportieren, die die Besucher inhaltlich interessiert. Das schönste mir bekannte Beispiel hierfür findet man in der "Hall of Shame" der Website www.iarchitect.com, die idiotisches Interface-Design an den Pranger stellt. Dort werden Bedienungsvorgänge mit der Maus zur Demonstrationszwecken animiert dargestellt, und auch in Erklärungen werden Animationen z.T. geschickt eingesetzt, um die Leser/innen im Verstehen zu unterstützen. Im Gegensatz zu einem stillvergnügt vor sich hinrotierenden Firmenlogo oder einem Blinkelämpchen als endlos nervende Markierung auf einer Navigationsleiste ist hier die Bewegung im Fokus der Aufmerksamkeit und geht mit den Zielen der Benutzer/innen konform. Allerdings - so scheint mir - wird das positive Potential, das in Animationen stecken kann, bisher noch sehr wenig genutzt.