-
-
Notifications
You must be signed in to change notification settings - Fork 913
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Best of cookie banners blogpost (#330)
* add blogpost with canonical to wasp-lang.dev * Delete 2023-11-23-post.md
- Loading branch information
Showing
11 changed files
with
118 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file added
BIN
+1.23 MB
opensaas-sh/blog/public/cookie-banner-hackathon/285-3umaGH-gangnam.mp4
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file added
BIN
+2.66 MB
opensaas-sh/blog/public/cookie-banner-hackathon/302-fecony-whereda.mp4
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
--- | ||
interface Props { | ||
src: string; | ||
} | ||
const { src } = Astro.props; | ||
--- | ||
|
||
<video | ||
src={src} | ||
preload="true" | ||
autoplay | ||
muted | ||
controls | ||
loop | ||
> | ||
<track kind="captions"> | ||
</video> | ||
|
||
<style> | ||
.video-player { | ||
width: 100%; | ||
max-width: 800px; | ||
margin: 2rem auto; | ||
border-radius: 8px; | ||
} | ||
</style> |
This file was deleted.
Oops, something went wrong.
89 changes: 89 additions & 0 deletions
89
.../blog/src/content/docs/blog/2024-11-22-best-annoying-cookie-consent-banners.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,89 @@ | ||
--- | ||
title: We Made the Most Annoying Cookie Banners Ever | ||
date: 2024-11-22 | ||
tags: ["cookie consent", "saas", "sideproject", "hackathon"] | ||
image: "/cookie-consent/wheel.gif" | ||
canonical: "https://wasp-lang.dev/blog/2024/11/22/most-annoying-cookie-consent-banners" | ||
--- | ||
import VideoPlayer from '../../../components/VideoPlayer.astro'; | ||
|
||
## The Most Annoying Cookie Consent Banner Ever Hackathon | ||
|
||
We at Wasp just finished off a fun little [hackathon](https://docs.opensaas.sh/blog/2024-10-10-most-annoying-cookie-banner-contest/) where we asked our users to create the most annoying cookie consent banners they could think of (because cookie banners aren’t annoying enough already, right?). Then we let our community pick the winner in an elimination style tournament on [X/Twitter](https://x.com/wasp_lang). | ||
|
||
It was a lot of fun, and the submissions were really creative, so we thought we’d highlight some of our favorites for you, including the community chosen winner. Check ‘em out below. We hope they inspire you... to... not use them on your own sites. :) | ||
|
||
## The GDPR Quiz | ||
|
||
The General Data Protection Regulation (GDPR) is the EU's data privacy law that requires websites to get explicit consent from users before collecting their data through cookies. | ||
|
||
GDPR is _the reason_ we have cookie consent banners today. | ||
|
||
This submission by [Cam Blackwood](https://www.tiktok.com/@cameronblackwoodcode/) gets to the core of why cookie consent banners are annoying: they force users to make a decision about something they barely understand (or care about), based on a regulation they probably don't even know exists. | ||
|
||
Thanks for the reality check, Cam. | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/295-camblackwood.mp4" /> | ||
|
||
## Windows of Time | ||
|
||
Do you ever feel like cookie consent banners are UX design pattern from the past? Well, this submission by [Lazi](https://github.com/Lezzz) confirms that, by sending you through an operating system time machine to a past we'd all like to forget. | ||
|
||
Disturbing, yet oddly comforting. | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/300-lezzz-sound.mp4" /> | ||
|
||
## Find all the Cookies | ||
|
||
There are some sites that make rejecting cookies a real pain, as if you were trying to find a needle in a haystack, or as if you were looking at a Where's Waldo puzzle. | ||
|
||
This submission by [Fecony](https://github.com/fecony), Wasp community meme lord, is just that. We find it annoying and fun at the same time, but what we're not sure about is if it's even possible to find them all. | ||
|
||
Well played, Fecony. | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/302-fecony-whereda.mp4" /> | ||
|
||
## Fresh Batch of Cookies | ||
|
||
Most of us probably just smash the "accept" or "reject" button without even reading the fine print. But [Henry Boyd](https://github.com/henry-boyd) is a maniac and with his submission, you have to accept ALLLLL the cookies. | ||
|
||
And that's a whole lot of cookies. | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/296-henryboyd.mp4" /> | ||
|
||
## Cookie Management Application Process | ||
|
||
What's more annoying than cookie consent banners? Probably job applications. Well [Wardbox], community builder extraordinaire, combines the best (or worst) of both worlds to make the cookie mangament process even more tedious than you could imagine. | ||
|
||
Now all we have to do is wait for the rejection email. | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/286-wardbox.mp4" /> | ||
|
||
## Grand Prize Winner: Gangnam Style Beat | ||
|
||
Our community-chosen winner's submission pretty much speaks for itself. | ||
|
||
Make sure you turn on the sound for this one! | ||
|
||
🎤 _Eeeeh, sexy cookie. Op! op-op-op!_ 🎵 | ||
|
||
<VideoPlayer src="/cookie-banner-hackathon/285-3umaGH-gangnam.mp4" /> | ||
## And there you have it! | ||
|
||
Thanks to everyone who participated! We had a lot of fun looking at all the submissions and we're glad to see that the community is as creative (and annoying) as ever. | ||
|
||
And now for a quick PR announcement: | ||
|
||
At [Wasp](https://wasp.sh/) we're working hard to build a modern, open-source full-stack React/NodeJS framework. | ||
|
||
The easiest way to show your support is just to star the Wasp repo! 🐝 It helps us spread the word and motivates us to keep building. | ||
|
||
![https://dev-to-uploads.s3.amazonaws.com/uploads/articles/axqiv01tl1pha9ougp21.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/axqiv01tl1pha9ougp21.gif) | ||
|
||
<div className="cta"> | ||
<a href="https://github.com/wasp-lang/wasp" target="_blank" rel="noopener noreferrer"> | ||
⭐️ Star Wasp on GitHub 💪 | ||
</a> | ||
</div> | ||
|
||
Thanks for reading, and showing your support! |