The desperate attempt of news websites to block ad-blockers

Lately news websites and major blogs have initiated coordinated initiatives to force their visitors to deactivate theit AdBlocker and shave down their throat their more and more intrusive and annoying ads.

The drum made a good summary of example of websites that did implement such adblocker detection and blocking, including the German news website Bild.de, or other famous names such as Forbes.com, ITV.com, Times.com or Wired.com. Each of them choosing a more or less nice way to tell you that you are a cheap visitor that they dislike very  much.

France was no exception and many websites implented similar techniques, as nearly one-third of French internet users run adblocker software, according to a survey published by research firm Ipsos.

The Good

LeMonde.fr went the educational way: the first time you click on an article, you get a notification inviting you to deactivate AdBlockPlus, explaining you that it helps the website generate reveue and keep free content, but you can skip that step and still go to the article.

The Bad and the Ugly

Where it becomes fun is when you start to look at how the ad blocker detection was poorly implemented on each website, with a combination of JavaScript and CSS code to hide the content of the article to the reader.

The bad – JavaScript

LesEchos.fr, a business news website, and lEquipe.fr, a sports news website, both implemeted a similar technique. They both use a JavaScript piece of code that will detect if an ad blocking software has been striping parts of the page, probably by inspecting the DOM after the page has loaded.

It does not take more that 10 seconds to block the blocker of your ad blocker by using your ad block with a custom rule, which is not to load any JavaScript from that domain. Here is how the filtering rule of AdBlockPlus was done for those 2 examples:

  • LesEchos.fr
@@||lesechos.fr^$script,third-party
  • lEquipe.fr
http://*.lequipe.fr/*.js

Result:

This slideshow requires JavaScript.

Not a very strong way of pissing of people to protect content: as the code is executed on the client side, it is very easy to deactivate it and enjoy the full content which has been sent to the client.

The ugly – CSS

The funniest and most creative way of blocking access to full articles was definitely proposed by LeFigaro.fr, a general information website who decided that blurring the article would show how much left was to read to motivate the client to deactivate his ad blocker. This was done by adding a piece of CSS code for the article paragraphs:

style="color: transparent; text-shadow: 0px 0px 6px rgb(0, 0, 0);"

Unfortunately, playing with CSS properties to blur the text is really foolish: there are tons of ways to deactivate this formatting, including:

  1. Right-click > Inspect Element > Modify the CSS style in the DOM (the geek way)
  2. View > Page Style > No Style (shows the page as plain text, not very sexy but works)
  3. Click on the Icon at the end of the address bar > Enter Reader View (the most elegant way to do it, thank you FireFox for nicely reformatting the text of my article to make it comfortable to read!)
  4. Press Ctrl+A with your keyboard to select all text of the page and make it immediately readable (the lazy way)

Here is  the result:

Conclusion

Trying to shove invading ads down your visitor’s throat is terrible user experience and shows the little consideration you have for your readers, should they have a paid subscription or not.

But doing it with such weak approaches it laughable and reveals the lack of understanding of how the Internet works today. AdBlockPlus can easily adjust their rules to circumvent those tricks (even Facebook had to re-engineer its ad code to beat them, and it is probably going to be temporary only).

Lastly, new open source tools are appearing to help you block ads at your network level to save bandwidth and improve your user’s experience. One of them is called Pi-Hole (ha-ha-ha) for Debian and designed to fit into a Raspberry Pi.

pi-hole

It basically implements a DNS server which will strip out all URLs related to ads, so very simple to deploy in your network. It also gives you nice statistics on the blocking performance of the solution. This could be an interesting way for an ISP to propose ad-blocking as a service “AdBaaS”, at network level, to enterprises.

dashboard-no-berry

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s