Youtube videos are just as much a part of websites as long blog posts that present and explain in detail specialized solutions to any problems. And only in the interaction of video and text do both formats become really good and really pick up all website visitors.
The problem: With the introduction of the GDPR, you as a website operator are responsible for compliance with strict legal regulations. Since the GDPR came into force (May 2018), there have been significant tightening (including the use of cookies and data exchange in the USA). Here it is quickly obvious that YouTube, as a service from the USA, causes a data transfer overseas.
YouTube Embeds in Webflow and the GDPR: Why is it a problem?
YouTube is a platform from the United States and therefore stores user and analytics data on servers that are also largely located in the United States. However, the GDPR, i.e. the data protection agreement of the EU states, requires very strict rules with regard to the collection, transfer and storage of personal data. If data is transferred to a country outside the EU, it must be checked whether the data protection level in this country is comparable to that of the EU.
For precisely this reason, the so-called Privacy Shield Agreement between the EU and the USA was ratified in 2015, which defines the USA as a country with appropriate data protection regulations. However, this agreement was overturned in 2020 due to access to data by US secret services.
Long Story Short: Since the Privacy Shield Agreement was overturned, data transfer to the USA was only permitted with the prior consent of a user. And this is exactly where it explains why YouTube videos should only be uploaded to a website with prior consent.
Why use an overlay solution for videos?
If you are completely honest, the solution without an overlay would be the one with the best user experience: videos are loaded directly and website visitors can watch the video directly and without detours.
Since this is only possible to a limited extent, overlay solutions are recommended. Here, video embeds are blocked until a website visitor has given their consent to the data exchange and only then uploaded to the website.
Most popular cookie consent tools offer some type of overlay solution. The problem here: These are usually not customizable and, to say the least, look as if they were designed for the web in 2005.
Our solution: 100% Webflow native YouTube overlay and directly fully responsive in a 16:9 ratio
For this reason, it was clear to us that we needed a solution that is 100% configurable in the Webflow Designer and can therefore be 100% individually adapted to the respective website. After all, it can't be that you put weeks of work into the design and the pixel-perfect implementation in Webflow and the appearance of your page is then ruined by an automatically generated overlay without styling options.
The VE Resources overlay comes straight with the following features:
- 100% responsiveness
- 100% Customizable directly in Webflow
- Works for single but also for multiple videos on your whole website
- You can also pull text, thumbnails and video URLs directly from your CMS
If that is what you are searching for, you are in the right place. To use the overlay-solution just clone this project and paste the (copy me) youtube-overlay_component-wrapper in your project wherever you want the video to appear.
Now, jump into the youtube-overlay_video-embed and paste your video URL after the 'src=' and between the two ' " '. You don't have to edit anything else.
The final step is to copy the custom code from the page settings (not site settings) and paste it in your page's <body>. That's it. As simple as it gets.
Update 07/2023: New data protection agreement and changes in data protection requirements
In July 2023, the EU passed the new data protection agreement with the USA and thus declared the USA again (temporarily) as a safe third country for data export. Many companies can therefore breathe a sigh of relief and start using tools from the USA that are somewhat more carefree. The problem: The Austrian lawyer Max Schrems, who also overturned the last agreement before the ECJ, is already announcing another lawsuit against the new agreement. Therefore, we recommend that you have your own website and the tools used individually checked by specialized lawyers at any time, in order to be prepared for further changes in the future.
*We are not lawyers and only pass on information to the best of our knowledge and belief. Please conduct extensive research on legal issues and always consult a specialized lawyer if anything is unclear.