Flash verwenden und Standards einhalten

Jeder, der jemals mit Flash im Web gearbeitet hat, ist wahrscheinlich auf die Tatsache gestoßen, dass das Einbetten von Flash in eine Webseite normalerweise keine leichte Aufgabe ist. Der Code, den Flash zum Einbetten bereitstellt, sieht ungefähr so aus:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="650" height="117" id="test-flash-banner" align="middle">
	<param name="allowScriptAccess" value="sameDomain" />
	<param name="allowFullScreen" value="false" />
	<param name="movie" value="test-flash-banner.swf" /><param name="quality" value="high" />
	<param name="wmode" value="transparent" /><param name="bgcolor" value="#ffffff" />
	<embed src="test-flash-banner.swf" quality="high" wmode="transparent" bgcolor="#ffffff" width="650" height="117" name="test-flash-banner" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

Es ist nicht überraschend, warum es so gemacht wurde ... es funktioniert. Aber die Art und Weise, wie es funktioniert, ist durch rohe Gewalt (manchmal als „zweimal gekochte“ Methode bezeichnet) und die Einbeziehung von mehr als dem, was für die meisten Browser benötigt wird. Das größte Problem ist das **<embed>**-Tag, das ein ungültiger Code ist, der dazu führt, dass Ihre Seite nicht als standardkonform validiert.

Das ist schon lange ein Problem. Es gibt sogar einen Artikel von A List Apart aus dem Jahr 2002: Flash Satay: Flash einbetten und gleichzeitig Standards unterstützen. Fünf Jahre später sprechen sie immer noch darüber.

Glücklicherweise haben sich einige kluge Leute dieses Problems angenommen. Es gibt jetzt eine Vielzahl von Möglichkeiten, Flash standardkonform einzubetten. Hier sind einige Optionen:

<swfobject>

Swfobject ist der Große auf dem Markt. Einige frühere Projekte betrachten sich nun selbst als veraltet und verweisen auf swfobject. Swfobject ist Open Source und äußerst robust, insbesondere jetzt, seit kurzem Version 2.0 veröffentlicht wurde. Es gibt zwei Möglichkeiten, Flash mit swfobject einzubetten, und beide sind standardkonform. Da es einfach zu viele Funktionen gibt, um sie hier zu erwähnen, werde ich nur einige erwähnen, die mir auffallen:

• Erkennt die Flash-Version automatisch und verhält sich entsprechend.
• Kann anbieten, Ihre Flash-Version automatisch zu aktualisieren.
• Bietet alternative Inhalte, wenn dies die einzige Option ist, was auch gut für SEO ist.
• Bringt Flash auf Geräte mit sehr schlechter Flash-Unterstützung wie das PSP.
• Eliminiert den „Klick-zum-Aktivieren“-Mist im IE.

Es gibt sogar einen Code-Generator-Begleiter zu swfoject, der Ihnen hilft, den benötigten Code für den Einstieg zu erstellen.

 

Objecty

Objecty ist der Neuling auf dem Markt.

Objecty macht es unglaublich einfach, Video und Audio im Web zu platzieren. Es soll das gesamte Paradigma neu gestalten. (Oder so ähnlich.)

Ziel ist eine einfache Handhabung, was ich liebe. Grundsätzlich binden Sie einfach die Objecty-JavaScript-Datei auf Ihrer Seite ein und dann ist das Einbetten von Medienobjekten auf Ihrer Seite so einfach wie das Einfügen eines Objekt-Tags mit einer eindeutigen Klasse. Es unterstützt Flash (in den Formaten .flv (!) und .swf), aber auch eine Vielzahl anderer Formate: .mp4, .m4v, .m4a, .m4b, .wmv, .mov, .unity

Der Code sieht so aus:

<object class="ObjectyMe" uri="myFlashMovie.swf" width="550" height="400"></object>

 

jQuery Media Plugin

Wenn Sie bereits jQuery auf Ihrer Seite verwenden, sollten Sie das jQuery Media Plugin in Betracht ziehen, das vielleicht die einfachste Lösung überhaupt ist. Es funktioniert, indem es Anker-Elemente auf der Seite nach Klassen- oder ID-Namen anspricht und diese durch den entsprechenden Code zum Platzieren des Flashs ersetzt.

jQuery

$('.media').media();

Markup

<a class="media" href="sample.swf">My Flash Movie</a>

Es gibt eine integrierte Browsererkennung, die das Anker-Tag durch den entsprechenden Code ersetzt. Da Ihr Code keine Embed-Codes im Markup enthält, müssen Sie sich keine Sorgen um Validierungsfehler machen.

Wie Objecty ist dieses Plugin bei weitem nicht nur auf Flash beschränkt. Hier ist eine Liste der unterstützten Formate: asf, avi, flv, mov, mpg, mpeg, mp4, qt, ra, smil, swf, wmv, 3g2, 3gp, aif, aac, au, gsm, mid, midi, mov, mp3, m4a, snd, ra, ram, rm, wav, wma, bmp, html, pdf, psd, qif, qtif, qti, tif, tiff, xaml. Das Plugin erkennt sogar den Dateityp direkt anhand der Dateierweiterung im href-Attribut.