Vor kurzem hab ich mal ein Erklärbärvideo, das ich auf YT hoste, auf meiner Startseite eingebettet.
Das sieht zwar hübsch aus, aber es kostete sehr viel Ladezeit und die YT-Scripte arbeiteten sich auch halb tot.
Da Videos ja angeblich immer "wichtiger" werden für die Leute, muss man sich halt anpassen.
Ich habe jetzt eine Lösung gefunden, wie man so ein iframe-Video einfach und vor allem so einbetten kann, das es einem die Ladezeit nicht runterzieht:
Vorher:
<iframe src="//www.youtube.com/embed/U3BAv7w0wYE" class="note-video-clip" width="590" height="360" frameborder="0"></iframe>
Jetzt:
<!-- Include the CSS & JS.. (This could be direct from the package or bundled) -->
<link rel="stylesheet" href="catalog/view/theme/journal3/stylesheet/lite-yt-embed.css" />
<script src="catalog/view/theme/journal3/js/lite-yt-embed.js"></script>
<!-- Use the element. You may use it before the lite-yt-embed JS is executed. -->
<lite-youtube videoid="U3BAv7w0wYE" style="background-image: url('image/cache/catalog/mainpage/video.jpg');" playlabel="Play: Seidenhandel Haller Video"></lite-youtube>
Jetzt lädt erstmal nur das Vorschaubild video.jpg.
Es wird im Grunde nur ein Play-Button über das Bild gelegt. Klickt man auf das Bild, dann lädt und startet der Clip.
Gefunden habe ich die JS und CSS-Dateien hier (im Ordner src/): https://github.com/paulirish/lite-youtube-embed/tree/master
Mehr braucht man dazu nicht.
Beispiele und Erweiterungsmöglichkeiten sind auch aufgeführt.
Vorteile bzgl. der Ladezeiten dürften klar sein.
Außerdem kann man ein beliebiges Bild als Hintergrund nehmen^^