SWFAddress, SEO and the Flex Datagrid for Cut and Paste Coders

SWFAddress, SEO and the Flex Datagrid for Cut and Paste Coders:

This article shows you how to set up deep linking in your Flex application that can be seen by end users as well as search engines.

It’s a tutorial mainly for all of the other cut-and-pasters out there who don’t have the time or energy to truly learn how to create a proxy class for use with SWFAddress, and most likely aren’t programmers by trade.

---

Final Result Preview

Let’s take a look at the final result we will be working towards, notice how the browser bar reflects the title of the page, Beginning:

Download the Source files and use them as a reference while you read this tutorial.

---

Background

This is my first Flex tutorial, and one I can only write after stating the following caveat: I am really just a cut-and-paste coder, albeit one with nearly 10 years of AS1, AS2, and now AS3 experience, which has given me a pretty good comfort level with it. I do write a few functions, if-statements, vars, and things like that — but I’m more of a hackmeister than anything, which sometimes leads to creative coding, while other times leads to wasted time on things I haven’t read enough about before experimenting with!

Deep linking is about a lot more than just SEO; it’s about usability. I think a lot more about usability after having built an e-learning app. Now I notice when a Flex or Flash app backs you completely out of the app when you hit the back button, and think how I don’t want my users to experience that annoyance. Who wants to scroll through all of your lessons looking for the one activity they want to do again, or email to their friend?

Deep linking is about a lot more than just SEO; it’s about usability.

This is a tutorial mainly for all of the other cut-and-pasters out there who don’t have the time or energy to truly learn how to create a proxy class for use with SWFAddress, and most likely aren’t programmers by trade. While I can appreciate some of the tutorials from the SWFAddress site that give a lot of technical minutiae about why you have to do things properly, and how bad practices will break your app, etc — sometimes a person just needs a way to make things work in a way they can understand. Some of those articles make you think that you can’t possibly get deep linking working unless you can write oodles of code yourself.

The reason I’m going to share my coding experience on this is because I googled the heck out of SWFAddress, datagrid, and Flex, to no avail. I didn’t find any direct examples of somebody using SWFAddress to create dynamic URLs from their datagrid within their Flex app. My husband joked that it must be because it’s so obvious that nobody has bothered to blog about it, but as you can find Flex examples, tutorials, and code for nearly every basic coding issue, I highly doubt that. So here you go!

---

Step 1: Gather your Tools

You will need the following items in order to complete this tutorial:

1. Your Flex/Flash building IDE (Flex Builder, Flash, FlashDevelop , etc).
2. SWFAddress 2.4 and SWFObject 2.2
3. GAforFlash (Google Analytics Tracking For Adobe Flash).
4. A good spreadsheet app.
5. An Apache or PHP setup you can test with, or website you can upload and test to.
6. A good search and replace editor like Notepad ++ to clean up the text you take out of the spreadsheets.
7. The free Vigos Gsitemap creator.

You can also download the file package for this tutorial, which includes a key file containing the actionscript examples from below: RoutingEvents.as[...]