« back to blog Archive for July, 2008

Is your Website a Needle in a Haystack?

Imagine your website is a shop in the world’s biggest shopping centre and everyday thousands of people breeze straight past it without coming in because you’ve gone and left a ‘closed’ sign in the window. Now imagine that you don’t know that the ‘closed’ sign is there. Would you be surprised that no one came in?

Not understanding the importance of a well designed, well optimized website in this consumer ‘click’ era is as excusable as being the son of a British fascist leader who enjoys dressing up in German military uniform and wonders what all the fuss is about.

Whether your website is a provider of information, goods, entertainment or services, there are a number of online marketing tactics you can employ to greatly increase your traffic. Hiring an expert is an option but with the investment of your own time, you can literally save thousands of pounds in applying something that is no longer becoming a choice but an unavoidable prerequisite of successful online trading.

Here is a basic list of SEO (search engine optimisation), usability and online marketing P&A’s (problems and answers) that can be applied to any online website, whatever its intended purpose.

Read the rest of this entry »

IE666

All web developers could bond on the tedium of supporting IE6. There’s nothing like designing in FireFox, the couple of fixes for IE7 and switching to IE6 only to see complete mayhem. All your pngs have light blue backgrounds, the javascript crashes the whole browser every other load and the layout, well it isn’t layed out anymore. There are campaigns to Save A Developer and Stop IE6, a million blog posts about giving up on IE6 completely (some high profile people actually have) and idiots that start posts with “I’m a webmaster. I hate IE6. Period.”

The problem is, we don’t have a choice. It’s hard to grasp but less than 1% of the people using the internet know what IE6 is and yet 40% of them are using it. Sticking a modal pop-up over your site isn’t going to get these people to update their browser. If for some reason you didn’t support IE6 people won’t think “Oh, what a terrible browser I’ve got”. They’ll either think that your website is broken or, even worse, that it’s broken their computer. And you’ll lose 40% of your potential users just like that.

Of all the reasons that people use IE6, none will go away. They either have to use it (at work), dislike change (click “no” to every update dialog) or don’t know what they’re doing (parents). We’ll just have to wait this out and while we’re waiting, here’s a few things to help:

  • Reset your html. The default rendering of many of IE6s elements differs greatly from modern browsers (it is 7 years old after all). Resetting your CSS will give you a level playing field to start off with.
  • Use conditional comments. If all those hacks start targeting other browsers in the future you’re going to be in a lot of trouble. Conditional comments will only ever target the one browser and give you one place to store all your IE6/7 changes.
  • Production with IE6 in mind. With a complicated design, many uses of the IE6 png fix on one page can lead to slow rendering times. Chop up your designs with this in mind and leave the background in.

Of course by the time IE6 has gone, we’ll all be whinging about IE7 not supporting anything we want.

Communicating between panels in eyeblaster

On our recent push-down banner for The Dominion Plaza development, we came to a slight stumbling block in communicating between each panel to synchronise the animation. The documentation was slightly patchy so here’s a basic rundown of how we achieved this effect on the eyeblaster platform.

Eyeblaster have a “SyncAds” component that uses the LocalConnection class to communicate between your panels – or ads on the same page – and allows you to run functions. As LocalConnection isn’t available to you on the eyeblaster platform, this proxy class is your best bet.

Usage is relatively simple: register a connection, create a listener to find the panel’s connection and execute the function on the panel when it loads. For the steps below the banner is the “sender” and the panel is the “receiver”. This effect can be used to great effect with multiple ads on the page.

First off, place your SyncAds component in the second frame of your banner (and your panel) and give it an instance name – I’ve called mine “syncAd_mc”. Create a function in the root, first frame of the overlay/push-down panel to handle the data passed from the banner. For this simple example we’re simply passing a frame number to move to, but you’d probably want to do more than this.

function gotoFrame(iFrame:Number) {
	gotoAndPlay(iFrame);
}

And in frame 2 of your panel:

syncAd_mc.openConnection("panel");

You can see that we always have to open a connection with the openConnection method of the syncAds component. This is required before any communication can be made between panels.

Now, on the rollover event of your banner, use the findConnection method of your SyncAds component to listen for the panel opening (there will be a delay before the panel opens depending on connection speed etc. of the user).

syncAd_mc.openConnection("banner");
clickthrough.onRollOver = function() {
	syncAd_mc.findConnection("panel");
}
syncAd_mc.onConnectionFound = function() {
	syncAd_mc.callConnection("panel", "gotoFrame", _currentframe);
}

The onConnectionFound event handler is called when the panel has loaded and the function “gotoFrame” is called, passing the currentframe of the banner.

It’s pretty easy when you get down to it!