Blog by Jon Bishop - Understanding the Interactive Web

More About Me...

Jonathan Bishop is the Technical Media Specialist at Magicomm, LLC in Amesbury, MA. He specializes in the understanding and developing of web 2.0 technologies.

Archive: SWFObject

SEO and Flash

Can search engines read flash? A lot of people think that because flash is a program running on a website, it cannot be read by search engines. This is true to some extant however that does not mean there aren’t methods to make your flash movies Search Engine friendly. In fact Google CAN index your flash movies. In “Google Can Now Index . . . Flash!An Interview with Michael Marshall by Robin Nobles” (here), they discuss how Google indexes your flash movie and different things the author can do to help the process.

There are also other methods you can use if you want to be sure all search engines are indexing your flash movie. I use SWFobject. Here’s a brief explanation of how it can be used with some examples.

So first thing you need to do is upload swfobject.js to your website and link it in your header somewhere:

<script type="text/javascript" src="swfobject.js"></script>

Then you need to create a div tag with all the default contents of the flash movie. What your going to do is over right all of the data inside of that div tag when you load your flash movie.

[-]?View Code ACTIONSCRIPT
<div id="flashcontent">
This is what the search engines will read
</div>
<script type="text/javascript">
// <![CDATA[
var so = new SWFObject("mymovie.swf", "sotester", "600", "400", "9", "#FFFFFF");
so.write("flashcontent");
// ]]>
</script>

View Live Tutorial

And your done! So here’s the result:
Flash

And here’s what you see if you don’t have javascript or Flash Player:
No-Flash

And here’s what the search engines see:
SEO

Not too shabby.

The cool thing about all of this is the code is valid HTML and XHTML 1.0. There are also a bunch of other cool features with swfobject so explore their website and have some fun.

Now there has been some discussion on whether or not the content in the div tag that is being overwritten might be looked at as spam by Google at some point. So far it hasn’t been a problem and as long as developers don’t abuse this we should be good well into the future.

So go off and have fun with flash. Make many websites and flash intros to your hearts content (if your into that sorta thing). The future of flash looks brighter every day.

Flash in the future

People are starting to steer away from using flash in their websites and I think this is STUPID. We’re in the middle of an information revolution and Flash is one of our more advanced tools for making this happen. I think websites should use flash, as long as they do it right.

First off, people believe that flash is SEO unfriendly. Let me clarify, it’s flash developers who make their flash SEO unfriendly. Their are multiple ways to make entire websites in flash and Search engines can and will index them accordingly. One way of doing this is by using Geoff Stearns’ swfObject javascript. You just link to the main javascript file in the page head, and then call the function at the point on the page where you want your Flash movie to replace the default content. It makes it so users who don’t have Flash never even have to know that they’re missing something. Of course you have to make sure you have the content both on your site and in the flash movie.

Another method is by just loading the content from a separate XML. Voila, now Google can index your site.

So here is my extra two cents about the future of flash. I believe developers need to start using flash to its full interactive capabilities. By engaging the user you are more likely to entertain their presence on your site for longer and increase the productivity of your site. This can be done with interactive calendars, appointment booking systems, forums and blogging tools, Content Management Systems and whatever else your mind can conceive. The idea is to take everyday tools in life or software on your desktop and make them accessible online from anywhere via your website.

Another method of engagement, and sometimes a little harder to pull off, is personalization. Maybe a non intrusive way of using flash to make the website “Theirs”. This is is being used more and more in the marketing world and can open many doors to client/company relations. For example you can display text dynamically in your flash movie according to the date/time, the users location, or even their name. You could take it farther if somehow you could get information about the user before they even came to your site. Maybe you had them fill out a discrete form on one page to access private content, then on another page the possibilities are endless.

I guess people have been doing these things for awhile i just believe they haven’t been done right or creative enough. Engage your user and give your site functionality. Surprise them with what your site can do that others cant. PUSH FLASH TO ITS LIMITS. I don’t mean kill the users CPU. I mean be clever. Their was a pretty cool book put out awhile ago by O-Reilly called Flash Hacks that kind of gave me a glimpse into how flash can be manipulated to do cooler things. If you haven’t already, also look into AMFPHP, SWFObject and SWFAddress. All will make your flash experience 10 times better.

So that’s all i have to say about that for now. Ill be the guy with the personalized flash logo.

Top 5 Coolest Tricks in Flash

These are some of my favorite tricks Ive learned throughout the years in flash. Granted Ive never had a use for some of them and others only kinda half work. Nonetheless i think they’re pretty cool do here it goes.

1)Right Click:

[-]?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
 this.onEnterFrame = function(){
 
if (ASnative(800, 2)(1)){
 
/// Right click has been executed
 
}
 
}

So this is cool and everything however there is no guarantee future flash versions will support this because ASnative() is undocumented. However I have found this code useful if I was ever trying to detect whether the left mouse button is being held down. Just change the 1 to a 2. Oh and if you change it to a 4 it detect middle click…. whoda thunk.

2) Smoke effect:
This ones kinda easy. There is this method: http://www.toxiclab.org/tutorial.asp?ID=105
Basically i just use versions of that method minus the use of flash’s built in blur filter. It’s alot easier to just use a PNG thats alpha’d down to like 33% and have a couple of those moving over each other. This is what i got: http://www.lawjik.net/bishop/smoke.html

3) Transparent Background:

OK this one is kinda cool:
http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_14201

Ive never found a use for this but Ive def seen plenty of ads made like this. Im pretty sure not all browsers support this one tho so it might not be the best thing in the world to use. I think Kirupa.com goes into more detail about it somewhere.

4) AMFPHP:
This is prob my favorite. This makes flash remoting sooooo easy. All you have to do is learn how to write up Object Oriented PHP scripts and flash can work with them instantly. I’ve used this for working with databases mostly, MySQL, but also for e-mail scripts, and other random functions. Best part is that its fast, and getting faster. The original developer gave up on it for personal reasons but its following has taken over and it continues to grow.
Check it out: http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_14201

5) SWFObject:
Ya I know i said coolest tricks IN flash but, come on, this is awesome. Its even better when u mix it with SWFAddress. Check them out. Basically swfobject gets rid of that whole “click to activate object” thing. It also lets you perform browser testing and the flash version. Swfaddress is just as cool. It makes it so your flash movie works with the back, forward, and refresh buttons on the browser.

So there it is. My favorites. I know some aren’t as useful as others but oh well they’re cool.

MYSERVICES

MYLISTINGS

Recent Readers. These are the cool and trendy people that reads my blog!Recent Readers

BlogSwap3Halloween PartyKayleigh's Pumpkindropdownfacebook_downMy social|median shirt12