I siti che permettono di includere i loro contenuti multimediali in Flash su siti/blog esterni forniscono di solito, anzi sempre, del codice HTML. Se invece è necessario utilizzare del codice XHTML Strict valido, occorre effettuare qualche modifica al codice.
Innanzitutto, si deve eliminare il tag embed e utilizzare esclusivamente il tag object, che deve contenere gli attributi type e data.
Nella maggior parte dei casi, l'attributo data corrisponde all'attributo src dell'elemento embed oppure al valore del parametro movie, se specificato.
Eventuali parametri per il lettore Flash possono essere passati nel tag param, attraverso l'attributo FlashVars.
Inoltre, ci si deve ricordare di cambiare ogni occorrenza del carattere "&" con l'entità "&" .
Per automatizzare la conversione del codice, ho sviluppato un semplice strumento degradabile (Javascript e PHP), che si può aprire cliccando sul link sottostante:
Il convertitore è disponibile anche come Google Gadget, che può essere aggiunto al proprio sito o pagina iGoogle.
Di seguito verranno esposti alcuni esempi pratici di trasformazione da HTML a XHTML Strict per i contenuti Flash multimediali forniti da: Veoh, Deezer, Yahoo, La7, Libero, Revver, Brightcove, YouTube, GoogleVideo, Metacafe, Yahoo, Megavideo, Hulu.
Codice originale in HTML:
<object width="425" height="355"> <param name="movie" value="http://www.youtube.com/v/qdeMqqghXRI&rel=0"></param> <param name="wmode" value="transparent"></param> <embed src="http://www.youtube.com/v/qdeMqqghXRI&rel=0" type="application/x-shockwave-flash" wmode="transparent" width="425" height="355"></embed> </object>
Codice modificato in XHTML Strict:
<object type="application/x-shockwave-flash" width="425" height="355" data="http://www.youtube.com/v/qdeMqqghXRI&rel=0"> <param name="movie" value="http://www.youtube.com/v/qdeMqqghXRI&rel=0"></param> <param name="wmode" value="transparent"></param> </object>
Per l'opzione di riproduzione automatica del video basta aggiungere i caratteri: &autoplay=1 nell'attributo data e nel valore del parametro movie
Esempio di trasformazione in XHTML 1.0 Strict e risoluzione degli errori di validazione:
Codice originale in HTML:
<div style="width:180px;height:45px;"> <object width="180" height="29"><param name="movie" value="http://www.deezer.com/embedded/blogplayer_3.swf?path=173748&color1=990000&color2=cc6600&color3=cc9900"></param> <embed src="http://www.deezer.com/embedded/blogplayer_3.swf?path=173748&color1=990000&color2=cc6600&color3=cc9900" type="application/x-shockwave-flash" width="180" height="29"></embed> </object> <a href="http://www.deezer.com" style="border:none;margin:0;padding:0;"> <img src="http://www.deezer.com/embedded/footer.jpg" alt="free music" title="free music" border="0" style="border:none;margin:0;padding:0;" /> </a></div>
Codice modificato in XHTML Strict:
<div style="width:180px;height:45px;"> <object type="application/x-shockwave-flash" width="180" height="29" data="http://www.deezer.com/embedded/blogplayer_3.swf?path=173748&color1=990000&color2=cc6600&color3=cc9900"> <param name="movie" value="http://www.deezer.com/embedded/blogplayer_3.swf?path=173748&color1=990000&color2=cc6600&color3=cc9900" /> </object> <a href="http://www.deezer.com" style="border:none;margin:0;padding:0;"><img src="http://www.deezer.com/embedded/footer.jpg" alt="free music" title="free music" style="border:none;margin:0;padding:0;" /></a> </div>
Codice originale in HTML:
<object width="512" height="323"> <param name="movie" value="http://d.yimg.com/static.video.yahoo.com/yep/YV_YEP.swf?ver=2.1.15" /> <param name="allowFullScreen" value="true" /> <param name="flashVars" value="id=3167174&vid=713479&lang=it-it&intl=it&thumbUrl=http://us.i1.yimg.com/us.yimg.com/i/us/sch/cn/video09/713479_rnd3ad900a1_17.jpg" /> <embed src="http://d.yimg.com/static.video.yahoo.com/yep/YV_YEP.swf?ver=2.1.15" type="application/x-shockwave-flash" width="512" height="323" allowFullScreen="true" flashVars="id=3167174&vid=713479&lang=it-it&intl=it&thumbUrl=http://us.i1.yimg.com/us.yimg.com/i/us/sch/cn/video09/713479_rnd3ad900a1_17.jpg" ></embed> </object>
codice modificato in XHTML Strict:
<object type="application/x-shockwave-flash" data="http://d.yimg.com/static.video.yahoo.com/yep/YV_YEP.swf?ver=2.1.15" width="512" height="323"> <param name="movie" value="http://d.yimg.com/static.video.yahoo.com/yep/YV_YEP.swf?ver=2.1.15" /> <param name="allowFullScreen" value="true" /> <param name="flashVars" value="id=3167174&vid=713479&lang=it-it&intl=it&thumbUrl=http://us.i1.yimg.com/us.yimg.com/i/us/sch/cn/video09/713479_rnd3ad900a1_17.jpg" /> </object>
Codice originale in HTML:
<object width="400" height="330"> <param name="movie" value="http://www.la7.it/swf/flvplayer.swf?contentURL=/video/crozza_italia/crozzaitalia_261107_hannibal.flv&imgPath=/img/video/320X240/6158.jpg"/> <param name="allowFullScreen" name="true"/> <embed src="http://www.la7.it/swf/flvplayer.swf" FlashVars="contentURL=/video/crozza_italia/crozzaitalia_261107_hannibal.flv&imgPath=/img/video/320X240/6158.jpg" type="application/x-shockwave-flash" allowFullScreen="true" width="400" height="330"></embed> </object>
Codice modificato in XHTML Strict:
<object type="application/x-shockwave-flash" data="http://www.la7.it/swf/flvplayer.swf" width="400" height="330"> <param name="movie" value="http://www.la7.it/swf/flvplayer.swf?contentURL=/video/crozza_italia/crozzaitalia_261107_hannibal.flv&imgPath=/img/video/320X240/6158.jpg" /> <param name="FlashVars" value="contentURL=/video/crozza_italia/crozzaitalia_261107_hannibal.flv&imgPath=/img/video/320X240/6158.jpg" /> <param name="allowFullScreen" value="true" /> </object>
Codice originale in HTML:
<object width="400" height="333"> <param name="movie" value="http://video.libero.it/static/swf/eltvplayer.swf?id=c6ecddc29d158763e728a249be61cc91.flv&ap=0" /> <embed src="http://video.libero.it/static/swf/eltvplayer.swf?id=c6ecddc29d158763e728a249be61cc91.flv&ap=0" width="400" height="333" type="application/x-shockwave-flash"></embed> </object>
Codice modificato in XHTML Strict:
<object type="application/x-shockwave-flash" width="400" height="333" data="http://video.libero.it/static/swf/eltvplayer.swf?id=c6ecddc29d158763e728a249be61cc91.flv&ap=0" > <param name="movie" value="http://video.libero.it/static/swf/eltvplayer.swf?id=c6ecddc29d158763e728a249be61cc91.flv&ap=0" /> </object>
La descrizione qui