YouTube-Videos: muted autoplay (Stummschaltung)

Bewegtbilder steigern das Involvement mit der Website und die Klickrate. Was liegt also näher, als ein YouTube-Video einzubinden und es onload direkt per "autoplay" starten zu lassen? Ganz einfach: Ungefragtes Gedudel führt zu massiven Abbruchraten. Also genau das Gegenteil dessen, was man erreichen will! Die Lösung für das Dilemma: Das Video zwar per "autoplay" starten lassen, aber per "mute" stummschalten. Den Ton kann der Nutzer selbst anschalten. Hier ein kleines Javascript, dass die iFrame-API von YouTube dafür nutzt.

Das folgende Skript startet den Film automatisch, sobald die Seite geladen ist und wiederholt das Video von da an in Endlosschleife (loop=1). e.target.mute(); stellt das Video stumm. 

 

<div id="youtube-container">
<script >src=">https://www.youtube.com/iframe_api"></script>
<script>
function onYouTubeIframeAPIReady() {
  var player;
  player = new YT.Player('youtube-container', {
    width: 440,                // width (Pixel)
    height: 248,               // height (Pixel)
    videoId: '...........',    // <= Video ID
    playerVars: {
      playlist: '...........', // <= and Video ID here
      autoplay: 1,             // auto-play?
      loop: 1,                 // loop constantly?
      controls: 1,             // show pause/play?
      showinfo: 0,             // show title?
      modestbranding: 1,       // youtube logo?
      fs: 0,                   // full screen?
      autohide: 1,             // hide controls?
      rel: 0,                  // related videos?
    },
    events: {
      onReady: function(e) {
        e.target.mute();
      }
}   
  });
}
</script>
</div>

Der Besucher kann die Lautstärke im Video manuell einstellen. Als Bonus könnte man den Ton per Javascript anschalten, wenn der User mit der Maus über's Video fährt, so wie es aktuell gängige Praxis für Anzeigen-Videos ist.