Geschrieben von:
Tech-Writer Thomas am 04.11.2024
Artikel teilen:
Aufrufe seit 5.11.2024
Gesamt: 137
Dieses Jahr: 137
Diesen Monat: 60
Diese Woche: 23
Heute: 6
Post Tags:
Das Einbinden von YouTube-Videos auf einer Homepage ist eine beliebte Methode, um Besucher auf ansprechende Weise zu informieren und Inhalte zu vermitteln. Doch oft wird dabei übersehen, dass solche Einbettungen auch datenschutzrechtliche Risiken bergen. Ohne entsprechende Vorkehrungen werden bereits beim Laden der Seite Daten der Nutzer, wie IP-Adresse oder Nutzungsverhalten, automatisch an YouTube bzw. Google übermittelt – selbst wenn das Video gar nicht abgespielt wird. Diese Datenübertragung erfolgt oft ohne ausdrückliche Zustimmung der Nutzer, was gegen die Datenschutz-Grundverordnung (DSGVO) verstoßen kann. Eine datenschutzkonforme Einbettung ist daher entscheidend, um die Privatsphäre der Nutzer zu schützen, rechtliche Vorgaben zu erfüllen und das Vertrauen in die Website zu stärken.
Copyright und Lizenz: Von "BlueFlexx-WebDesing" erstellte Grafik zum Artikel technische Integration eines YouTube-Video unter WordPress
Möglichkeiten
Um YouTube-Videos datenschutzkonform auf einer Website einzubinden, gibt es verschiedene Methoden, die die Privatsphäre der Nutzer respektieren und den Anforderungen der DSGVO entsprechen. Hier sind einige Optionen:
1. Zweiklick-Lösung mit Platzhalter
Bei der Zweiklick-Lösung wird zunächst nur ein Platzhalter oder ein Vorschaubild des Videos angezeigt, zusammen mit einem Hinweistext und einem Button („Video abspielen“). Erst nach dem Klick des Nutzers wird das YouTube-Video geladen und Daten an YouTube übertragen. Dies erfordert eine aktive Zustimmung der Nutzer und verhindert, dass YouTube direkt beim Seitenaufruf Informationen sammelt. Der Klick gilt dann als Einwilligung zur Datenübertragung.
- Vorteile: Einfache Umsetzung, keine Datenübertragung ohne Einwilligung.
- Nachteile: Zusätzlicher Klick für die Nutzer.
2. YouTube-nocookie.com verwenden
YouTube bietet eine spezielle Domain youtube-nocookie.com an, die den Tracking-Schutz verbessert. Dadurch werden keine Cookies direkt gesetzt, solange das Video nicht abgespielt wird. Es verhindert zwar nicht alle Datenübertragungen an YouTube, reduziert jedoch die Erfassung personenbezogener Daten beim initialen Laden.
- Vorteile: Weniger invasiv als die normale YouTube-Einbettung.
- Nachteile: Nur bedingt datenschutzkonform, da weiterhin Daten übertragen werden könnten.
3. Einsatz eines externen Content-Management-Tools (CMP)
Ein Content-Management-Tool (CMP) bietet eine umfassende Lösung für die Einwilligungsverwaltung auf Webseiten. Nutzer können beim Besuch der Seite über das CMP auswählen, ob sie ein eingebettetes YouTube-Video (und andere externe Inhalte) akzeptieren möchten. CMPs wie Usercentrics, Cookiebot oder Borlabs Cookie erlauben eine differenzierte Zustimmung und können so die Einbettung von Videos verwalten.
- Vorteile: Rechtlich umfassend abgesichert, Nutzer können explizit entscheiden.
- Nachteile: Höhere technische und teilweise finanzielle Anforderungen.
4. Selbst gehostete Videos oder alternative Video-Hosting-Dienste
Um den Datenschutz zu maximieren, können Videos auf dem eigenen Server oder auf datenschutzfreundlichen Video-Plattformen wie Vimeo (mit Datenschutzoption) oder PeerTube gehostet werden. Hierbei entfällt die Übertragung an Dritte, und es können Datenschutzbestimmungen vollständig kontrolliert werden.
- Vorteile: Maximale Kontrolle über Nutzerdaten, keine externen Datenübertragungen.
- Nachteile: Höhere Serverbelastung, kann technisch aufwändiger sein.
5. Einbettung mittels Overlay und expliziter Datenschutzerklärung
Eine einfache Methode ist es, ein Overlay mit einem kurzen Datenschutzhinweis und einer Einverständniserklärung über das Video zu legen. Nutzer klicken dann auf „Einverstanden“ oder „Video abspielen“, wodurch sie in die Datenübertragung einwilligen. Erst nach der Zustimmung wird das eigentliche Video geladen.
- Vorteile: Schnelle und einfache Lösung, keine Datenübertragung ohne Zustimmung.
- Nachteile: Weniger flexibel und nur für einfache Einbettungen geeignet.
Die Wahl der Methode hängt von den Anforderungen der Website, der Nutzerfreundlichkeit und den Datenschutzvorgaben ab. Die Zweiklick-Lösung und die Verwendung eines CMP sind oft die pragmatischsten und DSGVO-konformen Methoden, während das Hosten auf datenschutzfreundlichen Alternativen maximalen Datenschutz bietet.
Anleitung für 2-Klick-Lösung
Im Folgenden zeigen wir, wie eine 2-Klick-Lösung mit WordPress umgesetzt werden kann. Insbesondere wenn nur ein oder wenige YouTube-Videos auf der Homepage eingebunden werden sollen, ist kein separates Plugin erforderlich. Es wird einfach der entsprechende HTML-, CSS- und JavaScript-Code (siehe unten) auf der Homepage eingefügt und an wenigen Stellen (in roter Farbe) angepasst. Auch die Texte (in grüner Farbe) können noch individuell angepasst werden.
HTML
<div class="video-container" data-video-id="Youtube-Video-ID">
<div class="youtube-hint">
<img src="Link-zum-Youtube-Logo-oder-alternativen-Bild" alt="YouTube-Logo" class="youtube-icon">
<p>Durch das Abspielen des Videos akzeptieren Sie die Datenschutzbestimmungen von YouTube. Persönliche Daten könnten an YouTube übertragen werden.</p>
</div>
<button class="play-button">Video abspielen</button>
</div>
CSS
<style id='youtube-video-container'>
.video-container {
position: relative;
width: 100%;
max-width: 560px;
background-color: #ddd;
height: 315px;
text-align: center;
box-sizing: border-box;
}
.youtube-hint {
display: flex;
flex-direction: column;
align-items: center;
color: #333;
font-size: 16px;
margin-bottom: 10px;
}
.youtube-icon {
width: 150px;
height: auto;
margin: 20px;
}
.play-button {
font-size: 18px;
background-color: #c4302b;
color: #fff;
padding: 10px 20px;
border: none;
cursor: pointer;
}
</style>
Java-Script
<script>
document.addEventListener("DOMContentLoaded", function () {
var videoContainers = document.querySelectorAll('.video-container');
videoContainers.forEach(function (container) {
container.addEventListener('click', function () {
var videoId = container.getAttribute('data-video-id');
var iframe = document.createElement('iframe');
iframe.setAttribute('src', 'https://www.youtube-nocookie.com/embed/' + videoId + '?autoplay=1');
iframe.setAttribute('frameborder', '0');
iframe.setAttribute('allow', 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture');
iframe.setAttribute('allowfullscreen', 'true');
iframe.style.width = '100%';
iframe.style.height = '100%';
// Entferne Hinweistext und Button
container.innerHTML = '';
container.appendChild(iframe);
});
});
});
</script>
Dieser Code muss nur noch in die Homepage eingebunden werden. Bei WordPress mit dem Gutenberg-Editor geht das ganz einfach, indem der Code in den Gutenberg-Block " Individuelles HTML" eingefügt wird.
Bildunterschrift / Copyright und Lizenz: Individuelles-HTML-unter-WordPress.png
Nach dem Einbinden dieses Codes sieht die Vorschau wie im folgenden Bild aus. Erst wenn der Benutzer auf den Button klickt, wird die angegebene YouTube-ID per Java-Script aus dem Video-Container-DIV ausgelesen und das Video als iFrame geladen und angezeigt.
Bildunterschrift / Copyright und Lizenz: 2-Klick-Lösung für YouTube unter WordPress.png
Fazit
Das Thema Datenschutz beschäftigt Unternehmen und Privatpersonen gerade in Deutschland seit Jahren. Auch ich finde es wichtig, dass ein Grundmaß an Anonymität und Sicherheit gewahrt bleibt, dass man beim Surfen nicht überall seine Daten preisgeben muss. Hier ist die sogenannte 2-Klick-Lösung ein guter Kompromiss. Die persönlichen Daten werden erst dann an Youtube übermittelt, wenn sich der Besucher entscheidet, das Video anzuschauen.
Diese 2-Klick-Lösung ist natürlich nicht auf WordPress und YouTube beschränkt. Im Prinzip ist es möglich, sie in jede Art von Homepage zu integrieren. Es kommt nur darauf an, wie einfach oder schwierig es der Anbieter macht, individuellen HTML-, CSS- und Java-Script-Code einzufügen. Dieser Code kann angepasst und auch für andere externe Inhalte verwendet werden (z.B. Google Maps). Technisch weniger versierte Nutzer können sich gerne an uns wenden, um Unterstützung zu erhalten.
Impessum des Autor Kontakt zum Autor
Werbung