5545 sujets

Sémantique web et HTML

Impossible insérer vidéos Html5 dans page html

Bonjour,
Je m'arrache les cheveux,
Je souhaite insérer une video en divers formats afin qu'elle soit visibles sur tous les navigateurs et ordinateurs 'mac et PC".
Avant j'étais en vidéo FLV ou SWF mais les mac ne peuvent les Visionner.
En conséquence, sur les conseils de votre site, j'ai construit un fichier HTLM avec ce code :
________________________________
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>

<body>
<video width="700" height="720" controls="controls">
<source src="Eolienne1EtageAvecArrets_Son.mp4" type="video/mp4">
<source src="Eolienne1EtageAvecArrets_Son.webm" type="video/webm">
<source src="Eolienne1EtageAvecArrets_Son.ogv" type="video/ogg">
<P class="AlerteRougeSurlignee">
Votre navigateur ne prend pas en charge cette vidéo, veillez la visualiser Ici
</p>
</video>
</body>
</html>
________________________________

Mais le navigateur me précise Source Non valide voir lien ci-dessous.
http://www.eolprocess.com/essaisVideoMp4.html

J'ai également précisé dans le fichier .htaccess à la racine du site les lignes suivantes :
________________________________
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm

AddType audio/mpeg .mp3
AddType audio/mp4 .m4a
AddType audio/ogg .oga
AddType audio/webm .webma
AddType audio/wav .wav

SetEnvIfNoCase Request_URI \.(?:ogv|ogg|oga|m4v|mp4|m4a|mp3|wav|webma?|webmv)$ no-gzip dont-vary
________________________________

Rien n'y fait ça ne veut toujours pas fonctionner :

Pouvez-vous m'aider
Merci par avance
Modérateur
Bonjour,

Quand je suis le lien que vous indiquez je vois bien la vidéo sur l'éolienne verticale. Le format chargé par Firefox est celle en webm.
Modérateur
Chez moi ça ne fonctionne que sous Safari, mais pas sous Firefox et Chrome.

Par contre il prend le mp4, qui a un mauvais codec: Il faudrait l'encoder en H264 en non en MP4 Layer 2.

@greg chez toi il doit prendre le webm car tu dois avoir le codec installé.
Modifié par kustolovic (13 Feb 2018 - 10:28)
Modérateur
kustolovic a écrit :
@greg chez toi il doit prendre le webm car tu dois avoir le codec installé.

Je viens de vérifier, effectivement ! J'ai ce codec d'installé: Microsoft WebM MF VP8 Decoder Transform
Sur mon site, ce code fonctionne très bien, y compris sur Safari :

<video width="400" class="arrondie1" poster="Images/Mamoutou-K-C.jpg" controls="controls" preload="none">
  <source src="Videos/Exemples-Rue.mp4" type="video/mp4"/>
  <source src="Videos/Exemples-Rue.ogv" type="video/ogg"/>  
  Vous ne pouvez pas lire ces formats de vid&eacute;o ? Mettez &agrave; jour votre navigateur.

</video>


Je me suis laissé dire que si un iPad ne trouvait pas un fichier mp4 en premier, il n'allait pas plus loin. Je transcode mes vidéos avec Transmageddon, sous Linux. J'ai testé d'autres transcodeurs, mais celui-ci me donne des vidéos fluides.
Effectivement, il faut transcoder en H264.
A tout hasard, j'ai aussi ajouté, dans le html :

<meta http-equiv="Content-Type" content="video/mp4 .mp4" >
<meta http-equiv="Content-Type" content="video/mpeg .mpg" >
<meta http-equiv="Content-Type" content="video/.ogv" />
Je ne comprends rien a cette discution, tout marche parfaitement dans tout les cas d'aprés mes test Smiley confused .... Ah OUI comme tu le dit en HTML5 Smiley smile
donc :

<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Modifié par Christele (14 Feb 2018 - 16:44)
Sujet clos
Aller à