Flash ermöglicht Designern und Entwicklern multimedial aufbereitete Inhalte weitgehend browserunabhängig bereitzustellen. Man kann Animationen erstellen, mehr Interaktivität produzieren und damit beeindruckende Interfaces erstellen. Mit AS3 besitzt Flash mittlerweile eine Scriptsprache, mit der sich alle wichtigen Prinzipien der Objektorientierung umsetzen lassen. Damit kann man mit Flash als Entwicklungsumgebung auch grosse Projekte umsetzen.
Leider gibt es durch diese Möglichkeiten auch immer wieder Ausbrüche von „Flash-Euphorie“, die dazu führen, das diese tolle Technologie relativ unvorteilhaft für Nutzer und damit auch für die Betreiber eingesetzt wird.
Ich möchte an dieser Stelle aber nicht darüber philosophieren, wann und wo Flash eingesetzt werden soll, sondern ein paar Techniken vorstellen, die dazu verwendet werden können, speziell Flash-Webseiten und Applikationen so aufzubereiten, dass sie möglichst „usable“ werden.
Flash und der Browser
Auch wenn der Flash-Player heutzutage eine hohe Verbreitung geniesst, ist er ein Browser-Plugin. Die Verwendung von Browserplugins im WWW ist aus mehreren Gründen nicht ganz unproblematisch. Eine Sache ist, dass die damit ausgeführten Programme als Elemente einer einzigen Seite implementiert sind und dadurch nicht über mehrere Seiten einer Webseite weiterlaufen können. Dies ist vor allem problematisch wenn komplette Webseiten mit Flash realisiert werden. Daraus ergeben sich einige Probleme.
Flash Einbetten
Schon beim Implementieren des Flash-Objektes in die HTML Struktur kann man einiges herausholen. Beispielsweise kann mit der Angabe des Parameters „Accesskey“ beim Flash-Objekt der Focus per Tastatur geregelt werden.
Weiterhin empfiehlt es sich heute, die <embeds> und <objects> für die SWFS per Javascript zu schreiben (beispielsweise FlashObject), da so die ActiveX -Element -Sperre von Microsoft-Browsern umgangen werden kann und das Flash sofort den Fokus erhält. (sonst muss man das Flash eventuell mit einem zusätzlichen Klick aktivieren)
Hier ist aber zu beachten, im <noscript> – Bereich eine Alternative bereitzustellen.
Generell sollte für Flash-Elemente auch einen alternativen Inhalt bereitgestellt werden, der immer dann geladen wird, wenn kein FlashPlayer vorhanden ist (FlashObject z.B. hat die Möglichkeit das zu Prüfen bereits implementiert). Das Minimum sollte sein, dass eine Meldung ausgegeben wird, das kein Flash -Player vorhanden ist und ein Download-Link zum Plugin. Auch sollte auf die FlashVersion abgeprüft werden, und gegebenenfalls eine Alternative, oder besser, ein Update auf die neueste Version des Players gestartet werden können.
Zurück – Vorwärts – Reload ?
Viele Benutzer navigieren oft mit den Browserbuttons für „Vor“ und „Zurück“ sowie „Aktualisieren“. Eine einheitliche Bedienung (don’t make users think) und gewohnt funktionale Bedienelemente sind in der Usability sehr wichtig. Deshalb sollten für reine Flash-Webseiten oder Apps Tricks angewandt werden um diese Funktionalität wieder zu ermöglichen. Eine verbreitete Möglichkeit ist, mit dem Tool „SWFAdress“ zu arbeiten, das im Grunde eine Library ist, die es ermöglicht, für Flash-Dateien „virtuelle URLs“ anzulegen, die dann in Flash aufgelöst werden. Dadurch wird es wieder möglich, die Seite zu aktualisieren, in der Chronik vor- und zurückzublättern, oder direkte Links zu Unterseiten der Flash-Webseite (z.B. per E-Mail) zu versenden.
Als Beispiel erwähne ich an dieser Stelle eines unserer älteren Projekte, die virtuelle Stadt ppmcity.com, wo wir auch die Positionen in den Blätterscripts, etc. in der URL mitübergeben. (Um die Stadt ohne registrieren zu Betreten, könnt ihr unter der Login-Maske “als Gast einloggen” anklicken.)
Suchmaschinenoptimierte Flashs
Adobe Flash hat sich als populäres Format für interaktive Anwendungen und Internetseiten etabliert. Jedoch besitzen Flash-Webseiten einen entscheidenden Nachteil – publizierte Inhalte können nur teilweise von Suchmaschinen erfasst und verarbeitet werden. Einige Suchmaschinen lesen mittlerweile schon komplette Zeichenfolgen aus den Flash-Dateien aus, auf diesem Gebiet wird geforscht und gearbeitet. Trotzdem ist die Indizierung von HTML – Dateien der Indizierung von Flash Inhalten noch weit voraus.
Der erste Schritt bei der Suchmaschinenoptimierung für Flash-Webseiten ist also im Prinzip der, den es bei HTML nicht in dieser Form braucht, nämlich den Bots der Suchmaschinen, die das Internet durchforsten einen Inhalt zur Verfügung zu stellen, den sie besser und genauer lesen können. Diese Bots können nämlich z.B. keine Flash-MovieClips an sich lesen, sondern lesen im Prinzip eigentlich das, was wir sehen, wenn wir den Quelltext einer Webseite ansehen. Ich möchte mich jetzt nicht allzu tief in diese Problematik vertiefen, aber ich möchte auf ein Beispiel zur Suchmaschinenoptimierung von Flashseiten verlinken. Ich werde im späteren Verlauf bei Interesse noch einen eigenen Post hier hineinstellen. Wichtig ist aber grundsätzlich, dass man sich bewusst ist, dass es bei Flash-Webseiten zusätzlichen Aufwand benötigt, um eine akzeptable On-Page optimierung zu bekommen.
Das Flashprojekt ansich
Ladezeiten
Flash verleitet natürlich gerade aufgrund der Möglichkeiten im Streamingbereich dazu, Projekte mit grosser Datenmenge zu realiseren. Trotzdem gilt auch für Flash-Elemente „Don’t squander users’ patience“ – stelle die Geduld der Nutzer nicht auf die Probe! Zu lange Ladezeiten (z.B. > 15 Sek. bei durchschnittlicher Breitbandverbindung) sollten vor allem bei Flash-Webseiten vermieden werden. Bei Onlinespielen und Videos sind Nutzer meiner Erfahrung nach meist gewillt, längere Ladezeiten in Kauf zu nehmen. Sinnvoll ist es auf jeden Fall einen „Preloader“ darzustellen, um dem Nutzer den Fortschritt zu veranschaulichen. Bei grösseren Projekten empfehle ich, dass ihr euch auch eine prebuffering – Strategie ausdenkt.
Funktionalitäten und Design der UI – Elemente
Flash bietet die tolle Möglichkeit, jegliches Bedienelement auf der Webseite individuell zu gestalten. Hier ist die Gefahr also besonders gross, dass Unübersichtlichkeit und damit „Unbedienbarkeit“ vorherrscht.
Achtet also darauf, dass das Aussehen von Bedienelementen mit gleicher Funktionalität (z.B. alle Dropdowns) auch möglichst gleich ist. Das Links und Backlinks, Menüelemente, oder Formulare und Bedienelemente ein durchgängiges Design haben und dass das Aussehen und die Funktion nicht zu extrem von gewohnten Normen abweichen. Ein zu starkes Abweichen der Normen hat hier fast immer zur Folge, dass sich der Nutzer intensiver mit dem Element auseinandersetzen muss und das Gefühl verliert, die Applikation unter Kontrolle zu haben bzw. zu wissen was passiert, wenn er agiert. Viele sind dazu nicht gewillt. Dies kann bzw. wird sich negativ auf die User Experience auswirken. Es kann aber auch Vorteilhaft sein, wenn man eine spezifische Zielgruppe erreichen möchte oder das Projekt nicht vordergründig der Informationsvermittlung dient („discover“ … Onlinespiele – Rätsel – etc.)
Bei Wii-Fit haben das die Kollegen von FI hinbekommen, wie ich finde.
Loony – loops & Animation
Animationen sieht man mittlerweile oft und überall. Meistens werden Sie bei kommerziellen Webangeboten dazu genutzt, die Aufmerksamkeit des Nutzers (z.B bei Bannerwerbung) auf sich zu ziehen. Mit Animationen klappt das oft sehr gut. Das Problem ist, dass sich das in anderen Einsatzbereichen auch negativ auswirken kann. Wenn ich z.B. diesen Blog Eintrag lesen würde und im Header oder (noch schlimmer) an der Seite läuft eine schnelle und bunte, sich wiederholende 3D-Animation ab, würde das meinen Lesefluss extrem stören 
.
Ich rate nicht von Anmiationen ab, aber es ist generell wichtig, sich im vorhinein zu überlegen, wohin man (und z.B. in welcher Reihenfolge) den Fokus des Betrachters lenken möchte. Dies kann man mit ganz wenig typografischen oder layouttechnischen Mitteln erreichen, und eben auch mit Animationen. Diese sollten – vor allem bei vordergründig Informations-vermittelnden Flash-Programmen – eher dazu verwendet werden auch Informationen zu vermitteln oder bei der Vermittlung von Informationen unterstützen (z.B. veranschaulichen) und nicht in der Schleife ablaufen. Natürlich kann man Animationen auch einsetzen um „Athmosphäre“ zu schaffen, ich empfehle euch dann jedoch, vorallem wenn ihr noch Lesematerial anzeigt, das vorsichtig zu tun. Wenn man Animationen richtig verwendet, sind sie ein mächtiges Werkzeug. Bei Spielen haben Anis noch zusätzliche wichtige Aufgaben, deshalb gilt dieser Punkt eher für Webseiten und Anwendungen.
In diesem Beispiel wird der Fokus des Nutzers sofort auf die wichtigen Stellen
(Beschreibung und Funktionalitäten der Webseite) fallen.
Accessibility-Klasse
Um die zugänglichkeit von mit Flash bereitgestellten Informationen zu erhöhen, könnt ihr die Accessibility – Klasse (seit AS2 meines Wissens nach) einsetzen.
Die Accessibility-Klasse verwaltet die Kommunikation mit Bildschirmleseprogrammen. Bildschirmleseprogramme sind eine Art unterstützende Technologie für Sehbehinderte, die auf diese Weise eine akustische Umsetzung des Bildschirminhalts erhalten. Man kann abprüfen, ob ein Computersystem Eingabehilfen unterstützt und dann die vorzulesenden Inhalte den verschiedenen Objekten hinzufügen. Es gibt Projekte, wo sehr zugänglich sein müssen und solche Massnahmen ziemlich wichtig sind.
Sounds
Sounds sind natürlich ein tolles und im Web oft vernachlässigtes Feature, mit dem man viel Athmosphäre schaffen kann um Eindrücke zu vermitteln und damit eine positive User Experience zu schaffen. Generell ist es aber in der Usability ziemlich wichtig, dem Benutzer immer das Gefühl zu geben, alles kontrollieren zu können : ).
Deshalb finde ich es im Bezug auf Sounds sehr wichtig, immer eine Control anzubieten, mit der der Benutzer den Sound aus- und einschalten kann. Ich selber speichere bei unseren Projekten die Auswahl des Nutzers („aus“ oder „ein“) immer in ein local-shared-object oder ein cookie um die Auswahl auch dann speichern zu können, wenn der Nutzer das nächste mal die Seite besucht.
Ein Beispiel wäre hier die Seite des Hochzeitsfotografen David Dolder.
Flash und Usability ist kein Gegensatz. Wenn man mit Flash arbeitet, heisst das nicht, dass Usability komplett ignoriert werden kann. Und Usability wiederrum heisst in meinen Augen nicht, auf alle Vorzüge von Flash verzichten zu müssen.
Viele haben Spass mit Flash und ignorieren jegliche Usability Richtlinien. Das ist OK, wenn das einzige Ziel des Projektes ist, damit Spass zu haben. Allen die auch Projekte mit zusätzlichem Zweck realisieren, rate ich dazu, es mal auszuprobieren ; )
Sandro Wellenzohn
Tags: design, flash, suchmaschinenoptimierung, usability, Webdesign