| AdSense publishers know, above all, that if website | | | | in the top left corner of a web page. |
| visitors can't see their ads then they can't click on | | | | Why Use CSS? |
| them either. When it comes to placing AdSense ad | | | | There are many benefits to using CSS for the |
| blocks or link units, there are an infinite number of | | | | positioning of ad units, including: |
| variations possible, but did you know that some have | | | | - Faster page load times -- CSS stylesheet files can |
| been proven to be more effective at converting the | | | | be cached by web browsers so the same files |
| visitor into a clicker? | | | | referenced by multiple pages don't need to be |
| Being able to convert more clickers ultimately means | | | | downloaded repeatedly as the local copies can be |
| greater earnings from the same amount of traffic. | | | | used instead. |
| Extensive tests have proven that certain areas of a | | | | - Easier website maintenance -- the appearance of |
| webpage receive more viewing time than others. It | | | | each webpage that references a stylesheet can be |
| can be shown that with all else being equal, the | | | | changed by modifying the stylesheet alone. If every |
| likelihood of a click conversion is proportional to the | | | | webpage of a website uses the same stylesheet |
| amount of exposure to a particular ad block. So it | | | | then changing it would allow you to make site-wide |
| makes sense to try and keep ads in the visitor's field | | | | changes from a centralised file. |
| of vision, particularly in the most popular areas of a | | | | - Separating presentation from the logic of a |
| webpage known as the hotspots. | | | | webpage by means of an external stylesheet allows |
| Google is known for supporting AdSense publishers. | | | | a designer to work on the appearance, whilst a |
| This isn't surprising when you consider that they | | | | programmer works on the functionality without their |
| want to provide the best performance for their | | | | being any conflict between the two. |
| advertisers as well as making as much profit as | | | | Floating, Embedded Ad Blocks |
| possible from their own cut of each ad click. To this | | | | More specifically, CSS can be used to implement one |
| end, Google have provided AdSense publishers with a | | | | of the more effective ad placements much easier |
| 'heat map' that shows where these visual hotspots | | | | than using older techniques involving tables. In order |
| are located. | | | | to embed an ad block within the body of a piece of |
| When it comes to positioning ad units on a page, | | | | content, simply wrap the AdSense code with SPAN |
| CSS comes into its own. Developed for the control | | | | tags and apply a float style e.g. |
| of presentation, CSS can reduce the amount of work | | | | AdSense code here |
| you have to do in order to implement some of the | | | | Content here |
| ad placements suggested by the heat map. In | | | | This snippet of code is all that's needed to float an |
| particular, the two ad units that I've found to be | | | | AdSense block within a body of content. The |
| most effective are the rectangular blocks when in a | | | | content automatically wraps itself around the ad |
| floating position within an article body and the link | | | | block with a margin of 10 pixels to keep the two |
| units placed where navigation links are usually found -- | | | | from crashing. |