Incorporare oggetti audio e video

Vorrei tentare di condividere un bel po' di perplessità con questa community riguardo l'embedding di files audio e video proprietari (non l'embed da YouTube, per intenderci) nei nostri siti web.

Chiedo cortesemente di evitare l'HTML5: abiterò in una zona depressa, ma dalle mie parti non tutti i browser sono aggiornati... e vorrei rimanere nell'ambito HTML4/XHTML.

Si riesce a trovare una soluzione, il più possibile cross-browser e -magari- W3C valida?

Ero riuscito a trovare una strada relativamente semplice per l'audio, usando il tag <object> (ricordo che <embed>, in HTML4, è deprecato) con il codice

<object width="400" height="68" data="URL_DEL_FILE">
<param name="autoplay" value="true" />
<param name="autostart" value="true" />
<param name="src" value="URL_DEL_FILE" />
</object>

Semplicissimo, non specifica CLASSID o robaccia del genere per cui non costringe il caricamento di un preciso plugin, ed è validato XHTML. Peccato che
1. sui browser più recenti, ci metta una vita ad essere interpretato (indipendentemente dal peso del file audio da riprodurre).
2. Internet Explorer 9 non se lo fili per nulla (in modalità compatibilità invece nessun problema).

Per il video, ora come ora brancolo nel buio più totale. Usavo un codice assolutamente non validabile causa <embed>, che richiamava il "buon" Windows Media Player... però funzionava: "mangiava" sia wmv che mp4. Da un po' (aggiornamento browser), niente da fare.

Ho cacciato nella zona W3School... E ogni codice o non funziona (o per lo meno non va su più browser testati) oppure non è validato W3C (ma a questo punto comincio a fregarmene).

Qualche idea? Grazie per le eventuali risposte (sono graditi esempi di codice).

Io utilizzo questo che non è validato :

<object id="sound1" classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="190" HEIGHT="20">
<param name="src" value="URL_DEL_FILE">
<param name="ShowControls" value="1">
<param name="console" value="sound1">
<param name="autostart" value="false">
<PARAM name="PLUGINSPAGE" VALUE="http://www.apple.com/quicktime/download/index.html">

<embed src="URL_DEL_FILE" type="audio/mpeg" WIDTH="190" HEIGHT="20" showcontrols="1" autoplay="false" name="sound1" pluginspage="http://www.apple.com/quicktime/download/index.html">
</object>

...Ma ho optato per una soluzione un pò... diciamo, estrema; forse anche perchè il sitarello me lo permette (cioè, per quello che volevo fare io vien bene) : lascio i titoli dei brani nella pagina principale (che sono validate) e, chi vuole approfondire, ci clicca sopra aprendosi una bella finestra tipo pop-up ...

...Però interessa moltissimo anche a me trovare finalmente un codicillo che sia validato e crossbrowser...

Uh, tieni comunque presente che comunque non verrà validato nessun codice con all'interno il "width" e l' "height".

...il tuo codice, anche se non valido, secondo me è sufficientemente reattivo, perché si ciuccia l'<embed>, che funziona velocemente... (occhio che ti sei dimenticato di autochiuderlo con />), e solo poi entra in gioco l'<object>, che probabilmente manco viene calcolato...
Costringi il browser a caricare Quicktime... è anche vero che praticamente ce l'han tutti, e fai anche contenti gli utenti Mac...

Ma a parte <embed> e tutto ciò che c'è dentro, cos'è che non ti viene validato? Qualche parametro (ex. Showcontrols)?
width e height dentro un object non danno problemi di validazione (tant'è che il codice "semplice" che ho postato io è valido XTML 1.0 transitional)... Secondo me a te danno problemi solamente perché scritti in maiuscolo... :top:

Qui come vedo non si muove molto... Vabbè, un po' ci speravo.

Nel frattempo, sempre nell'ambito embedding video & co., inserisco una mini guida probabilmente ai più smanettoni assai inutile, per l'incorporamento W3C-valido dei video da YouTube attraverso il tag <iframe>.

Lo stesso YouTube offre un codice di incorporamento quasi-valido: supponendo di voler incorporare il video di identificativo ABCDEFGH123, per l'embedding YouTube offre il codice
<iframe width="640" height="360" src="http://www.youtube.com/embed/ABCDEFGH123" frameborder="0" allowfullscreen></iframe>
che a parte allowfullscreen (da togliere in quanto assolutamente inutile, dato che la visione a schermo intero c'è comunque) diventa W3C-valido.

Una cosa che effettivamente non sapevo è che molti dei parametri che utilizzavo per l'incorporamento tramite <object> (ora un disastro sui nuovi browser con utilizzo deprecato da YouTube/Google) esistono ancora, e vanno inseriti direttamente nell'URL.

Esempio: supponiamo di voler inserire l'autoplay, di non volere i video suggeriti a fine riproduzione e i controlli di riproduzione non visibili. Significa, in YouTubese, volere i parametri seguenti coi seguenti valori:
autoplay=1
rel=0
controls=0

(la lista completa dei parametri si trova QUI)

Ora basta sbatterli nell'URL nel modo seguente:

src="http://www.youtube.com/embed/ABCDEFGH123?autoplay=1&amp;rel=0&amp;controls=0"

Il tutto W3C-valido per HTML4/XHTML

http://chappaai.altervista.org/galactica/video-2.html

Citazione:

---

Originalmente inviato da acsocmel

http://chappaai.altervista.org/galactica/video-2.html

---

...che significa:

<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="xxx" height="yyy">
<param name="src" value="URL DEL VIDEO.mp4" />
<param name="controller" value="true" />
<param name="autoplay" value="true" />
<object type="video/mp4" data="URL DEL VIDEO.mp4" width="xxx" height="yyy">
<param name="controller" value="true" />
<param name="autoplay" value="true" />
<p>Your browser cannot display this content. Click <a href="URL DEL VIDEO.mp4">here</a> to download it.</p>
</object>
</object>

E' un codice valido e funzionante... Però un commentino secondo me sarebbe più istruttivo rispetto a guardati la sorgente pagina e copia quello... :tongue

Citazione:

---

One significant consequence of the OBJECT element's design is that it offers a mechanism for specifying alternate object renderings; each embedded OBJECT declaration may specify alternate content types. If a user agent cannot render the outermost OBJECT, it tries to render the contents, which may be another OBJECT element, etc.

---

tratto da http://www.w3.org/TR/html4/struct/objects.html#h-13.3.1 (1999)
che tradotto più o meno liberamente:
Se non si può rendere l'OBJECT più esterno, si cerca di rendere i contenuti, che può essere un altro elemento OBJECT, ecc
i browser dovrebber comportarsi in questa maniera da un sacco di anni

E infatti è sui browser nuovi (in particolare IE) che object viene letto con difficoltà... Almeno da quanto ho constatato io. Grazie comunque del commento.

IE purtroppo è sempre stato una piaga per chi crea siti, devi sempre aggiungere codice specializzato ad IE soltanto.

Dunque: ieri ho constatato che il buon codice che avevo come player audio su un sito, che con la sintassi dei due object "inscatolati" uno dentro l'altro (quello esterno per IE, con la sua classid richiamante Windows Media Player, e quello interno con l'attributo type e data per gli altri browser, sempre gestito con WMP) funzionava, anche se ultimamente a rilento, nel senso che la lettura del codice sembrava "piantarsi" per poi comunque portarsi a compimento, ORA HA DETTO CIAO!

Ho provato quindi il codice postato qualche riga sopra, chiamando in causa Quicktime, codice modificato solo in minima parte (per l'attributo type ho messo audio/mpeg o audio/x-mpeg essendo files mp3).

Risultato: non leggibile su Firefox, e in ogni caso non compare la porzione di codice che recita Your browser cannot display this content.
Sembra quindi che, almeno nel mio caso, la questione degli object in cascata, dove se quello esterno non viene renderizzato si passa a quello interno, e se non va neppure quello si può inserire un messaggio per eventualmente indirizzare al link diretto, non vada a buon fine.

Per ora, non ho trovato codice migliore di

Codice HTML:

---

<object width="xxx" height="yy" data="URL_DEL_FILE">
<param name="autoplay" value="true" />
<param name="autostart" value="true" />
<param name="src" value="URL_DEL_FILE" />
</object>

---

e davvero null'altro: se aggiungo l'attributo type mi frego sia FF che IE. Così invece non viene letto solo da IE9, e me la sono cavata con un commento condizionale. Non viene richiesta l'installazione di plugin aggiuntivi e infilando sia autoplay che autostart accontento un po' tutti (autoplay viene letto da Quicktime, ma mi serve autostart ad esempio per chi carica WMP).

Idee migliori (e funzionanti: deve riprodurre dei banalissimi MP3) sono assolutamente benvenute.

Citazione:

---

Originalmente inviato da australiafever

IE purtroppo è sempre stato una piaga per chi crea siti, devi sempre aggiungere codice specializzato ad IE soltanto.

---

Oppure creare un semplice controllo che nel caso in cui il sito venga aperto con IE riporti un simpatico messaggio del tipo: "Sarà meglio che ti installi un browser migliore" e redirecti in una pagina dove (almeno io) spiego con tanto amore perché scegliere altri browser.

:lol: