How to block Adblock
It's DRM 2.0, baby!
I totally abhor all the recent ranting on how Adblock is going to destroy the online economy so I've written them some code. They can be obnoxious about the way people view their sites and block them or they can get on with things. What I've written is technically DRM 2.0. Please don't hate me.
I totally abhor all the recent ranting on how Adblock is going to destroy the online economy. People left right and centre have been whining on and on and on about how these freeloaders t'k ouwr jawbs rob the pants off any website owner who stands still long enough.
I'm yet to see one post from somebody that sounds like they know how web pages work, let alone how their adverts work. Perhaps it's because the things I read are written by rednecks who want to ban Firefox completely. At least he was hacked. Karma's a bitch, aint it?!
No matter — I'm here and I DO know how web pages work. I even know how advert code works. To top it off, I've got a fairly damned good idea on how Adblock works. I'm no expert in each area but I'd like to say I know what I'm on about especially when I say: if content providers really wanted to stop people blocking adverts, they could.
It's so comically easy to block Adblock users, a four year old chimpanzee could do it.
Before I walk you through the code and how it all works I'll explain why I'm writing this. I'm a Firefox and Adblock user. The two combined have made my online life joyous. I can read content without being distracted every two seconds by irrelevant adverts for things I wouldn't buy. If I want to support a site for what it's doing, I donate money or time to them.
I'm also a content provider. I do stick ads on some of my pages but I'm not out to rape every visitor in their face. I don't mind if people block my adverts. It's their connection. Their experience. As long as they get the most out of it, I'm happy. Anyway. Let's get to some code.
Blocking Adblock
We start off with our advert code. Most designers nest their code in a positioning element like a <div>. Have a butchers at the following code to see what I'm on about:
<div class="myTestAd" style=" text-align:center;margin:10px">
<!-- advert code goes here -->
</div>
In place of the comment there is advert code. This is usually a JavaScript link off to the advertising agency's website. In the case of Google AdSense, it's a link off to http://pagead2.googlesyndication.com/pagead/show_ads.js. This script generates the HTML to be displayed on the page inside an iframe. In layman's' terms, an iframe is effectively a web page nested inside a page. This allows Google, in this case, to display their advert to the end user.
So what ends up being rendered is an iframe inside our div. If Adblock is introduced into the equation, the following rule nukes the advert: #*(src*=http://pagead2.)
This is a CSS-selector-based rule that hides any output whose source points to any address beginning with http://pagead2. so the iframe whose source URL does begin with that, is hidden. Not blocked. The JavaScript code still runs but the output is hidden.
Therefore using another chunk of JavaScript at page-level, we can quickly see if the advert has been blocked with this rule. How? We just query the height of the output iframe. If it equals zero, it has been mushed otherwise everything is fine. To do this check we need to call upon the mystic powers of the Document-Object Model but because I'm lazy like that, I'm using the very excellent MooTools. Here is all the JavaScript we need to detect and alert the user they're blocking adverts:
Window.onDomReady(TestPage);
function TestPage() {
if ($E(".myTestAd iframe").clientHeight == 0)
alert("You are blocking my beautiful adverts, you swine!");
}
I meant it. A chimp could come up with that. The Window.onDomReady part is a MooTools function that only executes the code when the page is ready to be tested. That is the only nearly-complex thing about it.
Check out the test page
This version just pops up a message box, calls the user a swine and leaves them be but if people wanted to get really obnoxious about their adverts, they could redirect them, blocking them outright.
Can't you just block Adblock-blockers?
Of course.
Just as Adblock can detect the advert code, there could easily be code to detect Adblock-blocking code. I fear if we ever get into that cat-and-mouse game, we're in for a bumpy ride where, ultimately, nobody wins. Agencies will update their code, a million open source people will update the Adblock definitions — ad infinitum.
But it should be important for content providers to recognise now that if their content is on the open internet, it is public. People are and should be allowed to do what they like with the content for personal use. You don't get to overrule my decision to chose what my eyes see. If you try, I'll take my eyes elsewhere.
So isn't this DRM 2.0?
You could argue that placing checks on pages and preventing people who block advertising is managing what the user is allowed to do with the content (rights management). This is not something I believe is healthy for any medium, least of all the web. Restricting use restricts quality and usefulness.
So say it is DRM, and I implement this on a website, redirecting people to a block page, telling them to disable their advert blocker, does that mean my media, my webpage is protected by the infamous Digital Millennium Copyright Act (DMCA)? According to the DMCA it is illegal to provide tools that circumvent DRM — therefore making Adblock-blocker-blockers illegal.
Let's piss all over that fair-use clause one more time. America truly is a scary place at times...
Don't just sit there like a lemon! Reply!
Got something to say? Now's the time to share it with the author and everybody else that reads this posting! Lemons need not apply.