My JavaScript book is out! Don't miss the opportunity to upgrade your beginner or average dev skills.

Sunday, February 08, 2009

Advertisement revolution? A first try for Android, iPhone, and PCs

Introduction


Nowadays, we read news about new libraries, technologies, etc etc, but there is an area in this Web 2.0 era which seems to be "stuck" since big G introduced AdSense: a new way to deliver advertisement, compatible with new devices such as Google Android and Apple iPhone.
Even if Google proposes AdSense for mobiles as well, we know that those simple text boxes do not cope properly with Android and iPhone innovative web browsers.
This is why I have though about a new way to show ads, unobtrusive, cross-browser, and in a way even funny, with less than 2Kb minified and gzipped code, library independent, with everything inside its own closure ;-)

Ad 2.0 Introduction


The iframe below perfectly represents my idea of mobile advertisement, idea that I will explain better a bit further down. Every 10 seconds, a little banner comes up at the bottom of the screen, and it persists for 2 seconds before it disappears. The number of bunners can be from 1 till unlimited, in this case, just 3.

The page above has been written by me and inspired by x.facebook layout and colors, one of the best mobile implementations I have ever seen so far.
You can surf the content of the above iframe with almost every XHTML 1.0 Compliant browser, included FireFox, Safari, Chrome, Internet Explorer, etc etc. but it is ideal for Google Android or Apple iPhone, whatever mode you are using (portrait or landscape) and with a fixed bottom ad that comes up every N seconds and shown for other N seconds, parameters that I could easily customize directly via url, as well as colors and banners (now simply fakes).

A new idea? Only for mobile!


What we miss so far for mobiles are CSS "position:fixed" in iPhone, solved via my ad 2.0 code, and an advertisement system able to appear and disappear with transparency effects and in a Web 2.0 Stylish way. After a couple of hours of neck-breaking, here I am with a football match alike advertisement, something that makes sense in Web 2.0 since the tendency leans towards not refreshing a page in order to rotate displayed banners (concept I introduced ages ago in packed.it project page, a site entirely based on Ajax and where AdSense content is not static).

So basically, since even Facebook with their Ads policy did not introduce a nice way to show some "interesting stuff", I asked myself: what could be the best way to introduce ads without annoying people, without being obtrusive with whatever library, easy to click on touch-screens, and without boring long texts/big spaces since in this mobile era pixels are truly precious?
The fixed bar is entirely a link, it is extremely easy to click with both iPhone and Android, while the advertisement concept is just this: can you sell something with a 32x32 icon plus a summary or a funny sentence able to capture mobile surfers attention? Then in this case, Ad 2.0 does half the work, thanks to its appearing/disappearing effect plus transparency and customizable colors, and the rest is up to your marketing ability ;-)

Here there's a static shot of Ad 2.0 script:


I know a lot of you are thinking: OMG! Advertisement even in my mobile? You are evil! ... well, it is just a simple idea but I am sure we will have ads in our mobile sites soon - so, in my opinion, it is just a matter of time, and the way to show it.

Any comment or suggestion will be more than appreciated, have a nice week.

P.S. Does anybody know how to contact some guy in Facebook?

4 comments:

EterniCode said...

OMG! Advertisement even in my mobile? You are evil! Haha, exactly what I was thinking.

I think it's an interesting ... um ... "solution" (that sounds like such a bad word for a new ad system!).

One problem I see is that the animation itself is visually obtrusive -- I'm happily reading a page, where the text is sitting still, and this ad slides up from the bottom. Being human, my eyes are instantly drawn to the motion on the page -- oh, it's just an ad. Now, where was I?...

I'm not sure how you would solve this problem; maybe making the ads always there and only using motion for switching them -- but that would get in the way, taking up precious pixels, and would still use eye-catching motion.

Or maybe eye-catching motion is what you would want for a ppc ad... :)

Andrea Giammarchi said...

obviously an ad has to be noticed. There are thousands of websites with ads as welcome :D
Others put big ads as soon as you pass over a link, others do other stuff, etc etc ... as eye catcher, this idea works perfectly but as is for every new stuff, initially unexpected, it could disturb more than I thought.
As summary, I do not think I will solve a feature :P

Thanks for the comment in any case. Regards

Beben Koben said...

awesome my friend^^

Android app developer said...

I lately came beyond your web-site and accept been account affluence of posts of yours. I aloof anticipation I'd add a quick animadversion and let you apperceive that you've got a actively nice weblog. I'll watch out for updates from you!