Die Entscheidung für Flash oder Silverlight wird häufig auf Grund der Verbreitung der jeweiligen Laufzeitumgebung getroffen und da hat momentan Flash ganz eindeutig die Nase vorne. Doch es gibt Szenarien in denen Silverlight trotz dieses Mankos eine sinnvolle Alternative ist. Umso wichtiger ist es dann, auf das Fehlen des Plug-Ins vorbereitet zu sein.
Adobe bettet Flash-Inhalte entweder per JavaScript oder Kombination aus Object- und Embed-Tag in eine HTML-Seite ein. Microsoft beschränkt sich hier Standardkonform für Silverlight auf das Object-Tag. Und das Schöne an diesem Object-Tag ist, dass, wenn der Browser damit nichts anfangen kann, das nächste Kindelement angezeigt wird. Bei Silverlight ist das üblicherweise ein Bild mit Link zur Installation von Silverlight.
1 2 3 4 5 6 7 8 | <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%"> <param name="source" value="ClientBin/silverlight.xap" /> <param name="minRuntimeVersion" value="3.0.40818.0" /> <param name="autoUpgrade" value="true" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" /> </a> </object> |
Dieses Verhalten kann man aber auch dafür nutzen, anstelle des Bildes Flash anzuzeigen. Wenn man Beispielsweise Silverlight für die Wiedergabe eines Videos bevorzugt, dann könnte als Fallback ein Flash-Video-Player erscheinen – es unterstützen ja beide H264, so dass sogar das gleiche Video zum Einsatz käme. Dafür ist es von Vorteil, wenn Flash auch den Standardweg gehen würde, was mit ein paar Modifikationen am Object-Tag auch klappt.
1 2 3 | <object data="flash.swf" type="application/x-shockwave-flash" width="100%" height="100%"> <param name="movie" value="flash.swf" /> </object> |
Und da hier auch das kaskadierende Verhalten bei einem fehlenden PlugIn stattfindet, kann somit Flash als Fallback für Silverlight dienen und sollte auch Flash fehlen, dann kann beispielsweise ein Downloadlink wahlweise für Silverlight oder Flash geboten werden.
1 2 3 4 5 6 7 8 9 10 11 | <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%"> <param name="source" value="ClientBin/silverlight.xap" /> <param name="minRuntimeVersion" value="3.0.40818.0" /> <param name="autoUpgrade" value="true" /> <object data="flash.swf" type="application/x-shockwave-flash" width="100%" height="100%"> <param name="movie" value="flash.swf" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" /> </a> </object> </object> |
Hi Sascha,
den HTML5-Video-Tag könnte man in diesem Szenario auch noch einsetzen und das ganze noch weiterschachteln 🙂 Auch dieser ruft als Fallback die Kindelemente auf.
Aktuell unterstützen Safari (auch Safari Mobile / iPhone) und Chrome auch den H.264-Codec. Für Firefox müsste man Theora nehmen (siehe auch http://www.video-flash.de/index/html5-videos-einbinden-und-abspielen/ ).
Danke Florian. Der Hinweis mit HTML5 ist gerade hinsichtlich des iPhones hilfreich. Beispiel Video: Als primäre Variante ginge dann Smooth Streaming mit Silverlight und als Fallback Streaming mit Flash. Und da beides auf dem iPhone ja nicht verfügbar ist, käme als dritte Lösung das Video-Tag aus HTML5 zum Einsatz. Klar, die Reihenfolge kann natürlich auch gedreht werden. Und dank H.264 auf allen genannten Plattformen muss beim eigentlichen Video nicht viel getan werden…