The first AdSense ad that appears on your site is important. Why? Because it has the highest earning potential. The highest bidding ads are displayed inside whatever ad is rendered first. If you’re using multiple AdSense banners on a page then this is a common concern. Especially when you have ads showing up first in a leftside bar or top ad spot (before your body ads where most people see CTR is the highest).
A Worse Ad Setup Scenario:
Another scenario that makes it worse is if you utilize a leftisde ad, top ad, and then have a body/content ad. Its well known that most sites produce their highest click thru rates on ads in the body of their content. With that assumption, we want to get the biggest bang for our buck!
The Old Work-A-Round Method:
If you remember my post way back when about Multiple AdSense Banners That Could Cost You Money, it follows along the same issue. While you are putting the top paying ads in the highest clicked areas, you’re also sacrificing the ability to place any ads before that.
Not anymore! Now you have an option even if you don’t use a the hip new CSS designs and styles. Of course you’ll need to use CSS to do this trick but now you might have another reason to start learning it for your future redesign, right?
CSS Trick For More Income From First Place Positioning:
To get started, the first thing you’ll need to do is place a DIV tag just below your Body tag to ensure its the first ad that your browser comes into contact with. Also place your unique adsense code inside the div (see below). This doesn’t mean it will necessarily appear first, but it is recognized as such because it comes up in the source code first. CSS is great like that.
INSERT YOUR ADSENSE CODE HERE
This next part is difficult to help everyone at once with because every site is unique. Add this CSS code in your style sheet and do some trial and error with the left, right, top, and bottom attributes to position the ad properly. Change the height/width as needed depending on the ad that you’re trying to place in.
If you’re not using a style sheet wrap the above code inside the following tag and place it all within the head of your html document:
INSERT CSS CODE ABOVE HERE
You’re going to have the hardest time getting this to work in liquid layouts with pixels. In that case you might want to switch to em’s or percentages to match the length of change needed every time the browser window is adjusted. You may also want to use relative instead of absolute positioning depending on your existing setup. See the description of those below and choose which applies best to you.
Relative VS Absolute Alignment:
Relative – This moves an element relative to its normal position, so “left:20px” adds 20 pixels to the element’s left position no matter what starting container its in.
Absolute – This specifies coordinates relative to its containing block. If you had a div block inside another div block that was already centered and 800px width specified. Then adding left:20px would start a 20 pixel bump at the beginning of the box that is 800px wide and centered versus starting on the far left margin of the browser window.
Placeholder your Absolute Positions With A Separate Div:
If you use absolute positioning you will NEED to create the white space area for the ad manually. So you can shove your div at the very top of your page, but you cannot float (allows the text to wrap) AND position:absolute at the same time. Create a space in your template by doing something like this wherever you’re positioning you’re ad. Also be sure the content is not going to change and therefore push that div down in any case. Otherwise your manual alignment of the absolute positioning will be skewed:
<div style=”width:468; height:60″></div>
- Moving the DIV code into an existing container or wrapper div might be best assuming no other ad code will show up before it.
- Keep in mind the place that spot that your ad is being positioned into. You may have to make some adjustments to existing code where its being inserted
You may also want to combine the strategy mentioned here with Ways To Optimize Google AdSense – Blending Content Ads.
Any Value To Learning CSS?
This strategy is more intermediate and you may need help if you’re not familiar with CSS. Try spending some time playing with it, posting to forms, or commenting here if you’re spending hours trying to get it to work. Your best bet would be to pick up a CSS book or Google for some basic CSS tutorials. CSS is easy enough that it can be learned in an afternoon. However it also has quirks about it that you’ll need to learn by playing with it yourself. If you ever plan to do web design work, its more then essential these days as browsers are only growing their use of it as a standard.
Entrupeners, Subscribe for the lastest tools, tips, and tutorials.