Highlighting Ads In Google Search Results

Google would never be evil, of course, but they would over the years make it harder and harder to tell ads from the organic search results. Under certain light and at certain screen angles, I can tell the ads from the organic results, but more often than not, I can’t.

If you did with your own site what Google does with its search results, you would be banned from AdSense. There was a time, when the ads had a nice colored background and stood out from the organic search results. These days, the background color is so close to the foreground color that on most monitors it is indistinguishable. The solution? Create a custom user stylesheet for each browser that let’s you force whatever background you want on the ads. Here’s how this looks in Chrome after updating the user stylesheet:

screenshot of Google search results
Chrome with user stylesheet to style Google Ads

These instructions are for Windows 7. Vista will be similar or the same, but in XP the data will be in a slightly different location. In all cases, you’ll have to substitute your actual username for [USERNAME]

Highlight Google Ads in Firefox

In Firefox, your user stylesheet is in C:\Users[USERNAME]\AppData\Roaming\Mozilla\Firefox\Profiles[DEFAULT PROFILE]\chrome\userContent.css

By default, neither the \chrome directory nor the userContent.css file exist. You’ll have to create them. Firefox has a feature that lets you specify a style rule for only a specific domain, so we’ll do that here and add the following code to userContent.css

@-moz-document domain(google.com) {
    div#center_col span#taw div#tads,
    div#rhscol div#rhs div#rhs_block,
    div#rhscol div#rhs div#rhs_block div.c
       {background-color: #7c7 !important;}

Note that Firefox has to be restarted for that code to take effect.

Highlight Google Ads in Chrome

Your Chrome user stylesheet will usually be at C:\Users[USERNAME]\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css. In your CSS file, insert the following lines:

div#center_col span#taw div#tads,
div#rhscol div#rhs div#rhs_block,
div#rhscol div#rhs div#rhs_block div.c
   {background-color: #7c7 !important;}

Note that I’ve used fairly specific selectors (for example #center_col #taw #tads) so that I won’t get too many false positives and mess up some other site that uses #tads as a selector.

5 Responses to “Highlighting Ads In Google Search Results”

  1. Happened upon this post doing an odd query. This is an interesting trick that I have to try. We use projectors at the office and set them as bright as possible and sure enough, we can’t see the ad backgrounds at all.

  2. Thanks for the CSS – both work like champs in their respective apps.

    I’ve been playing around with Fx and Tb profiles for a while, and I’ve come to a method of creating my own profiles in my own locations to make them far more accessible as well as easier to backup – so in the event of a format I don’t lose all of the info in either application.

    My newest trick is to use Junctions and Symbolic Links to keep things like layout, add-ons, etc. synced between multiple profiles. I already see that I can probably to the same for the userContent.css file in my Fx profiles, but I’m not sure about Chrome.

    Is there a way to make Chrome profiles in Chrome that allow me to selectthe location and such, thus allowing me to manage them (and then, perhaps, start using the same junctions and symbolic links to share files across profiles to consistency)?

  3. Thanks JLG – fairly brilliant using symbolic links. But sorry, no, I don’t know about how to select the location for such things in Chrome

  4. I had to update the code for chrome today:

    div#center_col span#taw div#tads,
    div#rhscol div#rhs div#rhs_block, #center_col .ads-container ,
    div#rhscol div#rhs div#rhs_block div.c
    {background-color: #7c7 !important;}

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>