Wanting to get the new ClientTax Cloud App out as a Minimun Viable Product I thought I would start a Google Adwords campaign. For this I needed a landing site which would explain the product and also serve as a link to the application in the Cloud. Why not write it in Silverlight too, especially as my ASP.NET/HTML skills were a bit rusty? (why do those divs never go where you want them?)
I wrote email alerts to monitor user behaviour. Hmm.. it seemed that there were some wasted clicks from people not having the Silverlight plugin and not wanting to install it there and then, but the majority seemed to get through okay.
It was a bit of a shock a few says later when all my Google Ads where marked “Site Suspended”. I also received an email which told me I was guilty of violating Google’s “bridge policy”. I was sending users off to a linked site with minimal content on my own site.
Huh? That didn’t sound right. Sure there was a link to the application but there was a fair amount of content on the landing site www.clienttax.co.uk itself. I phoned Google’s call centre. Perhaps I need to add more content to my site.
I added another quite lengthy page. No harm in that.
Then I was told that users were being re-directed to
This is a link to Microsoft’s prompt to install the plugin. Doh! I couldn’t believe Google could be so stupid. I wrote back explaining that this was just a prompt, and that if they were checking my site they would need to install Silverlight.
They replied that, sorry, well yes they had done that and sure, there was sufficient content. Sorry for the inconvenience. It would only take a day for the site to be re-examined. Then, later, sorry but it’s likely to take more than a day.
I thought I might as well use the time building an alternative ASP.NET site. This wasn’t as taxing as I first thought.
Now I wanted the users to have the following experience : If they had the plugin installed they would go straight to the Silverlight version, if they didn’t they would go to the alternative site without the option of installing Silverlight.
The standard html they gets generated on the Silverlight website default aspx page goes like this:
<div id="silverlightControlHost"> <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%"> <param name="source" value="ClientBin/Silverlight5TestApp.xap"/> <param name="onError" value="onSilverlightError" /> <param name="background" value="white" /> <param name="minRuntimeVersion" value="5.0.61118.0" /> <param name="autoUpgrade" value="true" /> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=5.0.61118.0" style="text-decoration:none"> <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/> </a> </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe></div>
The way this works is that the user only sees the <a href bit if Silverlight is not installed. I tried replacing the the <a href bit with a redirect to another page, but found that if I did this the user was redirected whether or not Silverlight was installed.
One can disable the plugin on IE by clicking on the options gear wheel and selecting “Manage Add-Ons”. In Chrome you enter about://plugins in the search bar.
One of the suggestions Microsoft makes is that you provide a background image of the Silverlight site so that users know what they are getting once Silverlight installed. I also added an additional button so that users could choose the non-Silverlight version.
This is how it looks:
Here is the html:
<div class="container" style="position: relative"> <img style="z-index: 32; left: 8px; position: relative;opacity: 0.4;filter: alpha(opacity=40); top: 0px;"� alt="bottom image" src="Images/slexperience.png"> <div style="z-index: 100; left: 63px; position: absolute; top: 38px; width: 417px"> <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=5.0.61118.0" style="border-color: transparent"> <img � src="http://go.microsoft.com/fwlink/?LinkId=161376"� alt="Get Microsoft Silverlight" style="border-style:none"/> </a> <INPUT TYPE="BUTTON"� VALUE="Click here for the non-Silverlight version" style="background-color: #304854;� width: 355px; height: 81px; font-size: small; color: #FFFFFF; margin-left: 40px;" ONCLICK="window.location.href='home.aspx'"> </div>