The Venture Skills Blog

I have run an update to this post on my blog timnash.co.uk: Does Flash SEO still suck?

Nothing gets up the semantic web developer lobby noses more then the bane of their lives Flash. After spending months developing perfectly semantic well formed XML compliant HTML some upstart art herbet comes along and ruins their day by showing the boss his latest web site. No amounts of appeals about it won’t be searchable or accessible will help. The lure of flash is to great for many companies and while you may be saying its not accessible the boss is pointing to large corporate sites like Marks and Spencers and Starbucks are using it and ultimately you will loose the battle, but wait this story is not over the Arty farty herbert is a web designer and hasn’t got a clue what your talking about when you mention htaccess and so you end up having to actually launch this monstrous baby, sounding familiar?

Adobe Flash (formally Macromedia) is a great tool for developing highly artistic multimedia applications, it has the accessibility and searchability of a brick. If you are serious about getting organic rankings the only advice is stay away from Flash, I mean it stop reading this post it will not help!
Still here? You either failed to read my last sentence or are being forced into this satanic world so lets get on with trying to make flash searchable.

The partial page route

This is probably the most common use of Flash, a normal HTML page which has one or more flash elements embedded within the page, these items are slide shows or other “multimedia” elements. This is the least problematical way to use flash, as most of the page is searchable in such scenarios you can simply;

• Avoid placing text or limiting the placement of text within a Flash file
• Make sure navigation between pages is still possible without Flash
• For slideshows and similar make sure there is a static equivalent

So the damage of using a small amount of Flash is quite limited in many ways treat them like images, make sure you can navigate without them and that your keywords are in text not the Flash file.

Full page of Flash

With a full page site we have more of an issue we now have no framework to base our site around only a large binary blob this poses a few problems;

• No semantic information at all!
• Not accessible and therefore breaching most EU disability guidelines (those things again!) which can end up with your site getting a fine or being sued!
• Doesn’t help people without flash

The traditional way to get round this was to create a non Flash version of the site with it’s own structure on a separate page, which is fine and works well except those pesky search engines sent the traffic to the non html version of the site! Don’t get me wrong at least it gets visitors but there has to be some neater ways to get round this problem. Enter SWFObject a very neat Javascript class that allows us to use our html version on the same page as the flash version.

How does it work

It uses a technique similar to the way AJAX scripts handle on the fly messages, lets take a really simple example;

So in the above example we have a flash file called helloworld.swf I wonder what could be inside! the rest is pretty straight forward, when the page is launched the flash detection script is launched if Flash is discovered the html between the div tag are placed with the flash file. So non Flash enabled browsers and most search engine bots will see the HTML version our nice semantic optimised code, while the rest of the world will see the Flash file.

Now through SWFObject we have a great deal of granularity and control for example

<script type="text/javascript">
var so = new SWFObject("helloworld.swf", "helloworld", "400", "200", "8", "#000000"); so.write("flashcontent");
</script>
The 8 in this example refers to the version of Flash that is required so in this case version 8 or higher, earlier version simply degrade to the HTML. Simple and cool huh but wait I see problems ahead!

Multi page sites

So far we have covered including flash on a single page and as part of a html page, but we haven’t really discussed how to create multi page sites.
Of course the obvious thing to do is use the above technique on each page, and link between them, however you will find it difficult to create seamless transitions from one swf to the other. However if going down this route the answer is pretty simple we simply create page entry points within the movie and then pass a variable to the flash file from the embed object or our SWFObject file. To do this using the SWFObject you need to add the variable within the javascript;

<script type="text/javascript">
var so = new SWFObject("helloworld.swf", "helloworld", "400", "200", "8", "#336699"); so.write("flashcontent");
so.addVariable("myvariablename", "variable");
so.write("flashcontent");
</script>

Notice the so.write part this tells the javascript it has finished passing additional arguments (so goes at the end!) obviously the variable names and variables would work best when related to the page but that’s pretty much it.

Organising content the sensible way

By now you must have been thinking that it will take me for ever to organise all this data not to mention keeping it updated, well the obvious answer is to include the data and content of the page in a database and then access it through a third programming language by far the most common way to do this is using PHP/MySQL and Flash Kirupa has a great tutorial which will get you started and is well worth a read. You could of course use ASP or any other programming language, a more “semantic” way to do this would be to use some sort of XSLT transform but that’s well and truly outside the scope of this post.

Alternatives to SWFObject

Through out this article I have refered to SWFObject however a second class exists called Unobtrusive Flash Objects (UFO) built around the same concept and conceptually very similar to SWFObject there is not much between them so take your pick of which one you like and stick with it.

Summing up

Flash is the Devil and nothing we have done here will let a search engine crawl a Flash file, but we have provided a mechanism to have best of both worlds but at the cost of your sanity, even using PHP mysql backend the above is hard to maintain, we didn’t even cover using htaccess to create aliases maybe another post for another time? If your the web developer from the beginning I pity you and if you think I might have called you an arty farty person perhaps this gives you an idea of the headache you cause web developers! only joking, no flames please.
Update:I almost forgot the other useful tool SWFAddress provides some useful deep linking features to flash and a way to integrate with the back and forward button on the browser, it works on top of the SWFObject.

All our Posts are audio subscribed for more information see here, and to access the podcast feed here

This blog is moving soon, make sure you move with us by using our Feedburner RSS feed, if you have used the autodiscovery button in your browser you may need to swap feeds, simply delete the old feed and add, http://feeds.feedburner.com/VentureSkills For a more detailed explanation on feeds and recieving our content in various formats click here