Content Blocking by CSS in Safari

ahknight writes "There's a nice summary of how to get various kinds of content, in this case ads, blocked from being displayed via a custom stylesheet you add to your browser. This is mainly for Gecko-based browsers and rather old news, but the good news is that it also appears to work in the ... umm ... latest version of Safari."

nice !

safari already was blocking quite efficiently those nasty popups, but with this I don't even need to edit my host file to avoid having the ad banners ! cool

Ad blocking Good

I'd prefer to see the ads if it keeps the sites I enjoy reading in business.

There's a limit

I didn't mind ads for a while, but when certain sites (ahem) started putting in those huge mega-ads that take up more than half my browser window, I had to start doing some ad blocking to make the web usable. It was either that or learn to
read
text
that
looks
like
this.

Tragedy of the commons and all that. The people whose ads are being blocked should get angry at the idiots who force us to block ads by making their ads so huge, obnoxious and badly-placed.

Stupid layout

The problem isn't so much the ads, rather it is the fact that the webmaster(baters) who create these sites set up their layouts assuming your screen is 800x600. Therefor, since the ads are 160 wide, and there are two of them (one on each side), that leaves 800-(2*160) = 400 (that's the sort of math these morons use) for the article.

So, if you are running a 1600x1200 window and larger fonts (anti-aliasing? I need no anti-aliasing!)
you
get
an
article
like
this .

If the morons would either

• use a "width=*" for the article
• Come to an agreement as to what class the actual article text would be

then there wouldn't be a problem - large browser users like me would either get an article that spans the available space (the width option) or could at least override the setting on the article text in our CSS (the common class option).

I've contacted several sites about this. For example, PBS (hosters of the Cringely articles) responded saying "Some people don't like long lines of text, so there!" (OK, then they can resize their windows to get the line length they want.)

Unfortunately, since every site uses a slightly different "width=", and since CSS does not allow you to say "width=[400..800]" or something like that, you have to have a seperate entry for each site, and when the webmaster(bater) changes the layout you have to update your CSS and restart your browser.

I do wish people would realise that HTML is about giving enough info to my browser to render the page, not about being pixel-exact.

Solves half the problem

This solves half the problem. The other half is that the ads are still loaded, just not displayed. I'm using a variant of the style sheet hack, along with Proxy Auto Config [schooner.com] to redirect requests to ad sites to a server that returns transparent gifs for every request. It works much like JunkBuster, only it's integrated with the browser, so you don't have the side effects of using a proxy for every request (e.g., it's not any slower).

Now I hardly ever see ads, and the ads I don't see never get loaded in the first place, saving my bandwidth. Of course, that means that the web sites I visit never record a hits on their ad servers from me, whereas using the style sheet alone is completely transparent to the server.

Oh, and both the Proxy Auto Config and the Style Sheet hacks should work just fine with most web browsers, not just Mozilla and Safari.

*cough*

anti-banner.css [aagh.net], and I don't assume you're using Mozilla. I'd be interested to hear if it works in other browsers (other than Opera/Mozilla/IE, that is), and in receiving instructions on how to use it in them.

The latest version of Safari?

Do you mean the one that has just appeared in Software Update - 1.0 Beta 2 (v73)?

Junkbuster?

I've been using Junkbuster to block ads for the past two years, but it's becoming pretty much ineffective since the blocklist [waldherr.org] is never updated.

Anyone know of a source for fresh blocklists, or a program that's updated more regularly? I'd prefer to keep it Junkbuster if possible.

by the way...

Apple released Safari beta 73 this morning via software update. Enjoy.

Privoxy

This CSS stylesheet doesn't really work that great. It only solves parts of the problem and doesn't really adress al of them. If you want a fairly complete privacy solution, take a look at Privoxy which some people have called : "junkbusters on speed". Yes, there is an OS X version and it works great with Safari.

http://www.privoxy.org/ [privoxy.org]

Ok, this works fairly well, but...

... what we really need is a way to block images with specific dimensions; most ads come in two specific sizes, the "wide narrow banner" and the "big fat box", both of which can be seen on Slashdot.

Blocks Flash ads!

For those not aware of this, it is possible to use this CSS method of blocking ads to block Flash advertisements .. arguably, the most annoying. Try something like so:

embed[type="application/x-shockwave-flash"][width= "468"][height="60"]

{
display: none !important;
visibility: hidden !important;
}

As you find Flash ads that aren't blocked, just add another entry for the size of ad you're seeing ... in my CSS, I have at least 8-10 such entries. Common sizes are:

• 468x60
• 728x90
• 120x600
• 336x280
• 300x250
• 180x150
• 240x400
• 468x240
• 120x600
• 160x600
• 336x280

hosts is still the easy way to go

open Directory Access.app and enable BSD Configuration files, get a good hosts file and pico /etc/hosts usually does fine for most of my content blocking needs. if i knew how to use vi i could probably cut a good four and half seconds off that.

OmniWeb blocks ads with no effort

For people with more money than energy, buy OmniWeb. I am way too lazy to do anything suggested here, OmniWeb does all my ad-blocking for me. And it is smarter about pop-ups than Safari, I see the pop-ups I need and not the ones I don't.