Validare una pagina XHTML contenente un elemento flash

Avere un codice il più possibile pulito e conforme agli standard è fondamentale se si vuole essere presi in considerazione. Purtroppo se provate a validare una pagina con un video flash, ad esempio preso da youtube, scoprirete che non viene validata correttamente.

Ecco un esempio di un codice preso da da youtube per incorporare un video in una pagina web:

<object width=”480″ height=”385″>
<param name=”movie” value=”http://www.youtube.com/v/UScyx6gRA6Q?fs=1&amp;hl=it_IT&amp;rel=0″></param>
<param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param>
<embed src=”http://www.youtube.com/v/UScyx6gRA6Q?fs=1&amp;hl=it_IT&amp;rel=0″ type=”application/x-shockwave-flash” allowscriptaccess=”always” allowfullscreen=”true” width=”480″ height=”385″></embed>
</object> 

Purtroppo è abbastanza difficile fare ordine in un codice così complicato, ci ho provato mandando a capo i vari elementi ma non ho ottenuto risultati eccezionali. Comunque, andiamo avanti.

Ad impedire la validazione è il tag <embed>. Questo tag viene usato dai browser eredi di Netscape, come ad esempio Firefox, tuttavia non fa parte dello standard XHTML. Quindi potete eliminarlo.

<object width=”480″ height=”385″>
<param name=”movie” value=”http://www.youtube.com/v/UScyx6gRA6Q?fs=1&amp;hl=it_IT&amp;rel=0″></param>
<param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param>
</object>

A questo punto la pagina verrà validata… però su Firefox non si vedrà più nulla e, siccome Firefox costituisce circa il 35% del mercato dei browser, non è una cosa buona.

Dovete quindi aggiungere al tag <object> gli attributi typedata. Il primo deve avere come valore il tipo MIME del contenuto (in questo caso application/x-shockwave-flash), il secondo il link al video. Modificate quindi il tutto in questo modo:

<object type=”application/x-shockwave-flash” data=”http://www.youtube.com/v/UScyx6gRA6Q?fs=1&amp;hl=it_IT&amp;rel=0″ width=”480″ height=”385″>
<param name=”movie” value=”http://www.youtube.com/v/UScyx6gRA6Q?fs=1&amp;hl=it_IT&amp;rel=0″></param>
<param name=”allowFullScreen” value=”true”></param><param name=”allowscriptaccess” value=”always”></param>
</object> 

In questo modo il video sarà visibile e la pagina verrà correttamente validata. Vedere per credere.